Dependent Queries (Bloc)

Create queries that depend on other queries by extending QueryCubit and implementing conditional logic.

Basic Dependent Query

class UserPostsQueryCubit extends QueryCubit<List<Post>> {
  final String userId;

  UserPostsQueryCubit(this.userId);

  @override
  String get key => 'posts:user:$userId';

  @override
  Future<List<Post>> Function() get queryFn =>
    () => api.fetchUserPosts(userId);

  @override
  QueryOptions? get options => QueryOptions(
    enabled: userId.isNotEmpty,
  );
}

class UserPostsScreen extends StatelessWidget {
  final String userId;

  const UserPostsScreen({required this.userId});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('User Posts')),
      body: MultiBlocProvider(
        providers: [
          BlocProvider(create: (context) => UserProfileQueryCubit(userId)),
          BlocProvider(create: (context) => UserPostsQueryCubit(userId)),
        ],
        child: BlocBuilder<UserProfileQueryCubit, QueryState<User>>(
          builder: (context, userState) {
            if (userState.isLoading) {
              return Center(child: CircularProgressIndicator());
            }

            if (!userState.hasData) {
              return Center(child: Text('User not found'));
            }

            final postsCubit = context.read<UserPostsQueryCubit>();
            if (userState.hasData && postsCubit.state.isIdle) {
              postsCubit.refetch();
            }

            return BlocBuilder<UserPostsQueryCubit, QueryState<List<Post>>>(
              builder: (context, postsState) {
                if (postsState.isLoading) {
                  return Center(child: Text('Loading posts...'));
                }

                if (postsState.hasData) {
                  return PostsList(posts: postsState.data!);
                }

                return SizedBox();
              },
            );
          },
        ),
      ),
    );
  }
}

Conditional Enabling

Use the enabled option to control when queries execute:

class CategoryProductsQueryCubit extends QueryCubit<List<Product>> {
  final int? categoryId;

  CategoryProductsQueryCubit(this.categoryId);

  @override
  String get key => 'products:category:$categoryId';

  @override
  Future<List<Product>> Function() get queryFn =>
    () => api.fetchProducts(categoryId!);

  @override
  QueryOptions? get options => QueryOptions(
    enabled: categoryId != null,
  );
}

Dynamic Dependencies

Create queries with dynamic dependencies based on parent query state:

class UserDashboardScreen extends StatelessWidget {
  final String userId;

  const UserDashboardScreen({required this.userId});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: MultiBlocProvider(
        providers: [
          BlocProvider(create: (context) => UserProfileQueryCubit(userId)),
          BlocProvider(create: (context) => UserPostsQueryCubit(userId)),
          BlocProvider(create: (context) => UserFollowersQueryCubit(userId)),
        ],
        child: BlocBuilder<UserProfileQueryCubit, QueryState<User>>(
          builder: (context, userState) {
            if (userState.isLoading) {
              return Center(child: CircularProgressIndicator());
            }

            if (!userState.hasData) {
              return Center(child: Text('User not found'));
            }

            final user = userState.data!;

            return Column(
              children: [
                UserHeader(user: user),
                Expanded(
                  child: Row(
                    children: [
                      Expanded(
                        child: BlocBuilder<UserPostsQueryCubit, QueryState<List<Post>>>(
                          builder: (context, postsState) {
                            return PostsList(posts: postsState.data ?? []);
                          },
                        ),
                      ),
                      Expanded(
                        child: BlocBuilder<UserFollowersQueryCubit, QueryState<List<User>>>(
                          builder: (context, followersState) {
                            return FollowersList(followers: followersState.data ?? []);
                          },
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            );
          },
        ),
      ),
    );
  }
}

Next Steps

• QueryCubit - Learn about the QueryCubit
• Bloc Patterns - Best practices
• Examples - Complete working examples