lib/core/components/custom_modal_dialog.dart

@@ -1,5 +1,6 @@
 import 'package:enaklo_pos/core/components/spaces.dart';
 import 'package:enaklo_pos/core/constants/colors.dart';
+import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
 import 'package:flutter/material.dart';
 
 class CustomModalDialog extends StatelessWidget {
@@ -24,12 +25,14 @@ class CustomModalDialog extends StatelessWidget {
       ),
       child: ConstrainedBox(
         constraints: BoxConstraints(
-          minWidth: 200,
+          minWidth: context.deviceWidth * 0.3,
-          maxWidth: 600,
+          maxWidth: context.deviceWidth * 0.8,
-          minHeight: 200,
+          minHeight: context.deviceHeight * 0.3,
-          maxHeight: 600,
+          maxHeight: context.deviceHeight * 0.8,
         ),
+        child: IntrinsicWidth(
           child: Column(
+            mainAxisSize: MainAxisSize.min,
             children: [
               Container(
                 padding: const EdgeInsets.all(16),
@@ -37,8 +40,8 @@ class CustomModalDialog extends StatelessWidget {
                 decoration: BoxDecoration(
                   gradient: LinearGradient(
                     colors: [
+                      const Color.fromARGB(255, 81, 40, 134),
                       AppColors.primary,
-                    const Color.fromARGB(255, 67, 69, 195)
                     ],
                     begin: Alignment.topLeft,
                     end: Alignment.bottomRight,
@@ -68,6 +71,7 @@ class CustomModalDialog extends StatelessWidget {
                               style: TextStyle(
                                 color: AppColors.grey,
                                 fontSize: 16,
+                                fontWeight: FontWeight.w500,
                               ),
                             ),
                         ],
@@ -91,6 +95,7 @@ class CustomModalDialog extends StatelessWidget {
             ],
           ),
         ),
+      ),
     );
   }
 }

lib/core/constants/colors.dart

@@ -3,7 +3,6 @@ import 'package:flutter/material.dart';
 class AppColors {
   /// primary = #3949AB
   static const Color primary = Color(0xff36175e);
-  static const Color secondary = Color(0xfff1eaf9);
 
   /// grey = #B7B7B7
   static const Color grey = Color(0xffB7B7B7);
@@ -19,6 +18,7 @@ class AppColors {
 
   /// white = #FFFFFF
   static const Color white = Color(0xffFFFFFF);
+  static const Color whiteText = Color(0xfff1eaf9);
 
   /// green = #50C474
   static const Color green = Color(0xff50C474);

lib/presentation/home/dialog/type_dialog.dart

@@ -0,0 +1,101 @@
+import 'package:enaklo_pos/core/components/custom_modal_dialog.dart';
+import 'package:enaklo_pos/core/components/spaces.dart';
+import 'package:enaklo_pos/core/constants/colors.dart';
+import 'package:flutter/material.dart';
+
+class TypeDialog extends StatefulWidget {
+  const TypeDialog({super.key});
+
+  @override
+  State<TypeDialog> createState() => _TypeDialogState();
+}
+
+class _TypeDialogState extends State<TypeDialog> {
+  String selectedType = 'dine_in';
+
+  List<Map<String, dynamic>> types = [
+    {'value': 'dine_in', 'label': 'Dine In', 'icon': Icons.restaurant_outlined},
+    {
+      'value': 'take_away',
+      'label': 'Take Away',
+      'icon': Icons.takeout_dining_outlined
+    },
+    {
+      'value': 'delivery',
+      'label': 'Delivery',
+      'icon': Icons.delivery_dining_outlined
+    },
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    return CustomModalDialog(
+      title: 'Pilih Tipe',
+      subtitle: 'Silahkan pilih tipe yang sesuai',
+      child: Padding(
+        padding: const EdgeInsets.all(16.0),
+        child: Column(
+          children: List.generate(types.length, (index) {
+            return _buildItem(context, types[index]);
+          }),
+        ),
+      ),
+    );
+  }
+
+  Widget _buildItem(BuildContext context, Map<String, dynamic> type) {
+    return GestureDetector(
+      onTap: () {
+        setState(() {
+          selectedType = type['value']!;
+        });
+      },
+      child: Container(
+        padding: const EdgeInsets.symmetric(vertical: 12.0, horizontal: 16.0),
+        margin: const EdgeInsets.only(bottom: 8.0),
+        decoration: BoxDecoration(
+          color: selectedType == type['value']
+              ? AppColors.primary
+              : AppColors.white,
+          borderRadius: BorderRadius.circular(8.0),
+          border: Border.all(
+            color: selectedType == type['value']
+                ? AppColors.primary
+                : AppColors.grey,
+            width: 1.0,
+          ),
+        ),
+        child: Row(
+          children: [
+            Icon(type['icon'],
+                color: selectedType == type['value']
+                    ? AppColors.white
+                    : AppColors.black),
+            SpaceWidth(12.0),
+            Expanded(
+              child: Text(
+                type['label']!,
+                style: TextStyle(
+                  fontSize: 16,
+                  color: selectedType == type['value']
+                      ? AppColors.white
+                      : AppColors.black,
+                  fontWeight: FontWeight.bold,
+                ),
+                maxLines: 2,
+                overflow: TextOverflow.ellipsis,
+              ),
+            ),
+            SpaceWidth(12.0),
+            Icon(
+              Icons.check_circle,
+              color: selectedType == type['value']
+                  ? AppColors.green
+                  : Colors.transparent,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/presentation/home/widgets/home_right_title.dart

@@ -2,6 +2,7 @@ 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/dialog/type_dialog.dart';
 import 'package:enaklo_pos/presentation/home/pages/dashboard_page.dart';
 import 'package:flutter/material.dart';
 
@@ -74,7 +75,13 @@ class HomeRightTitle extends StatelessWidget {
                   width: 180.0,
                   height: 40,
                   elevation: 0,
-                  onPressed: () {},
+                  onPressed: () {
+                    showDialog(
+                        context: context,
+                        builder: (context) {
+                          return TypeDialog();
+                        });
+                  },
                   mainAxisAlignment: MainAxisAlignment.start,
                   crossAxisAlignment: CrossAxisAlignment.start,
                   icon: Icon(