From 0a9d53e5bd46a5be00dad9faa246d5a69e5dafd6 Mon Sep 17 00:00:00 2001
From: mohammad <malnemer@uba.com.jo>
Date: Thu, 29 May 2025 10:48:12 +0300
Subject: [PATCH] Refactor ConditionToggle widget to display icons with
 corresponding conditions

---
 .../routines/widgets/condition_toggle.dart    | 53 ++++++++++++++-----
 1 file changed, 41 insertions(+), 12 deletions(-)

diff --git a/lib/pages/routines/widgets/condition_toggle.dart b/lib/pages/routines/widgets/condition_toggle.dart
index 99ea2f04..b86ba0b3 100644
--- a/lib/pages/routines/widgets/condition_toggle.dart
+++ b/lib/pages/routines/widgets/condition_toggle.dart
@@ -12,22 +12,51 @@ class ConditionToggle extends StatelessWidget {
   });
 
   static const _conditions = ["<", "==", ">"];
+  static const _icons = [
+    Icons.chevron_left,
+    Icons.drag_handle,
+    Icons.chevron_right
+  ];
 
   @override
   Widget build(BuildContext context) {
-    return ToggleButtons(
-      onPressed: (index) => onChanged(_conditions[index]),
-      borderRadius: const BorderRadius.all(Radius.circular(8)),
-      selectedBorderColor: ColorsManager.primaryColorWithOpacity,
-      selectedColor: Colors.white,
-      fillColor: ColorsManager.primaryColorWithOpacity,
-      color: ColorsManager.primaryColorWithOpacity,
-      constraints: const BoxConstraints(
-        minHeight: 40.0,
-        minWidth: 40.0,
+    final selectedIndex = _conditions.indexOf(currentCondition ?? "==");
+
+    return Container(
+      height: 80,
+      decoration: BoxDecoration(
+        color: ColorsManager.grayColor,
+        borderRadius: BorderRadius.circular(50),
+      ),
+      clipBehavior: Clip.antiAlias,
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: List.generate(_conditions.length, (index) {
+          final isSelected = index == selectedIndex;
+          return Expanded(
+            child: GestureDetector(
+              onTap: () => onChanged(_conditions[index]),
+              child: AnimatedContainer(
+                duration: const Duration(milliseconds: 180),
+                curve: Curves.ease,
+                decoration: BoxDecoration(
+                  color: isSelected ? ColorsManager.blue1 : Colors.transparent,
+                ),
+                child: Center(
+                  child: Icon(
+                    _icons[index],
+                    size: 38,
+                    color: isSelected
+                        ? ColorsManager.whiteColors
+                        : ColorsManager.blackColor,
+                    weight: isSelected ? 700 : 500,
+                  ),
+                ),
+              ),
+            ),
+          );
+        }),
       ),
-      isSelected: _conditions.map((c) => c == (currentCondition ?? "==")).toList(),
-      children: _conditions.map((c) => Text(c)).toList(),
     );
   }
 }