apskel-pos-flutter/lib/presentation/setting/pages/product_page.dart

import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import 'package:enaklo_pos/data/datasources/product_remote_datasource.dart';
import 'package:enaklo_pos/presentation/setting/bloc/get_products/get_products_bloc.dart';
import 'package:enaklo_pos/presentation/setting/bloc/update_product/update_product_bloc.dart';
import 'package:enaklo_pos/presentation/setting/bloc/sync_product/sync_product_bloc.dart';
import 'package:enaklo_pos/presentation/setting/bloc/add_product/add_product_bloc.dart';
import 'package:enaklo_pos/presentation/setting/dialogs/form_product_dialog.dart';
import 'package:enaklo_pos/presentation/setting/widgets/add_data.dart';
import 'package:enaklo_pos/presentation/setting/widgets/menu_product_item.dart';
import 'package:enaklo_pos/presentation/setting/widgets/settings_title.dart';

class ProductPage extends StatefulWidget {
  const ProductPage({super.key});

  @override
  State<ProductPage> createState() => _ProductPageState();
}

class _ProductPageState extends State<ProductPage> {
  @override
  void initState() {
    context.read<GetProductsBloc>().add(const GetProductsEvent.fetch());
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: ListView(
        padding: const EdgeInsets.all(24.0),
        children: [
          const SettingsTitle('Manage Products'),
          const SizedBox(height: 24),
          BlocBuilder<GetProductsBloc, GetProductsState>(
            builder: (context, state) {
              return state.maybeWhen(orElse: () {
                return const Center(
                  child: CircularProgressIndicator(),
                );
              }, success: (products) {
                return GridView.builder(
                  padding: EdgeInsets.zero,
                  gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
                    childAspectRatio: 1,
                    crossAxisCount: 3,
                    mainAxisSpacing: 12,
                    crossAxisSpacing: 12,
                  ),
                  itemCount: products.length + 1,
                  shrinkWrap: true,
                  physics: const ScrollPhysics(),
                  itemBuilder: (BuildContext context, int index) {
                    if (index == 0) {
                      return AddData(
                        title: 'Add New Product',
                        onPressed: () {
                          showDialog(
                            context: context,
                            builder: (context) => MultiBlocProvider(
                              providers: [
                                BlocProvider(
                                  create: (context) => AddProductBloc(ProductRemoteDatasource()),
                                ),
                                BlocProvider.value(
                                  value: context.read<SyncProductBloc>(),
                                ),
                                BlocProvider.value(
                                  value: context.read<GetProductsBloc>(),
                                ),
                              ],
                              child: const FormProductDialog(),
                            ),
                          );
                        },
                      );
                    }
                    final item = products[index - 1];
                    return MenuProductItem(
                      data: item, 
                      onTapEdit: () {
                        showDialog(
                          context: context,
                          builder: (context) => MultiBlocProvider(
                            providers: [
                              BlocProvider(
                                create: (context) => UpdateProductBloc(ProductRemoteDatasource()),
                              ),
                              BlocProvider.value(
                                value: context.read<SyncProductBloc>(),
                              ),
                              BlocProvider.value(
                                value: context.read<GetProductsBloc>(),
                              ),
                            ],
                            child: FormProductDialog(product: item),
                          ),
                        );
                      },
                    );
                  },
                );
              });
            },
          ),
        ],
      ),
      // floatingActionButton: FloatingActionButton(
      //   onPressed: () {

      //   },
      //   child: const Icon(Icons.add),
      // ),
    );
  }
}