lib/core/components/buttons.dart

@@ -18,10 +18,6 @@ class Button extends StatelessWidget {
     this.icon,
     this.disabled = false,
     this.fontSize = 16.0,
-    this.elevation,
-    this.labelStyle,
-    this.mainAxisAlignment = MainAxisAlignment.center,
-    this.crossAxisAlignment = CrossAxisAlignment.center,
   });
 
   const Button.outlined({
@@ -37,10 +33,6 @@ class Button extends StatelessWidget {
     this.icon,
     this.disabled = false,
     this.fontSize = 16.0,
-    this.elevation,
-    this.labelStyle,
-    this.mainAxisAlignment = MainAxisAlignment.center,
-    this.crossAxisAlignment = CrossAxisAlignment.center,
   });
 
   final Function() onPressed;
@@ -51,13 +43,9 @@ class Button extends StatelessWidget {
   final double? width;
   final double height;
   final double borderRadius;
-  final double? elevation;
   final Widget? icon;
   final bool disabled;
   final double fontSize;
-  final TextStyle? labelStyle;
-  final MainAxisAlignment mainAxisAlignment;
-  final CrossAxisAlignment crossAxisAlignment;
 
   @override
   Widget build(BuildContext context) {
@@ -72,12 +60,11 @@ class Button extends StatelessWidget {
                 shape: RoundedRectangleBorder(
                   borderRadius: BorderRadius.circular(borderRadius),
                 ),
-                elevation: elevation,
                 padding: const EdgeInsets.symmetric(horizontal: 16.0),
               ),
               child: Row(
-                mainAxisAlignment: mainAxisAlignment,
+                mainAxisAlignment: MainAxisAlignment.center,
-                crossAxisAlignment: crossAxisAlignment,
+                mainAxisSize: MainAxisSize.min,
                 children: [
                   icon ?? const SizedBox.shrink(),
                   if (icon != null) const SizedBox(width: 10.0),
@@ -86,11 +73,10 @@ class Button extends StatelessWidget {
                       fit: BoxFit.scaleDown,
                       child: Text(
                         label,
-                        style: labelStyle ??
+                        style: TextStyle(
-                            TextStyle(
                           color: disabled ? Colors.grey : textColor,
                           fontSize: fontSize,
-                              fontWeight: FontWeight.bold,
+                          fontWeight: FontWeight.w600,
                         ),
                         textAlign: TextAlign.center,
                       ),
@@ -103,15 +89,14 @@ class Button extends StatelessWidget {
               onPressed: disabled ? null : onPressed,
               style: OutlinedButton.styleFrom(
                 backgroundColor: color,
-                side: const BorderSide(color: AppColors.primary),
+                side: const BorderSide(color: Colors.grey),
                 shape: RoundedRectangleBorder(
                   borderRadius: BorderRadius.circular(borderRadius),
                 ),
                 padding: const EdgeInsets.symmetric(horizontal: 16.0),
               ),
               child: Row(
-                mainAxisAlignment: mainAxisAlignment,
+                mainAxisAlignment: MainAxisAlignment.center,
-                crossAxisAlignment: crossAxisAlignment,
                 mainAxisSize: MainAxisSize.min,
                 children: [
                   icon ?? const SizedBox.shrink(),
@@ -121,8 +106,7 @@ class Button extends StatelessWidget {
                       fit: BoxFit.scaleDown,
                       child: Text(
                         label,
-                        style: labelStyle ??
+                        style: TextStyle(
-                            TextStyle(
                           color: disabled ? Colors.grey : textColor,
                           fontSize: fontSize,
                           fontWeight: FontWeight.w600,

lib/core/components/custom_modal_dialog.dart

@@ -1,96 +0,0 @@
-import 'package:enaklo_pos/core/components/spaces.dart';
-import 'package:enaklo_pos/core/constants/colors.dart';
-import 'package:flutter/material.dart';
-
-class CustomModalDialog extends StatelessWidget {
-  final String title;
-  final String? subtitle;
-  final Widget child;
-  final VoidCallback? onClose;
-
-  const CustomModalDialog(
-      {super.key,
-      required this.title,
-      this.subtitle,
-      required this.child,
-      this.onClose});
-
-  @override
-  Widget build(BuildContext context) {
-    return Dialog(
-      backgroundColor: AppColors.white,
-      shape: RoundedRectangleBorder(
-        borderRadius: BorderRadius.circular(16),
-      ),
-      child: ConstrainedBox(
-        constraints: BoxConstraints(
-          minWidth: 200,
-          maxWidth: 600,
-          minHeight: 200,
-          maxHeight: 600,
-        ),
-        child: Column(
-          children: [
-            Container(
-              padding: const EdgeInsets.all(16),
-              width: double.infinity,
-              decoration: BoxDecoration(
-                gradient: LinearGradient(
-                  colors: [
-                    AppColors.primary,
-                    const Color.fromARGB(255, 67, 69, 195)
-                  ],
-                  begin: Alignment.topLeft,
-                  end: Alignment.bottomRight,
-                ),
-                borderRadius: BorderRadius.vertical(
-                  top: Radius.circular(16),
-                ),
-              ),
-              child: Row(
-                mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                children: [
-                  Expanded(
-                    child: Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        Text(
-                          title,
-                          style: TextStyle(
-                            color: AppColors.white,
-                            fontSize: 20,
-                            fontWeight: FontWeight.bold,
-                          ),
-                        ),
-                        if (subtitle != null)
-                          Text(
-                            subtitle ?? '',
-                            style: TextStyle(
-                              color: AppColors.grey,
-                              fontSize: 16,
-                            ),
-                          ),
-                      ],
-                    ),
-                  ),
-                  SpaceWidth(12),
-                  IconButton(
-                    icon: Icon(Icons.close, color: AppColors.white),
-                    onPressed: () {
-                      if (onClose != null) {
-                        onClose!();
-                      } else {
-                        Navigator.of(context).pop();
-                      }
-                    },
-                  ),
-                ],
-              ),
-            ),
-            child,
-          ],
-        ),
-      ),
-    );
-  }
-}

lib/core/constants/colors.dart

@@ -2,8 +2,7 @@ import 'package:flutter/material.dart';
 
 class AppColors {
   /// primary = #3949AB
-  static const Color primary = Color(0xff36175e);
+  static const Color primary = Color(0xff6466f1);
-  static const Color secondary = Color(0xfff1eaf9);
 
   /// grey = #B7B7B7
   static const Color grey = Color(0xffB7B7B7);
@@ -37,6 +36,4 @@ class AppColors {
 
   /// stroke = #EFF0F6
   static const Color stroke = Color(0xffEFF0F6);
-
-  static const Color background = Color.fromARGB(255, 241, 241, 241);
 }

lib/core/constants/theme.dart

@@ -1,38 +0,0 @@
-import 'package:enaklo_pos/core/constants/colors.dart';
-import 'package:flutter/material.dart';
-import 'package:google_fonts/google_fonts.dart';
-
-ThemeData getApplicationTheme = ThemeData(
-  primaryColor: AppColors.primary,
-  scaffoldBackgroundColor: AppColors.white,
-  appBarTheme: AppBarTheme(
-    color: AppColors.white,
-    elevation: 0,
-    titleTextStyle: GoogleFonts.quicksand(
-      color: AppColors.primary,
-      fontSize: 16.0,
-      fontWeight: FontWeight.w500,
-    ),
-    iconTheme: const IconThemeData(
-      color: AppColors.primary,
-    ),
-  ),
-  fontFamily: GoogleFonts.quicksand().fontFamily,
-  colorScheme: ColorScheme.fromSeed(seedColor: AppColors.primary),
-  useMaterial3: true,
-  inputDecorationTheme: InputDecorationTheme(
-    contentPadding: const EdgeInsets.symmetric(horizontal: 16.0),
-    border: OutlineInputBorder(
-      borderRadius: BorderRadius.circular(8.0),
-      borderSide: BorderSide(color: AppColors.primary),
-    ),
-    focusedBorder: OutlineInputBorder(
-      borderRadius: BorderRadius.circular(8.0),
-      borderSide: BorderSide(color: AppColors.primary),
-    ),
-    enabledBorder: OutlineInputBorder(
-      borderRadius: BorderRadius.circular(8.0),
-      borderSide: BorderSide(color: AppColors.primary),
-    ),
-  ),
-);

lib/data/datasources/product_local_datasource.dart

@@ -151,7 +151,7 @@ class ProductLocalDatasource {
       final dbExists = await databaseExists(path);
       if (dbExists) {
         log("Deleting existing database to ensure new schema with order_type column");
-        // await deleteDatabase(path);
+        await deleteDatabase(path);
       }
     } catch (e) {
       log("Error deleting database: $e");

lib/main.dart

@@ -1,6 +1,7 @@
 import 'dart:developer';
-import 'package:enaklo_pos/core/constants/theme.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:enaklo_pos/data/dataoutputs/laman_print.dart';
 import 'package:enaklo_pos/data/datasources/auth_local_datasource.dart';
 import 'package:enaklo_pos/data/datasources/auth_remote_datasource.dart';
 import 'package:enaklo_pos/data/datasources/category_remote_datasource.dart';
@@ -38,6 +39,7 @@ import 'package:enaklo_pos/presentation/setting/bloc/update_product/update_produ
 import 'package:enaklo_pos/presentation/setting/bloc/update_printer/update_printer_bloc.dart';
 import 'package:enaklo_pos/presentation/table/blocs/change_position_table/change_position_table_bloc.dart';
 import 'package:enaklo_pos/presentation/table/blocs/create_table/create_table_bloc.dart';
+import 'package:enaklo_pos/presentation/table/blocs/generate_table/generate_table_bloc.dart';
 import 'package:enaklo_pos/presentation/table/blocs/get_table/get_table_bloc.dart';
 import 'package:enaklo_pos/presentation/home/bloc/local_product/local_product_bloc.dart';
 import 'package:enaklo_pos/presentation/home/bloc/order/order_bloc.dart';
@@ -49,7 +51,9 @@ import 'package:enaklo_pos/presentation/setting/bloc/sync_product/sync_product_b
 import 'package:enaklo_pos/presentation/setting/bloc/tax_settings/tax_settings_bloc.dart';
 import 'package:enaklo_pos/presentation/table/blocs/update_table/update_table_bloc.dart';
 import 'package:enaklo_pos/presentation/home/bloc/add_order_items/add_order_items_bloc.dart';
+import 'package:enaklo_pos/presentation/table/pages/new_table_management_page.dart';
 import 'package:google_fonts/google_fonts.dart';
+// import 'package:imin_printer/imin_printer.dart';
 
 import 'core/constants/colors.dart';
 import 'presentation/auth/bloc/login/login_bloc.dart';
@@ -57,6 +61,8 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 
 import 'presentation/home/pages/dashboard_page.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:hive/hive.dart';
+import 'package:path_provider/path_provider.dart';
 
 void main() async {
   WidgetsFlutterBinding.ensureInitialized();
@@ -110,8 +116,7 @@ class _MyAppState extends State<MyApp> {
               LocalProductBloc(ProductLocalDatasource.instance),
         ),
         BlocProvider(
-          create: (context) =>
+          create: (context) => CheckoutBloc(settingsLocalDatasource: SettingsLocalDatasource()),
-              CheckoutBloc(settingsLocalDatasource: SettingsLocalDatasource()),
         ),
         BlocProvider(
           create: (context) => TaxSettingsBloc(SettingsLocalDatasource()),
@@ -187,8 +192,7 @@ class _MyAppState extends State<MyApp> {
           create: (context) => QrisBloc(MidtransRemoteDatasource()),
         ),
         BlocProvider(
-          create: (context) =>
+          create: (context) => PaymentMethodsBloc(PaymentMethodsRemoteDatasource()),
-              PaymentMethodsBloc(PaymentMethodsRemoteDatasource()),
         ),
         BlocProvider(
           create: (context) => OnlineCheckerBloc(),
@@ -218,7 +222,25 @@ class _MyAppState extends State<MyApp> {
       child: MaterialApp(
         debugShowCheckedModeBanner: false,
         title: 'POS Resto App',
-        theme: getApplicationTheme,
+        theme: ThemeData(
+          colorScheme: ColorScheme.fromSeed(seedColor: AppColors.primary),
+          useMaterial3: true,
+          textTheme: GoogleFonts.quicksandTextTheme(
+            Theme.of(context).textTheme,
+          ),
+          appBarTheme: AppBarTheme(
+            color: AppColors.white,
+            elevation: 0,
+            titleTextStyle: GoogleFonts.quicksand(
+              color: AppColors.primary,
+              fontSize: 16.0,
+              fontWeight: FontWeight.w500,
+            ),
+            iconTheme: const IconThemeData(
+              color: AppColors.primary,
+            ),
+          ),
+        ),
         home: FutureBuilder<bool>(
             future: AuthLocalDataSource().isAuthDataExists(),
             builder: (context, snapshot) {

lib/presentation/home/dialog/discount_dialog.dart

@@ -1,5 +1,3 @@
-import 'package:enaklo_pos/core/components/spaces.dart';
-import 'package:enaklo_pos/data/models/response/discount_response_model.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
@@ -27,38 +25,29 @@ class _DiscountDialogState extends State<DiscountDialog> {
   @override
   Widget build(BuildContext context) {
     return AlertDialog(
-      backgroundColor: AppColors.white,
+      title: Stack(
-      title: Row(
+        alignment: Alignment.center,
         children: [
-          Expanded(
+          const Text(
-            child: Column(
+            'DISKON',
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text(
-                  'Pilih Diskon',
             style: TextStyle(
-                    fontSize: 18,
+              color: AppColors.primary,
-                    fontWeight: FontWeight.bold,
+              fontSize: 28,
-                    color: AppColors.black,
+              fontWeight: FontWeight.w600,
             ),
           ),
-                const SizedBox(height: 4.0),
+          Align(
-                Text(
+            alignment: Alignment.centerRight,
-                  'Pilih diskon yang ingin diterapkan pada pesanan',
+            child: IconButton(
-                  style: TextStyle(
-                    fontSize: 14,
-                    color: Colors.grey,
-                  ),
-                ),
-              ],
-            ),
-          ),
-          SpaceWidth(12),
-          IconButton(
-            icon: const Icon(Icons.close, color: AppColors.black),
               onPressed: () {
                 context.pop();
               },
+              icon: const Icon(
+                Icons.cancel,
+                color: AppColors.primary,
+                size: 30.0,
+              ),
+            ),
           ),
         ],
       ),
@@ -74,19 +63,15 @@ class _DiscountDialogState extends State<DiscountDialog> {
                 crossAxisAlignment: CrossAxisAlignment.start,
                 mainAxisSize: MainAxisSize.min,
                 children: discounts
-                    .map((discount) => _buildDiscountItem(discount))
+                    .map(
-                    .toList(),
+                      (discount) => ListTile(
-              );
+                        title: Text('Nama Diskon: ${discount.name}'),
-            },
+                        subtitle: Text('Potongan harga (${discount.value}%)'),
-          );
+                        contentPadding: EdgeInsets.zero,
-        },
+                        textColor: AppColors.primary,
-      ),
+                        trailing: Checkbox(
-    );
+                          value: discount.id == discountIdSelected,
-  }
+                          onChanged: (value) {
-
-  Widget _buildDiscountItem(Discount discount) {
-    return GestureDetector(
-      onTap: () {
                             setState(() {
                               discountIdSelected = discount.id!;
                               context.read<CheckoutBloc>().add(
@@ -96,44 +81,17 @@ class _DiscountDialogState extends State<DiscountDialog> {
                                   );
                             });
                           },
-      child: Container(
-        padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 12.0),
-        margin: const EdgeInsets.only(bottom: 8.0),
-        decoration: BoxDecoration(
-          color: discountIdSelected == discount.id
-              ? AppColors.primary
-              : AppColors.white,
-          borderRadius: BorderRadius.circular(8.0),
-          border: Border.all(
-            color: discountIdSelected == discount.id
-                ? AppColors.primary
-                : AppColors.grey,
-            width: 1.0,
                         ),
+                        onTap: () {
+                          // context.pop();
+                        },
                       ),
-        child: Row(
+                    )
-          children: [
+                    .toList(),
-            Expanded(
+              );
-              child: Text(
+            },
-                "${discount.name} (${discount.value})",
+          );
-                style: TextStyle(
+        },
-                  fontSize: 16,
-                  color: discountIdSelected == discount.id
-                      ? AppColors.white
-                      : AppColors.black,
-                  fontWeight: FontWeight.w500,
-                ),
-                maxLines: 2,
-                overflow: TextOverflow.ellipsis,
-              ),
-            ),
-            SpaceWidth(12.0),
-            Icon(Icons.check_circle,
-                color: discountIdSelected == discount.id
-                    ? AppColors.green
-                    : Colors.transparent),
-          ],
-        ),
       ),
     );
   }

lib/presentation/home/dialog/service_dialog.dart

@@ -1,4 +1,3 @@
-import 'package:enaklo_pos/core/components/spaces.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
@@ -12,38 +11,27 @@ class ServiceDialog extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return AlertDialog(
-      backgroundColor: AppColors.white,
+      title: Stack(
-      title: Row(
+        alignment: Alignment.center,
         children: [
-          Expanded(
+          const Text(
-            child: Column(
+            'LAYANAN',
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text(
-                  'Pilih Layanan',
             style: TextStyle(
-                    fontSize: 18,
+              color: AppColors.primary,
-                    fontWeight: FontWeight.bold,
+              fontSize: 28,
-                    color: AppColors.black,
+              fontWeight: FontWeight.w600,
             ),
           ),
-                const SizedBox(height: 4.0),
+          Align(
-                Text(
+            alignment: Alignment.centerRight,
-                  'Pilih layanan yang ingin diterapkan pada pesanan',
+            child: IconButton(
-                  style: TextStyle(
+              onPressed: () => context.pop(),
-                    fontSize: 14,
+              icon: const Icon(
-                    color: Colors.grey,
+                Icons.cancel,
+                color: AppColors.primary,
+                size: 30.0,
               ),
             ),
-              ],
-            ),
-          ),
-          SpaceWidth(12),
-          IconButton(
-            icon: const Icon(Icons.close, color: AppColors.black),
-            onPressed: () {
-              context.pop();
-            },
           ),
         ],
       ),
@@ -56,8 +44,23 @@ class ServiceDialog extends StatelessWidget {
               return state.maybeWhen(
                 initial: () => const SizedBox(),
                 loading: () => const Center(child: CircularProgressIndicator()),
-                loaded: (data, a, b, c, d, service, e, f, g, orderType) =>
+                loaded: (data, a, b, c, d, service, e, f, g, orderType) => ListTile(
-                    _buildServiceItem(context, service),
+                  title: Text('Presentase ($service%)'),
+                  subtitle: const Text('Biaya layanan'),
+                  contentPadding: EdgeInsets.zero,
+                  textColor: AppColors.primary,
+                  trailing: Checkbox(
+                    value: service > 0,
+                    onChanged: (value) {
+                      context.read<CheckoutBloc>().add(
+                            CheckoutEvent.addServiceCharge(service > 0 ? 0 : service),
+                          );
+                    },
+                  ),
+                  onTap: () {
+                    context.pop();
+                  },
+                ),
                 orElse: () => const SizedBox(),
               );
             },
@@ -66,47 +69,4 @@ class ServiceDialog extends StatelessWidget {
       ),
     );
   }
-
-  Widget _buildServiceItem(BuildContext context, int service) {
-    return GestureDetector(
-      onTap: () {
-        context.read<CheckoutBloc>().add(
-              CheckoutEvent.addServiceCharge(service > 0 ? 0 : service),
-            );
-      },
-      child: Container(
-        padding: const EdgeInsets.symmetric(vertical: 8.0, horizontal: 12.0),
-        margin: const EdgeInsets.only(bottom: 8.0),
-        decoration: BoxDecoration(
-          color: AppColors.primary,
-          borderRadius: BorderRadius.circular(8.0),
-          border: Border.all(
-            color: AppColors.primary,
-            width: 1.0,
-          ),
-        ),
-        child: Row(
-          children: [
-            Expanded(
-              child: Text(
-                "Biaya layanan ($service%)",
-                style: TextStyle(
-                  fontSize: 16,
-                  color: AppColors.white,
-                  fontWeight: FontWeight.w500,
-                ),
-                maxLines: 2,
-                overflow: TextOverflow.ellipsis,
-              ),
-            ),
-            SpaceWidth(12.0),
-            Icon(
-              Icons.check_circle,
-              color: AppColors.green,
-            ),
-          ],
-        ),
-      ),
-    );
-  }
 }

lib/presentation/home/pages/home_page.dart

@@ -1,5 +1,4 @@
 // ignore_for_file: public_member_api_docs, sort_constructors_first
-import 'package:enaklo_pos/presentation/home/widgets/home_right_title.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
@@ -8,7 +7,10 @@ import 'package:enaklo_pos/core/extensions/int_ext.dart';
 import 'package:enaklo_pos/core/extensions/string_ext.dart';
 import 'package:enaklo_pos/data/models/response/table_model.dart';
 import 'package:enaklo_pos/presentation/home/bloc/local_product/local_product_bloc.dart';
+import 'package:enaklo_pos/presentation/home/dialog/discount_dialog.dart';
+import 'package:enaklo_pos/presentation/home/dialog/tax_dialog.dart';
 import 'package:enaklo_pos/presentation/home/pages/confirm_payment_page.dart';
+import 'package:enaklo_pos/presentation/home/pages/dashboard_page.dart';
 import 'package:enaklo_pos/data/datasources/product_local_datasource.dart';
 import 'package:enaklo_pos/presentation/setting/bloc/sync_product/sync_product_bloc.dart';
 import 'package:enaklo_pos/data/models/response/product_response_model.dart';
@@ -18,6 +20,8 @@ import '../../../core/components/buttons.dart';
 import '../../../core/components/spaces.dart';
 import '../../../core/constants/colors.dart';
 import '../bloc/checkout/checkout_bloc.dart';
+import '../dialog/service_dialog.dart';
+import '../widgets/column_button.dart';
 import '../widgets/custom_tab_bar.dart';
 import '../widgets/home_title.dart';
 import '../widgets/order_menu.dart';
@@ -27,10 +31,10 @@ class HomePage extends StatefulWidget {
   final bool isTable;
   final TableModel? table;
   const HomePage({
-    super.key,
+    Key? key,
     required this.isTable,
     this.table,
-  });
+  }) : super(key: key);
 
   @override
   State<HomePage> createState() => _HomePageState();
@@ -79,12 +83,9 @@ class _HomePageState extends State<HomePage> {
     }).toList();
   }
 
-  List<Product> _filterProductsByCategory(
+  List<Product> _filterProductsByCategory(List<Product> products, int categoryId) {
-      List<Product> products, int categoryId) {
     final filteredBySearch = _filterProducts(products);
-    return filteredBySearch
+    return filteredBySearch.where((element) => element.category?.id == categoryId).toList();
-        .where((element) => element.category?.id == categoryId)
-        .toList();
   }
 
   @override
@@ -92,7 +93,6 @@ class _HomePageState extends State<HomePage> {
     return Hero(
       tag: 'confirmation_screen',
       child: Scaffold(
-        backgroundColor: AppColors.white,
         body: BlocListener<SyncProductBloc, SyncProductState>(
           listener: (context, state) {
             state.maybeWhen(
@@ -123,6 +123,9 @@ class _HomePageState extends State<HomePage> {
                 flex: 3,
                 child: Align(
                   alignment: AlignmentDirectional.topStart,
+                  child: Padding(
+                    padding: const EdgeInsets.all(16.0),
+                    child: SingleChildScrollView(
                       child: Column(
                         mainAxisAlignment: MainAxisAlignment.start,
                         children: [
@@ -134,16 +137,17 @@ class _HomePageState extends State<HomePage> {
                               });
                             },
                           ),
+                          const SizedBox(height: 24),
                           BlocBuilder<LocalProductBloc, LocalProductState>(
                             builder: (context, state) {
-                          return Expanded(
+                              return CustomTabBar(
-                            child: CustomTabBarV2(
                                 tabTitles: const [
                                   'Semua',
                                   'Makanan',
                                   'Minuman',
                                   'Paket'
                                 ],
+                                initialTabIndex: 0,
                                 tabViews: [
                                   // All Products Tab
                                   SizedBox(
@@ -156,23 +160,23 @@ class _HomePageState extends State<HomePage> {
                                         child: CircularProgressIndicator(),
                                       );
                                     }, loaded: (products) {
-                                    final filteredProducts =
+                                      final filteredProducts = _filterProducts(products);
-                                        _filterProducts(products);
                                       if (filteredProducts.isEmpty) {
                                         return const Center(
                                           child: Text('No Items Found'),
                                         );
                                       }
                                       return GridView.builder(
+                                        shrinkWrap: true,
                                         itemCount: filteredProducts.length,
-                                      padding: const EdgeInsets.all(16),
+                                        physics:
+                                            const NeverScrollableScrollPhysics(),
                                         gridDelegate:
-                                          SliverGridDelegateWithMaxCrossAxisExtent(
+                                            const SliverGridDelegateWithFixedCrossAxisCount(
-                                        maxCrossAxisExtent:
-                                            200, // Lebar maksimal tiap item (bisa kamu ubah)
-                                        mainAxisSpacing: 30,
-                                        crossAxisSpacing: 30,
                                           childAspectRatio: 0.85,
+                                          crossAxisCount: 3,
+                                          crossAxisSpacing: 30.0,
+                                          mainAxisSpacing: 30.0,
                                         ),
                                         itemBuilder: (context, index) =>
                                             ProductCard(
@@ -198,20 +202,20 @@ class _HomePageState extends State<HomePage> {
                                           child: Text('No Items'),
                                         );
                                       }
-                                    final filteredProducts =
+                                      final filteredProducts = _filterProductsByCategory(products, 1);
-                                        _filterProductsByCategory(products, 1);
                                       return filteredProducts.isEmpty
                                           ? const _IsEmpty()
                                           : GridView.builder(
+                                              shrinkWrap: true,
                                               itemCount: filteredProducts.length,
-                                            padding: const EdgeInsets.all(16),
+                                              physics:
+                                                  const NeverScrollableScrollPhysics(),
                                               gridDelegate:
-                                                SliverGridDelegateWithMaxCrossAxisExtent(
+                                                  const SliverGridDelegateWithFixedCrossAxisCount(
-                                              maxCrossAxisExtent:
-                                                  200, // Lebar maksimal tiap item (bisa kamu ubah)
-                                              mainAxisSpacing: 30,
-                                              crossAxisSpacing: 30,
                                                 childAspectRatio: 0.85,
+                                                crossAxisCount: 3,
+                                                crossAxisSpacing: 30.0,
+                                                mainAxisSpacing: 30.0,
                                               ),
                                               itemBuilder: (context, index) =>
                                                   ProductCard(
@@ -237,20 +241,20 @@ class _HomePageState extends State<HomePage> {
                                           child: Text('No Items'),
                                         );
                                       }
-                                    final filteredProducts =
+                                      final filteredProducts = _filterProductsByCategory(products, 2);
-                                        _filterProductsByCategory(products, 2);
                                       return filteredProducts.isEmpty
                                           ? const _IsEmpty()
                                           : GridView.builder(
+                                              shrinkWrap: true,
                                               itemCount: filteredProducts.length,
-                                            padding: const EdgeInsets.all(16),
+                                              physics:
+                                                  const NeverScrollableScrollPhysics(),
                                               gridDelegate:
-                                                SliverGridDelegateWithMaxCrossAxisExtent(
+                                                  const SliverGridDelegateWithFixedCrossAxisCount(
-                                              maxCrossAxisExtent:
-                                                  200, // Lebar maksimal tiap item (bisa kamu ubah)
-                                              mainAxisSpacing: 30,
-                                              crossAxisSpacing: 30,
                                                 childAspectRatio: 0.85,
+                                                crossAxisCount: 3,
+                                                crossAxisSpacing: 30.0,
+                                                mainAxisSpacing: 30.0,
                                               ),
                                               itemBuilder: (context, index) {
                                                 return ProductCard(
@@ -277,20 +281,20 @@ class _HomePageState extends State<HomePage> {
                                           child: Text('No Items'),
                                         );
                                       }
-                                    final filteredProducts =
+                                      final filteredProducts = _filterProductsByCategory(products, 3);
-                                        _filterProductsByCategory(products, 3);
                                       return filteredProducts.isEmpty
                                           ? const _IsEmpty()
                                           : GridView.builder(
+                                              shrinkWrap: true,
                                               itemCount: filteredProducts.length,
-                                            padding: const EdgeInsets.all(16),
+                                              physics:
+                                                  const NeverScrollableScrollPhysics(),
                                               gridDelegate:
-                                                SliverGridDelegateWithMaxCrossAxisExtent(
+                                                  const SliverGridDelegateWithFixedCrossAxisCount(
-                                              maxCrossAxisExtent:
-                                                  200, // Lebar maksimal tiap item (bisa kamu ubah)
-                                              mainAxisSpacing: 30,
-                                              crossAxisSpacing: 30,
                                                 childAspectRatio: 0.85,
+                                                crossAxisCount: 3,
+                                                crossAxisSpacing: 30.0,
+                                                mainAxisSpacing: 30.0,
                                               ),
                                               itemBuilder: (context, index) {
                                                 return ProductCard(
@@ -302,7 +306,6 @@ class _HomePageState extends State<HomePage> {
                                     }),
                                   ),
                                 ],
-                            ),
                               );
                             },
                           ),
@@ -310,25 +313,64 @@ class _HomePageState extends State<HomePage> {
                       ),
                     ),
                   ),
+                ),
+              ),
               Expanded(
                 flex: 2,
                 child: Align(
                   alignment: Alignment.topCenter,
-                  child: Material(
+                  child: Stack(
-                    color: Colors.white,
-                    child: Column(
                     children: [
-                        HomeRightTitle(
+                      SingleChildScrollView(
-                          table: widget.table,
+                        padding: const EdgeInsets.all(24.0),
+                        child: Column(
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            GestureDetector(
+                              onTap: () {
+                                if (widget.table == null) {
+                                  context.push(DashboardPage(
+                                    index: 1,
+                                  ));
+                                }
+                              },
+                              child: Text(
+                                'Meja: ${widget.table == null ? 'Belum Pilih Meja' : '${widget.table!.id}'}',
+                                style: TextStyle(
+                                  color: AppColors.primary,
+                                  fontSize: 20,
+                                  fontWeight: FontWeight.w600,
                                 ),
-                        Padding(
+                              ),
-                          padding: const EdgeInsets.all(16.0)
+                            ),
-                              .copyWith(bottom: 0, top: 27),
+                            const SpaceHeight(8.0),
-                          child: Column(
+                            Button.filled(
-                            children: [
+                              width: 180.0,
+                              height: 40,
+                              onPressed: () {},
+                              label: 'Pesanan#',
+                            ),
+
+                            // Row(
+                            //   children: [
+                            //     Button.filled(
+                            //       width: 120.0,
+                            //       height: 40,
+                            //       onPressed: () {},
+                            //       label: 'Dine In',
+                            //     ),
+                            //     const SpaceWidth(8.0),
+                            //     Button.outlined(
+                            //       width: 100.0,
+                            //       height: 40,
+                            //       onPressed: () {},
+                            //       label: 'To Go',
+                            //     ),
+                            //   ],
+                            // ),
+                            const SpaceHeight(16.0),
                             const Row(
-                                mainAxisAlignment:
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                                    MainAxisAlignment.spaceBetween,
                               children: [
                                 Text(
                                   'Item',
@@ -366,16 +408,7 @@ class _HomePageState extends State<HomePage> {
                             ),
                             const SpaceHeight(8),
                             const Divider(),
-                            ],
+                            const SpaceHeight(8),
-                          ),
-                        ),
-                        Expanded(
-                          child: SingleChildScrollView(
-                            padding:
-                                const EdgeInsets.all(16.0).copyWith(top: 0),
-                            child: Column(
-                              crossAxisAlignment: CrossAxisAlignment.start,
-                              children: [
                             BlocBuilder<CheckoutBloc, CheckoutState>(
                               builder: (context, state) {
                                 return state.maybeWhen(
@@ -390,8 +423,7 @@ class _HomePageState extends State<HomePage> {
                                       serviceCharge,
                                       totalQuantity,
                                       totalPrice,
-                                          draftName,
+                                      draftName, orderType) {
-                                          orderType) {
                                     if (products.isEmpty) {
                                       return const Center(
                                         child: Text('No Items'),
@@ -412,26 +444,45 @@ class _HomePageState extends State<HomePage> {
                               },
                             ),
                             const SpaceHeight(8.0),
+                            Row(
+                              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+                              children: [
+                                ColumnButton(
+                                  label: 'Diskon',
+                                  svgGenImage: Assets.icons.diskon,
+                                  onPressed: () => showDialog(
+                                    context: context,
+                                    barrierDismissible: false,
+                                    builder: (context) => const DiscountDialog(),
+                                  ),
+                                ),
+                                ColumnButton(
+                                  label: 'Pajak PB1',
+                                  svgGenImage: Assets.icons.pajak,
+                                  onPressed: () => showDialog(
+                                    context: context,
+                                    builder: (context) => const TaxDialog(),
+                                  ),
+                                ),
+                                ColumnButton(
+                                  label: 'Layanan',
+                                  svgGenImage: Assets.icons.layanan,
+                                  onPressed: () => showDialog(
+                                    context: context,
+                                    builder: (context) => const ServiceDialog(),
+                                  ),
+                                ),
                               ],
                             ),
-                          ),
+                            const SpaceHeight(8.0),
-                        ),
-                        Padding(
-                          padding: const EdgeInsets.all(16.0).copyWith(top: 0),
-                          child: Column(
-                            children: [
                             const Divider(),
-                              const SpaceHeight(16.0),
+                            const SpaceHeight(8.0),
                             Row(
-                                mainAxisAlignment:
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                                    MainAxisAlignment.spaceBetween,
                               children: [
                                 const Text(
-                                    'Pajak',
+                                  'Pajak PB1',
-                                    style: TextStyle(
+                                  style: TextStyle(color: AppColors.grey),
-                                      color: AppColors.black,
-                                      fontWeight: FontWeight.bold,
-                                    ),
                                 ),
                                 BlocBuilder<CheckoutBloc, CheckoutState>(
                                   builder: (context, state) {
@@ -445,8 +496,7 @@ class _HomePageState extends State<HomePage> {
                                             serviceCharge,
                                             totalQuantity,
                                             totalPrice,
-                                              draftName,
+                                            draftName, orderType) {
-                                              orderType) {
                                           if (products.isEmpty) {
                                             return 0;
                                           }
@@ -463,17 +513,89 @@ class _HomePageState extends State<HomePage> {
                                 ),
                               ],
                             ),
-                              const SpaceHeight(16.0),
+                            const SpaceHeight(8.0),
                             Row(
-                                mainAxisAlignment:
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                                    MainAxisAlignment.spaceBetween,
+                              children: [
+                                const Text(
+                                  'Layanan',
+                                  style: TextStyle(color: AppColors.grey),
+                                ),
+                                BlocBuilder<CheckoutBloc, CheckoutState>(
+                                  builder: (context, state) {
+                                    final serviceCharge = state.maybeWhen(
+                                        orElse: () => 0,
+                                        loaded: (products,
+                                            discountModel,
+                                            discount,
+                                            discountAmount,
+                                            tax,
+                                            serviceCharge,
+                                            totalQuantity,
+                                            totalPrice,
+                                            draftName, orderType) {
+                                          return serviceCharge;
+                                        });
+                                    return Text(
+                                      '$serviceCharge %',
+                                      style: const TextStyle(
+                                        color: AppColors.primary,
+                                        fontWeight: FontWeight.w600,
+                                      ),
+                                    );
+                                  },
+                                ),
+                              ],
+                            ),
+                            const SpaceHeight(8.0),
+                            Row(
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                              children: [
+                                const Text(
+                                  'Diskon',
+                                  style: TextStyle(color: AppColors.grey),
+                                ),
+                                BlocBuilder<CheckoutBloc, CheckoutState>(
+                                  builder: (context, state) {
+                                    final discount = state.maybeWhen(
+                                        orElse: () => 0,
+                                        loaded: (products,
+                                            discountModel,
+                                            discount,
+                                            discountAmount,
+                                            tax,
+                                            serviceCharge,
+                                            totalQuantity,
+                                            totalPrice,
+                                            draftName, orderType) {
+                                          if (discountModel == null) {
+                                            return 0;
+                                          }
+                                          return discountModel.value!
+                                              .replaceAll('.00', '')
+                                              .toIntegerFromText;
+                                        });
+                                    return Text(
+                                      '$discount %',
+                                      style: const TextStyle(
+                                        color: AppColors.primary,
+                                        fontWeight: FontWeight.w600,
+                                      ),
+                                    );
+                                  },
+                                ),
+                              ],
+                            ),
+                            const SpaceHeight(8.0),
+                            Row(
+                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                               children: [
                                 const Text(
                                   'Sub total',
                                   style: TextStyle(
-                                      color: AppColors.black,
+                                      color: AppColors.grey,
                                       fontWeight: FontWeight.bold,
-                                    ),
+                                      fontSize: 16),
                                 ),
                                 BlocBuilder<CheckoutBloc, CheckoutState>(
                                   builder: (context, state) {
@@ -487,8 +609,7 @@ class _HomePageState extends State<HomePage> {
                                             serviceCharge,
                                             totalQuantity,
                                             totalPrice,
-                                              draftName,
+                                            draftName, orderType) {
-                                              orderType) {
                                           if (products.isEmpty) {
                                             return 0;
                                           }
@@ -505,20 +626,25 @@ class _HomePageState extends State<HomePage> {
                                       price.currencyFormatRp,
                                       style: const TextStyle(
                                           color: AppColors.primary,
-                                          fontWeight: FontWeight.w900,
+                                          fontWeight: FontWeight.bold,
-                                        ),
+                                          fontSize: 16),
                                     );
                                   },
                                 ),
                               ],
                             ),
-                              SpaceHeight(16.0),
+                            const SpaceHeight(100.0),
+                          ],
+                        ),
+                      ),
                       Align(
                         alignment: Alignment.bottomCenter,
-                                child: Expanded(
+                        child: ColoredBox(
+                          color: AppColors.white,
+                          child: Padding(
+                            padding: const EdgeInsets.symmetric(
+                                horizontal: 24.0, vertical: 16.0),
                             child: Button.filled(
-                                    borderRadius: 12,
-                                    elevation: 1,
                               onPressed: () {
                                 context.push(ConfirmPaymentPage(
                                   isTable: widget.isTable,
@@ -529,14 +655,11 @@ class _HomePageState extends State<HomePage> {
                             ),
                           ),
                         ),
-                            ],
-                          ),
                       ),
                     ],
                   ),
                 ),
               ),
-              ),
             ],
           ),
         ),

lib/presentation/home/widgets/custom_tab_bar.dart

@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
 
 import '../../../core/constants/colors.dart';
 
+
+
 class CustomTabBar extends StatefulWidget {
   final List<String> tabTitles;
   final int initialTabIndex;
@@ -32,12 +34,7 @@ class _CustomTabBarState extends State<CustomTabBar> {
     return Column(
       crossAxisAlignment: CrossAxisAlignment.stretch,
       children: [
-        Container(
+        Row(
-          padding: EdgeInsets.all(16),
-          decoration: BoxDecoration(
-            color: Colors.white,
-          ),
-          child: Row(
           children: List.generate(
             widget.tabTitles.length,
             (index) => GestureDetector(
@@ -47,21 +44,22 @@ class _CustomTabBarState extends State<CustomTabBar> {
                 });
               },
               child: Container(
-                  padding:
+                padding: const EdgeInsets.symmetric(vertical: 14),
-                      const EdgeInsets.symmetric(vertical: 6, horizontal: 12),
+                margin: const EdgeInsets.only(right: 32),
-                  margin: const EdgeInsets.only(right: 16),
                 decoration: BoxDecoration(
-                    borderRadius: BorderRadius.circular(8),
+                  border: _selectedIndex == index
-                    color: _selectedIndex == index
+                      ? const Border(
-                        ? AppColors.primary
+                          bottom: BorderSide(
-                        : Colors.transparent,
+                            width: 3.0,
+                            color: AppColors.primary,
+                          ),
+                        )
+                      : null,
                 ),
                 child: Text(
                   widget.tabTitles[index],
-                    style: TextStyle(
+                  style: const TextStyle(
-                      color: _selectedIndex == index
+                    color: AppColors.primary,
-                          ? Colors.white
-                          : AppColors.primary,
                     fontWeight: FontWeight.bold,
                   ),
                 ),
@@ -69,7 +67,6 @@ class _CustomTabBarState extends State<CustomTabBar> {
             ),
           ),
         ),
-        ),
         Padding(
           padding: const EdgeInsets.symmetric(vertical: 18.0),
           child: widget.tabViews[_selectedIndex],
@@ -78,59 +75,3 @@ class _CustomTabBarState extends State<CustomTabBar> {
     );
   }
 }
-
-class CustomTabBarV2 extends StatelessWidget {
-  final List<String> tabTitles;
-  final List<Widget> tabViews;
-
-  const CustomTabBarV2({
-    super.key,
-    required this.tabTitles,
-    required this.tabViews,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    return DefaultTabController(
-      length: tabTitles.length,
-      child: Column(
-        crossAxisAlignment: CrossAxisAlignment.start,
-        children: [
-          Material(
-            elevation: 0,
-            color: Colors.white,
-            borderOnForeground: false,
-            child: Padding(
-              padding: const EdgeInsets.symmetric(vertical: 16),
-              child: TabBar(
-                isScrollable: true,
-                tabAlignment: TabAlignment.start,
-                labelColor: AppColors.primary,
-                labelStyle: TextStyle(
-                  fontWeight: FontWeight.bold,
-                ),
-                dividerColor: AppColors.primary,
-                unselectedLabelColor: AppColors.primary,
-                indicatorSize: TabBarIndicatorSize.label,
-                indicatorWeight: 4,
-                indicatorColor: AppColors.primary,
-                tabs: tabTitles
-                    .map((title) => Padding(
-                          padding: const EdgeInsets.symmetric(horizontal: 16),
-                          child: Tab(text: title),
-                        ))
-                    .toList(),
-              ),
-            ),
-          ),
-          Expanded(
-            // ✅ ini bagian penting
-            child: TabBarView(
-              children: tabViews,
-            ),
-          ),
-        ],
-      ),
-    );
-  }
-}

lib/presentation/home/widgets/home_right_title.dart

@@ -1,116 +0,0 @@
-import 'package:enaklo_pos/core/components/buttons.dart';
-import 'package:enaklo_pos/core/constants/colors.dart';
-import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
-import 'package:enaklo_pos/data/models/response/table_model.dart';
-import 'package:enaklo_pos/presentation/home/pages/dashboard_page.dart';
-import 'package:flutter/material.dart';
-
-class HomeRightTitle extends StatelessWidget {
-  final TableModel? table;
-  const HomeRightTitle({super.key, this.table});
-
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      height: context.deviceHeight * 0.1,
-      decoration: BoxDecoration(
-        color: AppColors.primary,
-        border: Border(
-          left: BorderSide(
-            color: Colors.white,
-            width: 1.0,
-          ),
-        ),
-      ),
-      child: Column(
-        mainAxisSize: MainAxisSize.min,
-        children: [
-          Row(
-            children: [
-              Expanded(
-                child: Button.filled(
-                  width: 180.0,
-                  height: 40,
-                  elevation: 0,
-                  onPressed: () {},
-                  mainAxisAlignment: MainAxisAlignment.start,
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  icon: Icon(
-                    Icons.list,
-                    color: Colors.white,
-                    size: 24,
-                  ),
-                  label: 'Daftar Pesanan',
-                ),
-              ),
-              Expanded(
-                child: Button.filled(
-                  width: 180.0,
-                  height: 40,
-                  elevation: 0,
-                  mainAxisAlignment: MainAxisAlignment.start,
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  icon: Icon(
-                    Icons.person_outline,
-                    color: Colors.white,
-                    size: 24,
-                  ),
-                  onPressed: () {
-                    if (table == null) {
-                      context.push(DashboardPage(
-                        index: 1,
-                      ));
-                    }
-                  },
-                  label: 'Pelanggan',
-                ),
-              ),
-            ],
-          ),
-          Row(
-            children: [
-              Expanded(
-                child: Button.filled(
-                  width: 180.0,
-                  height: 40,
-                  elevation: 0,
-                  onPressed: () {},
-                  mainAxisAlignment: MainAxisAlignment.start,
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  icon: Icon(
-                    Icons.dinner_dining_outlined,
-                    color: Colors.white,
-                    size: 24,
-                  ),
-                  label: 'Dine In',
-                ),
-              ),
-              Expanded(
-                child: Button.filled(
-                  width: 180.0,
-                  height: 40,
-                  elevation: 0,
-                  icon: Icon(
-                    Icons.table_restaurant_outlined,
-                    color: Colors.white,
-                    size: 24,
-                  ),
-                  onPressed: () {
-                    if (table == null) {
-                      context.push(DashboardPage(
-                        index: 1,
-                      ));
-                    }
-                  },
-                  mainAxisAlignment: MainAxisAlignment.start,
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  label: table == null ? 'Pilih Meja' : '${table!.id}',
-                ),
-              ),
-            ],
-          ),
-        ],
-      ),
-    );
-  }
-}

lib/presentation/home/widgets/home_title.dart

@@ -1,5 +1,5 @@
-import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
 import 'package:flutter/material.dart';
+import 'package:enaklo_pos/core/extensions/date_time_ext.dart';
 
 import '../../../core/components/search_input.dart';
 import '../../../core/constants/colors.dart';
@@ -16,23 +16,30 @@ class HomeTitle extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return Row(
-      height: context.deviceHeight * 0.1,
-      padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
-      decoration: BoxDecoration(
-        color: AppColors.white,
-      ),
-      child: Row(
       mainAxisAlignment: MainAxisAlignment.spaceBetween,
+      children: [
+        Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
           children: [
             const Text(
-            'DEFAULT OUTLET',
+              'Enaklo POS',
               style: TextStyle(
                 color: AppColors.primary,
-              fontSize: 28,
+                fontSize: 22,
                 fontWeight: FontWeight.w600,
               ),
             ),
+            const SizedBox(height: 4.0),
+            Text(
+              DateTime.now().toFormattedDate(),
+              style: const TextStyle(
+                color: AppColors.subtitle,
+                fontSize: 16,
+              ),
+            ),
+          ],
+        ),
         SizedBox(
           width: 300.0,
           child: SearchInput(
@@ -42,7 +49,6 @@ class HomeTitle extends StatelessWidget {
           ),
         ),
       ],
-      ),
     );
   }
 }

lib/presentation/home/widgets/item_notes_dialog.dart

@@ -1,11 +1,12 @@
-import 'package:enaklo_pos/core/constants/colors.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:enaklo_pos/presentation/home/bloc/checkout/checkout_bloc.dart';
 import 'package:enaklo_pos/presentation/home/models/product_quantity.dart';
+import 'package:enaklo_pos/data/models/response/product_response_model.dart';
 
 import '../../../core/components/buttons.dart';
 import '../../../core/components/spaces.dart';
+import '../../../core/constants/colors.dart';
 
 class ItemNotesDialog extends StatefulWidget {
   final ProductQuantity item;
@@ -37,52 +38,24 @@ class _ItemNotesDialogState extends State<ItemNotesDialog> {
   @override
   Widget build(BuildContext context) {
     return AlertDialog(
-      backgroundColor: Colors.white,
+      title: const Text('Add Notes'),
-      title: Row(
-        children: [
-          Expanded(
-            child: Column(
-              crossAxisAlignment: CrossAxisAlignment.start,
-              children: [
-                Text(
-                  widget.item.product.name ?? 'Catatan Item',
-                  style: TextStyle(
-                    fontSize: 18,
-                    fontWeight: FontWeight.bold,
-                    color: AppColors.black,
-                  ),
-                  maxLines: 2,
-                  overflow: TextOverflow.ellipsis,
-                ),
-                const SizedBox(height: 4.0),
-                Text(
-                  'Masukkan catatan untuk item ini',
-                  style: TextStyle(
-                    fontSize: 14,
-                    color: Colors.grey,
-                  ),
-                ),
-              ],
-            ),
-          ),
-          SpaceWidth(12),
-          IconButton(
-            icon: const Icon(Icons.close, color: AppColors.black),
-            onPressed: () {
-              Navigator.of(context).pop();
-            },
-          ),
-        ],
-      ),
       content: Column(
         mainAxisSize: MainAxisSize.min,
         crossAxisAlignment: CrossAxisAlignment.start,
         children: [
+          Text(
+            widget.item.product.name ?? 'Product',
+            style: const TextStyle(
+              fontSize: 16,
+              fontWeight: FontWeight.w600,
+            ),
+          ),
+          const SpaceHeight(16.0),
           TextField(
             controller: notesController,
             maxLines: 3,
             decoration: const InputDecoration(
-              hintText: 'Masukkan catatan untuk item ini',
+              hintText: 'Enter notes for this item...',
               border: OutlineInputBorder(),
             ),
           ),

lib/presentation/home/widgets/order_menu.dart

@@ -6,42 +6,15 @@ import 'package:enaklo_pos/core/extensions/int_ext.dart';
 import 'package:enaklo_pos/core/extensions/string_ext.dart';
 import 'package:enaklo_pos/presentation/home/bloc/checkout/checkout_bloc.dart';
 import 'package:enaklo_pos/presentation/home/models/product_quantity.dart';
+import 'package:enaklo_pos/presentation/home/widgets/item_notes_dialog.dart';
 
 import '../../../core/components/spaces.dart';
 import '../../../core/constants/colors.dart';
 
-class OrderMenu extends StatefulWidget {
+class OrderMenu extends StatelessWidget {
   final ProductQuantity data;
   const OrderMenu({super.key, required this.data});
 
-  @override
-  State<OrderMenu> createState() => _OrderMenuState();
-}
-
-class _OrderMenuState extends State<OrderMenu> {
-  final _controller = TextEditingController();
-
-  @override
-  void initState() {
-    super.initState();
-    _controller.text = widget.data.notes;
-
-    _controller.addListener(() {
-      context.read<CheckoutBloc>().add(
-            CheckoutEvent.updateItemNotes(
-              widget.data.product,
-              _controller.text,
-            ),
-          );
-    });
-  }
-
-  @override
-  void dispose() {
-    _controller.dispose();
-    super.dispose();
-  }
-
   @override
   Widget build(BuildContext context) {
     return Column(
@@ -60,34 +33,65 @@ class _OrderMenuState extends State<OrderMenu> {
                       //   color: AppColors.primary,
                       // ),
                       CachedNetworkImage(
-                    imageUrl: widget.data.product.image!.contains('http')
+                    imageUrl: data.product.image!.contains('http')
-                        ? widget.data.product.image!
+                        ? data.product.image!
-                        : '${Variables.baseUrl}/${widget.data.product.image}',
+                        : '${Variables.baseUrl}/${data.product.image}',
                     width: 50.0,
                     height: 50.0,
                     fit: BoxFit.cover,
-                    errorWidget: (context, url, error) =>
-                        const Icon(Icons.error),
                   ),
                 ),
                 title: Row(
                   children: [
                     Expanded(
-                      child: Text(widget.data.product.name ?? "-",
+                      child: Text(data.product.name ?? "-",
-                          maxLines: 1,
+                          maxLines: 2,
                           overflow: TextOverflow.ellipsis,
                           style: const TextStyle(
                             fontSize: 14,
                             fontWeight: FontWeight.bold,
                           )),
                     ),
+                    GestureDetector(
+                      onTap: () {
+                        showDialog(
+                          context: context,
+                          builder: (context) => ItemNotesDialog(item: data),
+                        );
+                      },
+                      child: const Icon(
+                        Icons.edit_note,
+                        size: 20,
+                        color: AppColors.primary,
+                      ),
+                    ),
                   ],
                 ),
                 subtitle: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
-                    Text(widget.data.product.price!.toIntegerFromText
+                    Text(data.product.price!.toIntegerFromText.currencyFormatRp),
-                        .currencyFormatRp),
+                    if (data.notes.isNotEmpty) ...[
+                      const SpaceHeight(4.0),
+                      Container(
+                        padding: const EdgeInsets.symmetric(
+                          horizontal: 8.0,
+                          vertical: 4.0,
+                        ),
+                        decoration: BoxDecoration(
+                          color: AppColors.primary.withOpacity(0.1),
+                          borderRadius: BorderRadius.circular(4.0),
+                        ),
+                        child: Text(
+                          'Notes: ${data.notes}',
+                          style: const TextStyle(
+                            fontSize: 12,
+                            color: AppColors.primary,
+                            fontStyle: FontStyle.italic,
+                          ),
+                        ),
+                      ),
+                    ],
                   ],
                 ),
               ),
@@ -98,7 +102,7 @@ class _OrderMenuState extends State<OrderMenu> {
                   onTap: () {
                     context
                         .read<CheckoutBloc>()
-                        .add(CheckoutEvent.removeItem(widget.data.product));
+                        .add(CheckoutEvent.removeItem(data.product));
                   },
                   child: Container(
                     width: 30,
@@ -114,14 +118,14 @@ class _OrderMenuState extends State<OrderMenu> {
                   width: 30.0,
                   child: Center(
                       child: Text(
-                    widget.data.quantity.toString(),
+                    data.quantity.toString(),
                   )),
                 ),
                 GestureDetector(
                   onTap: () {
                     context
                         .read<CheckoutBloc>()
-                        .add(CheckoutEvent.addItem(widget.data.product));
+                        .add(CheckoutEvent.addItem(data.product));
                   },
                   child: Container(
                     width: 30,
@@ -139,8 +143,7 @@ class _OrderMenuState extends State<OrderMenu> {
             SizedBox(
               width: 80.0,
               child: Text(
-                (widget.data.product.price!.toIntegerFromText *
+                (data.product.price!.toIntegerFromText * data.quantity)
-                        widget.data.quantity)
                     .currencyFormatRp,
                 textAlign: TextAlign.right,
                 style: const TextStyle(
@@ -151,40 +154,6 @@ class _OrderMenuState extends State<OrderMenu> {
             ),
           ],
         ),
-        SpaceHeight(8.0),
-        SizedBox(
-          height: 40,
-          child: Row(
-            children: [
-              Flexible(
-                child: TextFormField(
-                  cursorColor: AppColors.primary,
-                  controller: _controller,
-                  style: const TextStyle(
-                    fontSize: 12,
-                    color: AppColors.black,
-                  ),
-                  decoration: InputDecoration(
-                    hintText: 'Catatan Pesanan',
-                  ),
-                ),
-              ),
-              const SpaceWidth(16.0),
-              Container(
-                height: 40,
-                width: 40,
-                decoration: BoxDecoration(
-                  color: AppColors.primary,
-                  borderRadius: BorderRadius.circular(8.0),
-                ),
-                child: Icon(
-                  Icons.delete_outline,
-                  color: AppColors.white,
-                ),
-              ),
-            ],
-          ),
-        )
       ],
     );
   }

lib/presentation/home/widgets/product_card.dart

@@ -7,6 +7,7 @@ import 'package:enaklo_pos/core/extensions/string_ext.dart';
 import 'package:enaklo_pos/data/models/response/product_response_model.dart';
 import 'package:enaklo_pos/presentation/home/bloc/checkout/checkout_bloc.dart';
 
+import '../../../core/assets/assets.gen.dart';
 import '../../../core/components/spaces.dart';
 import '../../../core/constants/colors.dart';
 
@@ -28,11 +29,10 @@ class ProductCard extends StatelessWidget {
       },
       child: Container(
         padding: const EdgeInsets.all(16.0),
-        decoration: BoxDecoration(
+        decoration: ShapeDecoration(
-          color: AppColors.white,
+          shape: RoundedRectangleBorder(
-          borderRadius: BorderRadius.circular(12.0),
+            side: const BorderSide(width: 1, color: AppColors.card),
-          border: Border.all(
+            borderRadius: BorderRadius.circular(16),
-            color: AppColors.disabled,
           ),
         ),
         child: Stack(
@@ -50,25 +50,19 @@ class ProductCard extends StatelessWidget {
                   ),
                   child: ClipRRect(
                     borderRadius: BorderRadius.all(Radius.circular(40.0)),
-                    child: CachedNetworkImage(
+                    child:
+                        // Icon(
+                        //   Icons.fastfood,
+                        //   size: 40,
+                        //   color: AppColors.primary,
+                        // ),
+                        CachedNetworkImage(
                       imageUrl: data.image!.contains('http')
                           ? data.image!
                           : '${Variables.baseUrl}/${data.image}',
+                      width: 60,
+                      height: 60,
                       fit: BoxFit.cover,
-                      width: 60,
-                      height: 60,
-                      errorWidget: (context, url, error) => Container(
-                        width: 60,
-                        height: 60,
-                        decoration: BoxDecoration(
-                          shape: BoxShape.circle,
-                          color: AppColors.disabled.withOpacity(0.4),
-                        ),
-                        child: const Icon(
-                          Icons.image_not_supported,
-                          color: AppColors.grey,
-                        ),
-                      ),
                     ),
                   ),
                 ),
@@ -83,22 +77,19 @@ class ProductCard extends StatelessWidget {
                   overflow: TextOverflow.ellipsis,
                 ),
                 const Spacer(),
-                Align(
+                Row(
-                  alignment: Alignment.center,
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Flexible(
                       child: Text(
                         data.category?.name ?? '-',
                         style: const TextStyle(
-                      fontSize: 14,
                           color: AppColors.grey,
-                      fontWeight: FontWeight.w500,
+                          fontSize: 12,
-                    ),
-                    maxLines: 2,
-                    overflow: TextOverflow.ellipsis,
                         ),
                       ),
-                const Spacer(),
+                    ),
-                Align(
+                    Flexible(
-                  alignment: Alignment.center,
                       child: Text(
                         data.price!.toIntegerFromText.currencyFormatRp,
                         style: const TextStyle(
@@ -107,6 +98,8 @@ class ProductCard extends StatelessWidget {
                         ),
                       ),
                     ),
+                  ],
+                ),
                 const Spacer(),
               ],
             ),
@@ -156,8 +149,34 @@ class ProductCard extends StatelessWidget {
                                   ),
                                 ),
                               )
-                            : SizedBox.shrink()
+                            : Align(
-                        : SizedBox.shrink();
+                                alignment: Alignment.topRight,
+                                child: Container(
+                                  width: 36,
+                                  height: 36,
+                                  padding: const EdgeInsets.all(6),
+                                  decoration: const BoxDecoration(
+                                    borderRadius:
+                                        BorderRadius.all(Radius.circular(9.0)),
+                                    color: AppColors.primary,
+                                  ),
+                                  child: Assets.icons.shoppingBasket.svg(),
+                                ),
+                              )
+                        : Align(
+                            alignment: Alignment.topRight,
+                            child: Container(
+                              width: 36,
+                              height: 36,
+                              padding: const EdgeInsets.all(6),
+                              decoration: const BoxDecoration(
+                                borderRadius:
+                                    BorderRadius.all(Radius.circular(9.0)),
+                                color: AppColors.primary,
+                              ),
+                              child: Assets.icons.shoppingBasket.svg(),
+                            ),
+                          );
                   },
                 );
               },

lib/presentation/setting/pages/product_page.dart

@@ -1,5 +1,3 @@
-import 'package:enaklo_pos/core/components/buttons.dart';
-import 'package:enaklo_pos/core/constants/colors.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:enaklo_pos/data/datasources/product_remote_datasource.dart';
@@ -29,22 +27,40 @@ class _ProductPageState extends State<ProductPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: AppColors.background,
+      body: ListView(
-      body: Column(
+        padding: const EdgeInsets.all(24.0),
         children: [
-          SettingsTitle(
+          const SettingsTitle('Manage Products'),
-            'Kelola Produk',
+          const SizedBox(height: 24),
-            subtitle: 'Kelola produk anda',
+          BlocBuilder<GetProductsBloc, GetProductsState>(
-            actionWidget: [
+            builder: (context, state) {
-              Button.outlined(
+              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) =>
+                                  create: (context) => AddProductBloc(ProductRemoteDatasource()),
-                              AddProductBloc(ProductRemoteDatasource()),
                                 ),
                                 BlocProvider.value(
                                   value: context.read<SyncProductBloc>(),
@@ -57,30 +73,9 @@ class _ProductPageState extends State<ProductPage> {
                             ),
                           );
                         },
-                label: "Tambah Produk",
-                icon: Icon(Icons.add, color: AppColors.primary),
-              )
-            ],
-          ),
-          Expanded(
-            child: BlocBuilder<GetProductsBloc, GetProductsState>(
-              builder: (context, state) {
-                return state.maybeWhen(orElse: () {
-                  return const Center(
-                    child: CircularProgressIndicator(),
                       );
-                }, success: (products) {
+                    }
-                  return GridView.builder(
+                    final item = products[index - 1];
-                    padding: EdgeInsets.all(16),
-                    gridDelegate: SliverGridDelegateWithMaxCrossAxisExtent(
-                      maxCrossAxisExtent: 200,
-                      mainAxisSpacing: 30,
-                      crossAxisSpacing: 30,
-                      childAspectRatio: 0.85,
-                    ),
-                    itemCount: products.length,
-                    itemBuilder: (BuildContext context, int index) {
-                      final item = products[index];
                     return MenuProductItem(
                       data: item, 
                       onTapEdit: () {
@@ -89,8 +84,7 @@ class _ProductPageState extends State<ProductPage> {
                           builder: (context) => MultiBlocProvider(
                             providers: [
                               BlocProvider(
-                                  create: (context) => UpdateProductBloc(
+                                create: (context) => UpdateProductBloc(ProductRemoteDatasource()),
-                                      ProductRemoteDatasource()),
                               ),
                               BlocProvider.value(
                                 value: context.read<SyncProductBloc>(),
@@ -109,7 +103,6 @@ class _ProductPageState extends State<ProductPage> {
               });
             },
           ),
-          ),
         ],
       ),
       // floatingActionButton: FloatingActionButton(

lib/presentation/setting/pages/setting_tile.dart

@@ -1,72 +0,0 @@
-import 'package:enaklo_pos/core/components/spaces.dart';
-import 'package:enaklo_pos/core/constants/colors.dart';
-import 'package:flutter/material.dart';
-
-class SettingTile extends StatelessWidget {
-  final int index;
-  final int currentIndex;
-  final String title;
-  final String subtitle;
-  final IconData icon;
-  final Function() onTap;
-
-  const SettingTile({
-    super.key,
-    required this.title,
-    required this.subtitle,
-    required this.icon,
-    required this.onTap,
-    required this.index,
-    required this.currentIndex,
-  });
-
-  @override
-  Widget build(BuildContext context) {
-    return GestureDetector(
-      onTap: onTap,
-      child: Container(
-        padding: const EdgeInsets.all(12.0),
-        decoration: BoxDecoration(
-          border: Border(
-            right: BorderSide(
-              color: currentIndex == index
-                  ? AppColors.primary
-                  : Colors.transparent,
-              width: 4.0,
-            ),
-          ),
-        ),
-        child: Row(
-          children: [
-            Icon(
-              icon,
-              size: 24.0,
-              color: currentIndex == index ? AppColors.primary : AppColors.grey,
-            ),
-            const SpaceWidth(12),
-            Expanded(
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  Text(
-                    title,
-                    style: const TextStyle(
-                      fontSize: 16.0,
-                      fontWeight: FontWeight.bold,
-                    ),
-                  ),
-                  const SizedBox(height: 4.0),
-                  Text(
-                    subtitle,
-                    style:
-                        const TextStyle(fontSize: 14.0, color: AppColors.grey),
-                  ),
-                ],
-              ),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
-}

lib/presentation/setting/pages/settings_page.dart

@@ -1,14 +1,15 @@
-import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
-import 'package:enaklo_pos/presentation/setting/pages/setting_tile.dart';
 import 'package:flutter/material.dart';
 import 'package:enaklo_pos/data/datasources/auth_local_datasource.dart';
 import 'package:enaklo_pos/presentation/sales/pages/sales_page.dart';
 import 'package:enaklo_pos/presentation/setting/pages/discount_page.dart';
+import 'package:enaklo_pos/presentation/setting/pages/manage_printer_page.dart';
 import 'package:enaklo_pos/presentation/setting/pages/product_page.dart';
 import 'package:enaklo_pos/presentation/setting/pages/server_key_page.dart';
 import 'package:enaklo_pos/presentation/setting/pages/sync_data_page.dart';
 import 'package:enaklo_pos/presentation/setting/pages/tax_page.dart';
 
+import '../../../core/assets/assets.gen.dart';
+import '../../../core/components/spaces.dart';
 import '../../../core/constants/colors.dart';
 
 class SettingsPage extends StatefulWidget {
@@ -44,7 +45,6 @@ class _SettingsPageState extends State<SettingsPage> {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
-      backgroundColor: AppColors.background,
       body: Row(
         children: [
           // LEFT CONTENT
@@ -52,121 +52,106 @@ class _SettingsPageState extends State<SettingsPage> {
             flex: 2,
             child: Align(
               alignment: Alignment.topCenter,
-              child: Material(
+              child: ListView(
-                color: AppColors.white,
+                padding: const EdgeInsets.all(16.0),
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  children: [
-                    Container(
-                      padding: const EdgeInsets.symmetric(
-                        horizontal: 16.0,
-                        vertical: 12.0,
-                      ),
-                      width: double.infinity,
-                      height: context.deviceHeight * 0.1,
-                      decoration: const BoxDecoration(
-                        color: AppColors.white,
-                        border: Border(
-                          bottom: BorderSide(
-                            color: AppColors.background,
-                            width: 1.0,
-                          ),
-                        ),
-                      ),
-                      child: Column(
-                        crossAxisAlignment: CrossAxisAlignment.start,
                 children: [
                   const Text(
-                            'Pengaturan',
+                    'Settings',
                     style: TextStyle(
-                              color: AppColors.black,
+                      color: AppColors.primary,
-                              fontSize: 20,
+                      fontSize: 28,
                       fontWeight: FontWeight.w600,
                     ),
                   ),
-                          Text(
+                  const SpaceHeight(16.0),
-                            'Kelola pengaturan aplikasi',
-                            style: TextStyle(
-                              color: AppColors.grey,
-                              fontSize: 14,
-                            ),
-                          ),
-                        ],
-                      ),
-                    ),
-                    Expanded(
-                      child: SingleChildScrollView(
-                        child: Column(
-                          children: [
                   role != null && role! != 'admin'
                       ? const SizedBox()
-                                : SettingTile(
+                      : ListTile(
-                                    index: 0,
+                          contentPadding: const EdgeInsets.all(12.0),
-                                    currentIndex: currentIndex,
+                          leading: Assets.icons.kelolaProduk.svg(),
-                                    title: 'Kelola Produk',
+                          title: const Text('Manage Products'),
-                                    subtitle: 'Kelola produk anda',
+                          subtitle: const Text('Manage products in your store'),
-                                    icon: Icons.inventory_outlined,
+                          textColor: AppColors.primary,
+                          tileColor: currentIndex == 0
+                              ? AppColors.blueLight
+                              : Colors.transparent,
                           onTap: () => indexValue(0),
                         ),
-                            SettingTile(
+                  ListTile(
-                              index: 1,
+                    contentPadding: const EdgeInsets.all(12.0),
-                              currentIndex: currentIndex,
+                    leading: Assets.icons.kelolaDiskon.svg(),
-                              title: 'Kelola Diskon',
+                    title: const Text('Kelola Diskon'),
-                              subtitle: 'Kelola diskon pelanggan',
+                    subtitle: const Text('Kelola Diskon Pelanggan'),
-                              icon: Icons.discount_outlined,
+                    textColor: AppColors.primary,
+                    tileColor: currentIndex == 1
+                        ? AppColors.blueLight
+                        : Colors.transparent,
                     onTap: () => indexValue(1),
                   ),
-                            SettingTile(
+                  ListTile(
-                              index: 2,
+                    contentPadding: const EdgeInsets.all(12.0),
-                              currentIndex: currentIndex,
+                    leading: Assets.icons.dashboard.svg(),
-                              title: 'Riwayat Transaksi',
+                    title: const Text('History Transaksi'),
-                              subtitle: 'Lihat riwayat transaksi',
+                    subtitle: const Text('Lihat history transaksi'),
-                              icon: Icons.receipt_long_outlined,
+                    textColor: AppColors.primary,
+                    tileColor: currentIndex == 2
+                        ? AppColors.blueLight
+                        : Colors.transparent,
                     onTap: () => indexValue(2),
                   ),
-                            SettingTile(
+                  ListTile(
-                              index: 3,
+                    contentPadding: const EdgeInsets.all(12.0),
-                              currentIndex: currentIndex,
+                    leading: Assets.icons.kelolaPajak.svg(),
-                              title: 'Perhitungan Biaya',
+                    title: const Text('Perhitungan Biaya'),
-                              subtitle: 'Kelola biaya diluar biaya modal',
+                    subtitle: const Text('Kelola biaya diluar biaya modal'),
-                              icon: Icons.attach_money_outlined,
+                    textColor: AppColors.primary,
+                    tileColor: currentIndex == 3
+                        ? AppColors.blueLight
+                        : Colors.transparent,
                     onTap: () => indexValue(3),
                   ),
-                            SettingTile(
+                  ListTile(
-                              index: 4,
+                    contentPadding: const EdgeInsets.all(12.0),
-                              currentIndex: currentIndex,
+                    leading: Assets.icons.kelolaPajak.svg(),
-                              title: 'Sinkronisasi Data',
+                    title: const Text('Sync Data'),
-                              subtitle: 'Sinkronisasi data dari dan ke server',
+                    subtitle:
-                              icon: Icons.sync_outlined,
+                        const Text('Sinkronisasi data dari dan ke server'),
+                    textColor: AppColors.primary,
+                    tileColor: currentIndex == 4
+                        ? AppColors.blueLight
+                        : Colors.transparent,
                     onTap: () => indexValue(4),
                   ),
-                            SettingTile(
+                  ListTile(
-                              index: 6,
+                    contentPadding: const EdgeInsets.all(12.0),
-                              currentIndex: currentIndex,
+                    leading: Image.asset(Assets.images.manageQr.path,
-                              title: 'Qr Key Setting',
+                        fit: BoxFit.contain),
-                              subtitle: 'Kelola QR Key',
+                    title: const Text('QR Key Setting'),
-                              icon: Icons.qr_code_2_outlined,
+                    subtitle: const Text('QR Key Configuration'),
+                    textColor: AppColors.primary,
+                    tileColor: currentIndex == 6
+                        ? AppColors.blueLight
+                        : Colors.transparent,
                     onTap: () => indexValue(6),
                   ),
                 ],
               ),
             ),
           ),
-                  ],
-                ),
-              ),
-            ),
-          ),
 
           // RIGHT CONTENT
           Expanded(
             flex: 4,
             child: Align(
               alignment: AlignmentDirectional.topStart,
+              child: Padding(
+                padding: const EdgeInsets.all(16.0),
                 child: IndexedStack(
                   index: currentIndex,
                   children: [
-                  role != null && role! != 'admin' ? SizedBox() : ProductPage(),
+                    role != null && role! != 'admin'
+                        ? SizedBox()
+                        : ProductPage(),
                     DiscountPage(),
                     SalesPage(),
                     TaxPage(),
@@ -181,6 +166,7 @@ class _SettingsPageState extends State<SettingsPage> {
                 ),
               ),
             ),
+          ),
         ],
       ),
     );

lib/presentation/setting/widgets/menu_product_item.dart

@@ -1,6 +1,5 @@
 // ignore_for_file: public_member_api_docs, sort_constructors_first
 import 'package:cached_network_image/cached_network_image.dart';
-import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
 import 'package:flutter/material.dart';
 import 'package:enaklo_pos/data/models/response/product_response_model.dart';
 
@@ -12,221 +11,7 @@ import '../../../core/constants/variables.dart';
 class MenuProductItem extends StatelessWidget {
   final Product data;
   final Function() onTapEdit;
-  const MenuProductItem(
+  const MenuProductItem({
-      {super.key, required this.data, required this.onTapEdit});
-
-  @override
-  Widget build(BuildContext context) {
-    return Container(
-      padding: EdgeInsets.zero,
-      decoration: BoxDecoration(
-        color: AppColors.white,
-        borderRadius: BorderRadius.circular(12.0),
-      ),
-      child: Column(
-        mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: [
-          Padding(
-            padding: const EdgeInsets.all(8.0).copyWith(bottom: 0),
-            child: Stack(
-              children: [
-                AspectRatio(
-                  aspectRatio: 1.2,
-                  child: ClipRRect(
-                    borderRadius: BorderRadius.circular(12),
-                    child: CachedNetworkImage(
-                      imageUrl: data.image!.contains('http')
-                          ? data.image!
-                          : '${Variables.baseUrl}/${data.image}',
-                      fit: BoxFit.cover,
-                      errorWidget: (context, url, error) => Container(
-                        width: double.infinity,
-                        height: context.deviceHeight * 0.18,
-                        decoration: BoxDecoration(
-                          color: AppColors.grey.withOpacity(0.1),
-                          borderRadius: BorderRadius.circular(12),
-                        ),
-                        child: const Icon(
-                          Icons.image_outlined,
-                          color: AppColors.grey,
-                          size: 40,
-                        ),
-                      ),
-                    ),
-                  ),
-                ),
-                Positioned(
-                  top: 8,
-                  right: 8,
-                  child: Container(
-                    padding:
-                        const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
-                    decoration: BoxDecoration(
-                      color: AppColors.primary,
-                      borderRadius: BorderRadius.circular(8),
-                    ),
-                    child: Text(
-                      data.category?.name ?? "",
-                      style: const TextStyle(
-                        color: AppColors.white,
-                        fontSize: 10,
-                        fontWeight: FontWeight.w600,
-                      ),
-                    ),
-                  ),
-                ),
-              ],
-            ),
-          ),
-          Padding(
-            padding: const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
-            child: Row(
-              children: [
-                Expanded(
-                  child: Text(
-                    "${data.name}",
-                    style: const TextStyle(
-                      fontSize: 14,
-                      fontWeight: FontWeight.w700,
-                    ),
-                    maxLines: 1,
-                    overflow: TextOverflow.ellipsis,
-                  ),
-                ),
-              ],
-            ),
-          ),
-          Row(
-            children: [
-              Expanded(
-                child: GestureDetector(
-                  onTap: () {
-                    showDialog(
-                      context: context,
-                      builder: (context) {
-                        //container for product detail
-                        return AlertDialog(
-                          backgroundColor: AppColors.white,
-                          contentPadding: const EdgeInsets.all(16.0),
-                          content: Column(
-                            mainAxisSize: MainAxisSize.min,
-                            children: [
-                              Row(
-                                mainAxisAlignment:
-                                    MainAxisAlignment.spaceBetween,
-                                children: [
-                                  Text(
-                                    data.name!,
-                                    style: const TextStyle(
-                                      fontSize: 20,
-                                    ),
-                                  ),
-                                  IconButton(
-                                    onPressed: () {
-                                      Navigator.pop(context);
-                                    },
-                                    icon: const Icon(Icons.close),
-                                  ),
-                                ],
-                              ),
-                              const SpaceHeight(10.0),
-                              ClipRRect(
-                                borderRadius: const BorderRadius.all(
-                                    Radius.circular(10.0)),
-                                child: CachedNetworkImage(
-                                  imageUrl: '${Variables.baseUrl}${data.image}',
-                                  placeholder: (context, url) => const Center(
-                                      child: CircularProgressIndicator()),
-                                  errorWidget: (context, url, error) =>
-                                      const Icon(
-                                    Icons.food_bank_outlined,
-                                    size: 80,
-                                  ),
-                                  width: 80,
-                                ),
-                              ),
-                              const SpaceHeight(10.0),
-                              Text(
-                                data.category?.name ?? '-',
-                                style: const TextStyle(
-                                  fontSize: 12,
-                                  color: Colors.grey,
-                                ),
-                              ),
-                              const SpaceHeight(10.0),
-                              Text(
-                                data.price.toString(),
-                                style: const TextStyle(
-                                  fontSize: 12,
-                                  color: Colors.grey,
-                                ),
-                              ),
-                              const SpaceHeight(10.0),
-                              Text(
-                                data.stock.toString(),
-                                style: const TextStyle(
-                                  fontSize: 12,
-                                  color: Colors.grey,
-                                ),
-                              ),
-                              const SpaceHeight(10.0),
-                            ],
-                          ),
-                        );
-                      },
-                    );
-                  },
-                  child: Container(
-                    padding: const EdgeInsets.symmetric(vertical: 4),
-                    decoration: BoxDecoration(
-                      color: AppColors.primary,
-                      borderRadius: const BorderRadius.only(
-                        bottomLeft: Radius.circular(12),
-                      ),
-                    ),
-                    child: Icon(
-                      Icons.visibility_outlined,
-                      color: AppColors.white,
-                      size: 18,
-                    ),
-                  ),
-                ),
-              ),
-              Container(
-                width: 1,
-                color: AppColors.grey.withOpacity(0.2),
-              ),
-              Expanded(
-                child: GestureDetector(
-                  onTap: onTapEdit,
-                  child: Container(
-                    padding: const EdgeInsets.symmetric(vertical: 4),
-                    decoration: BoxDecoration(
-                      color: AppColors.primary,
-                      borderRadius: const BorderRadius.only(
-                        bottomRight: Radius.circular(12),
-                      ),
-                    ),
-                    child: Icon(
-                      Icons.edit_outlined,
-                      color: AppColors.white,
-                      size: 18,
-                    ),
-                  ),
-                ),
-              ),
-            ],
-          ),
-        ],
-      ),
-    );
-  }
-}
-
-class MenuProductItemOld extends StatelessWidget {
-  final Product data;
-  final Function() onTapEdit;
-  const MenuProductItemOld({
     super.key,
     required this.data,
     required this.onTapEdit,

lib/presentation/setting/widgets/settings_title.dart

@@ -1,57 +1,35 @@
-import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
 import 'package:flutter/material.dart';
 
 import '../../../core/components/search_input.dart';
 import '../../../core/constants/colors.dart';
 
+
+
 class SettingsTitle extends StatelessWidget {
   final String title;
-  final String? subtitle;
   final TextEditingController? controller;
   final Function(String value)? onChanged;
-  final List<Widget>? actionWidget;
 
   const SettingsTitle(
     this.title, {
     super.key,
     this.controller,
     this.onChanged,
-    this.actionWidget,
-    this.subtitle,
   });
 
   @override
   Widget build(BuildContext context) {
-    return Container(
+    return Row(
-      height: context.deviceHeight * 0.1,
-      padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 12.0),
-      decoration: BoxDecoration(
-        color: AppColors.white,
-      ),
-      child: Row(
       mainAxisAlignment: MainAxisAlignment.spaceBetween,
-        children: [
-          Column(
-            crossAxisAlignment: CrossAxisAlignment.start,
       children: [
         Text(
           title,
-                style: TextStyle(
+          style: const TextStyle(
-                  color: AppColors.black,
+            color: AppColors.primary,
             fontSize: 20,
             fontWeight: FontWeight.w600,
           ),
         ),
-              if (subtitle != null)
-                Text(
-                  subtitle ?? '',
-                  style: TextStyle(
-                    color: AppColors.grey,
-                    fontSize: 14,
-                  ),
-                ),
-            ],
-          ),
         if (controller != null)
           SizedBox(
             width: 300.0,
@@ -61,9 +39,7 @@ class SettingsTitle extends StatelessWidget {
               hintText: 'Search for food, coffe, etc..',
             ),
           ),
-          if (actionWidget != null) ...actionWidget!,
       ],
-      ),
     );
   }
 }