Mapping Products Cubit states to UI

Now let's edit ProductScreen class in product_screen.dart

class ProductsScreen extends StatelessWidget {
  const ProductsScreen({Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return BlocProvider(
      create: (_) => getIt<ProductsCubit>()..getAll(),
      child: Scaffold(
        appBar: AppBar(
          leading: IconButton(
            icon: const Icon(Icons.person, color: Colors.white),
            onPressed: () => context.navigator.push(Routes.profileScreen),
          ),
        ),
        floatingActionButton: const _CartButton(),
        body: SafeArea(
          child: Builder(
            builder: (context) => RefreshIndicator(
              onRefresh: context.read<ProductsCubit>().refresh,
              child: BlocBuilder<ProductsCubit, ProductsState>(
                buildWhen: (previous, current) => previous.maybeWhen(
                  loaded: (products) => false,
                  orElse: () => true,
                ),
                builder: (context, state) => state.maybeWhen(
                  error: (error) => _ProductsErrorWidget(error: error),
                  loaded: (products) => _ProductsGridView(products: products),
                  orElse: () => const Center(
                    child: CircularProgressIndicator(),
                  ),
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}