From 9c38d001d1df97ebe8d42779f87b3e242f3627ee Mon Sep 17 00:00:00 2001
From: efrilm <efril.mulanda@gmail.com>
Date: Sat, 25 Oct 2025 00:19:51 +0700
Subject: [PATCH] variant dialog

---
 .../components/card/product_card.dart         | 16 +++++-
 .../components/dialog/dialog.dart             |  2 +
 .../components/dialog/variant_dialog.dart     | 57 +++++++++++++++++++
 3 files changed, 74 insertions(+), 1 deletion(-)
 create mode 100644 lib/presentation/components/dialog/variant_dialog.dart

diff --git a/lib/presentation/components/card/product_card.dart b/lib/presentation/components/card/product_card.dart
index e0b775b..11a4d85 100644
--- a/lib/presentation/components/card/product_card.dart
+++ b/lib/presentation/components/card/product_card.dart
@@ -3,6 +3,7 @@ import 'package:flutter/material.dart';
 import '../../../common/extension/extension.dart';
 import '../../../common/theme/theme.dart';
 import '../../../domain/product/product.dart';
+import '../dialog/dialog.dart';
 import '../image/image.dart';
 import '../spaces/space.dart';
 
@@ -13,7 +14,20 @@ class ProductCard extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return GestureDetector(
-      onTap: () {},
+      onTap: () {
+        if (product.isActive == true) {
+          if (product.variants.isEmpty) {
+            // context.read<CheckoutBloc>().add(
+            //       CheckoutEvent.addItem(data, null),
+            //     );
+          } else {
+            showDialog(
+              context: context,
+              builder: (context) => VariantDialog(product: product),
+            );
+          }
+        }
+      },
       child: Container(
         decoration: BoxDecoration(
           color: AppColor.white,
diff --git a/lib/presentation/components/dialog/dialog.dart b/lib/presentation/components/dialog/dialog.dart
index 7b2af66..0de076f 100644
--- a/lib/presentation/components/dialog/dialog.dart
+++ b/lib/presentation/components/dialog/dialog.dart
@@ -5,6 +5,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 import '../../../application/outlet/outlet_loader/outlet_loader_bloc.dart';
 import '../../../common/extension/extension.dart';
 import '../../../common/theme/theme.dart';
+import '../../../domain/product/product.dart';
 import '../button/button.dart';
 import '../card/outlet_card.dart';
 import '../loader/loader_with_text.dart';
@@ -12,3 +13,4 @@ import '../spaces/space.dart';
 
 part 'custom_modal_dialog.dart';
 part 'outlet_dialog.dart';
+part 'variant_dialog.dart';
diff --git a/lib/presentation/components/dialog/variant_dialog.dart b/lib/presentation/components/dialog/variant_dialog.dart
new file mode 100644
index 0000000..97bb274
--- /dev/null
+++ b/lib/presentation/components/dialog/variant_dialog.dart
@@ -0,0 +1,57 @@
+part of 'dialog.dart';
+
+class VariantDialog extends StatelessWidget {
+  final Product product;
+  const VariantDialog({super.key, required this.product});
+
+  @override
+  Widget build(BuildContext context) {
+    return CustomModalDialog(
+      title: 'Pilih Varian',
+      subtitle: 'Silahkan pilih varian yang sesuai',
+      minWidth: context.deviceWidth * 0.4,
+      contentPadding: EdgeInsets.all(16),
+      child: Wrap(
+        spacing: 12,
+        runSpacing: 12,
+        crossAxisAlignment: WrapCrossAlignment.start,
+        runAlignment: WrapAlignment.start,
+        alignment: WrapAlignment.start,
+        children: product.variants.map((variant) {
+          return GestureDetector(
+            onTap: () {
+              // Aksi saat varian dipilih
+              // context.pop();
+              // context.read<CheckoutBloc>().add(
+              //       CheckoutEvent.addItem(product, variant),
+              //     );
+            },
+            child: Container(
+              width: (context.deviceWidth * 0.4 - 12 - 32) / 2 - 6, // 2 per row
+              padding: const EdgeInsets.all(12),
+              decoration: BoxDecoration(
+                border: Border.all(color: Colors.grey.shade300),
+                borderRadius: BorderRadius.circular(12),
+                color: Colors.white,
+              ),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.start,
+                children: [
+                  Text(
+                    variant.name,
+                    style: const TextStyle(fontWeight: FontWeight.bold),
+                  ),
+                  const SizedBox(height: 4),
+                  Text(
+                    variant.priceModifier.currencyFormatRpV2,
+                    style: TextStyle(color: AppColor.black),
+                  ),
+                ],
+              ),
+            ),
+          );
+        }).toList(),
+      ),
+    );
+  }
+}