add tow gang and change gang device ui

2025-08-26 01:39:40 +00:00 · 2025-04-17 16:14:48 +03:00
parent 3c92ea3047
commit 06b14a3964
8 changed files with 414 additions and 152 deletions
--- a/lib/features/devices/bloc/device_manager_bloc/device_manager_bloc.dart
+++ b/lib/features/devices/bloc/device_manager_bloc/device_manager_bloc.dart
@ -178,6 +178,7 @@ class DeviceManagerBloc extends Bloc<DeviceManagerEvent, DeviceManagerState> {
      DeviceType.CeilingSensor,
      DeviceType.ThreeGang,
      DeviceType.OneGang,
+      DeviceType.TwoGang
    };

    return devices
--- a/lib/features/scene/helper/functions_per_device/three_gang_functions.dart
+++ b/lib/features/scene/helper/functions_per_device/three_gang_functions.dart
@ -10,7 +10,7 @@ class ThreeGangHelperFunctions {
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsAcPower,
-        operationName: 'Light 1 Switch',
+        operationName: 'L - Light Switch',
        code: 'switch_1',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.onOff,
@ -21,11 +21,23 @@ class ThreeGangHelperFunctions {
              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
        ],
      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'L - Light Countdown',
+        code: 'countdown_1',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.countdown,
+        operationalValues: [
+          SceneOperationalValue(icon: '', value: 0),
+        ],
+      ),
      SceneStaticFunction(
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsAcPower,
-        operationName: 'Light 2 Switch',
+        operationName: 'M - Light Switch',
        code: 'switch_2',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.onOff,
@ -36,11 +48,23 @@ class ThreeGangHelperFunctions {
              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
        ],
      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'M - Light Countdown',
+        code: 'countdown_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.countdown,
+        operationalValues: [
+          SceneOperationalValue(icon: '', value: 0),
+        ],
+      ),
      SceneStaticFunction(
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsAcPower,
-        operationName: 'Light 3 Switch',
+        operationName: 'R - Light Switch',
        code: 'switch_3',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.onOff,
@ -55,31 +79,7 @@ class ThreeGangHelperFunctions {
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 1 CountDown',
-        code: 'countdown_1',
-        functionValue: functionValue,
-        operationDialogType: OperationDialogType.countdown,
-        operationalValues: [
-          SceneOperationalValue(icon: '', value: 0),
-        ],
-      ),
-      SceneStaticFunction(
-        deviceId: deviceId,
-        deviceName: deviceName,
-        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 2 CountDown',
-        code: 'countdown_2',
-        functionValue: functionValue,
-        operationDialogType: OperationDialogType.countdown,
-        operationalValues: [
-          SceneOperationalValue(icon: '', value: 0),
-        ],
-      ),
-      SceneStaticFunction(
-        deviceId: deviceId,
-        deviceName: deviceName,
-        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 3 CountDown',
+        operationName: 'R - Light Countdown',
        code: 'countdown_3',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.countdown,
@ -97,7 +97,7 @@ class ThreeGangHelperFunctions {
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsAcPower,
-        operationName: 'Light 1 Switch',
+        operationName: 'L - Light Switch',
        code: 'switch_1',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.onOff,
@ -108,41 +108,11 @@ class ThreeGangHelperFunctions {
              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
        ],
      ),
-      SceneStaticFunction(
-        deviceId: deviceId,
-        deviceName: deviceName,
-        icon: Assets.assetsAcPower,
-        operationName: 'Light 2 Switch',
-        code: 'switch_2',
-        functionValue: functionValue,
-        operationDialogType: OperationDialogType.onOff,
-        operationalValues: [
-          SceneOperationalValue(
-              icon: Assets.assetsAcPower, description: "ON", value: true),
-          SceneOperationalValue(
-              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
-        ],
-      ),
-      SceneStaticFunction(
-        deviceId: deviceId,
-        deviceName: deviceName,
-        icon: Assets.assetsAcPower,
-        operationName: 'Light 3 Switch',
-        code: 'switch_3',
-        functionValue: functionValue,
-        operationDialogType: OperationDialogType.onOff,
-        operationalValues: [
-          SceneOperationalValue(
-              icon: Assets.assetsAcPower, description: "ON", value: true),
-          SceneOperationalValue(
-              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
-        ],
-      ),
      SceneStaticFunction(
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 1 CountDown',
+        operationName: 'L - Light Countdown',
        code: 'countdown_1',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.integerSteps,
@ -157,11 +127,26 @@ class ThreeGangHelperFunctions {
          ),
        ],
      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'M - Light Switch',
+        code: 'switch_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
      SceneStaticFunction(
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 2 CountDown',
+        operationName: 'M - Light Countdown',
        code: 'countdown_2',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.integerSteps,
@ -176,11 +161,26 @@ class ThreeGangHelperFunctions {
          ),
        ],
      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'R - Light Switch',
+        code: 'switch_3',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
      SceneStaticFunction(
        deviceId: deviceId,
        deviceName: deviceName,
        icon: Assets.assetsLightCountdown,
-        operationName: 'Light 3 CountDown',
+        operationName: 'R - Light Countdown',
        code: 'countdown_3',
        functionValue: functionValue,
        operationDialogType: OperationDialogType.integerSteps,
--- a/lib/features/scene/helper/functions_per_device/tow_gang_helper_functions.dart
+++ b/lib/features/scene/helper/functions_per_device/tow_gang_helper_functions.dart
@ -0,0 +1,139 @@
+import 'package:syncrow_app/features/scene/enum/operation_dialog_type.dart';
+import 'package:syncrow_app/features/scene/model/scene_static_function.dart';
+import 'package:syncrow_app/generated/assets.dart';
+
+class TowGangHelperFunctions {
+  static List<SceneStaticFunction> towGangHelperFunctions(
+      String deviceId, String deviceName, functionValue) {
+    return [
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'L - Light Switch',
+        code: 'switch_1',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'L - Light CountDown',
+        code: 'countdown_1',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.countdown,
+        operationalValues: [
+          SceneOperationalValue(icon: '', value: 0),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'R - Light Switch',
+        code: 'switch_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'R - Light CountDown',
+        code: 'countdown_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.countdown,
+        operationalValues: [
+          SceneOperationalValue(icon: '', value: 0),
+        ],
+      ),
+    ];
+  }
+
+  static List<SceneStaticFunction> towGangAutomationFunctions(
+      String deviceId, String deviceName, functionValue) {
+    return [
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'L - Light Switch',
+        code: 'switch_1',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'R - Light CountDown',
+        code: 'countdown_1',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.integerSteps,
+        operationalValues: [
+          SceneOperationalValue(
+            icon: '',
+            description: "sec",
+            value: 0.0,
+            minValue: 0,
+            maxValue: 43200,
+            stepValue: 1,
+          ),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsAcPower,
+        operationName: 'R - Light Switch',
+        code: 'switch_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.onOff,
+        operationalValues: [
+          SceneOperationalValue(
+              icon: Assets.assetsAcPower, description: "ON", value: true),
+          SceneOperationalValue(
+              icon: Assets.assetsAcPowerOFF, description: "OFF", value: false),
+        ],
+      ),
+      SceneStaticFunction(
+        deviceId: deviceId,
+        deviceName: deviceName,
+        icon: Assets.assetsLightCountdown,
+        operationName: 'R - Light CountDown',
+        code: 'countdown_2',
+        functionValue: functionValue,
+        operationDialogType: OperationDialogType.integerSteps,
+        operationalValues: [
+          SceneOperationalValue(
+            icon: '',
+            description: "sec",
+            value: 0.0,
+            minValue: 0,
+            maxValue: 43200,
+            stepValue: 1,
+          ),
+        ],
+      ),
+    ];
+  }
+}
--- a/lib/features/scene/helper/scene_operations_data_helper.dart
+++ b/lib/features/scene/helper/scene_operations_data_helper.dart
@ -9,6 +9,7 @@ import 'package:syncrow_app/features/scene/helper/functions_per_device/human_pre
 import 'package:syncrow_app/features/scene/helper/functions_per_device/one_gang_functions.dart';
 import 'package:syncrow_app/features/scene/helper/functions_per_device/presence_sensor.dart';
 import 'package:syncrow_app/features/scene/helper/functions_per_device/three_gang_functions.dart';
+import 'package:syncrow_app/features/scene/helper/functions_per_device/tow_gang_helper_functions.dart';
 import 'package:syncrow_app/features/scene/model/scene_details_model.dart';
 import 'package:syncrow_app/features/scene/model/scene_static_function.dart';
 import 'package:syncrow_app/generated/assets.dart';
@ -27,6 +28,7 @@ mixin SceneOperationsDataHelper {
    DeviceType.ThreeGang: threeGangFunctions,
    DeviceType.Gateway: gatewayFunctions,
    DeviceType.OneGang: oneGangFunctions,
+    DeviceType.TwoGang: towGangFunctions,
  };

  final Map<DeviceType, String> _titleMap = {
@ -39,8 +41,8 @@ mixin SceneOperationsDataHelper {
    DeviceType.ThreeGang: '3G Light Switch Functions',
    DeviceType.Gateway: 'Gateway Functions',
    DeviceType.OneGang: '1G Light Switch Conditions',
+    DeviceType.TwoGang: '2G Light Switch Conditions',
  };
-  static String _productTypeCache = '';

  //one gang functions
  static List<SceneStaticFunction> oneGangFunctions(
@ -57,6 +59,20 @@ mixin SceneOperationsDataHelper {
        deviceId, deviceName, functionValue);
  }

+  static List<SceneStaticFunction> towGangFunctions(
+      List<FunctionModel> functions,
+      String deviceId,
+      String deviceName,
+      dynamic functionValue,
+      bool isAutomation) {
+    if (isAutomation) {
+      return TowGangHelperFunctions.towGangAutomationFunctions(
+          deviceId, deviceName, functionValue);
+    }
+    return TowGangHelperFunctions.towGangHelperFunctions(
+        deviceId, deviceName, functionValue);
+  }
+
  List<SceneStaticFunction> getFunctionsWithIcons({
    DeviceType? type,
    required List<FunctionModel> functions,
@ -830,6 +846,18 @@ mixin SceneOperationsDataHelper {
          comparator,
          uniqueCustomId,
        );
+      case "2G":
+        return _createSceneFunction(
+          action,
+          '2 Gang Button Switch L-L',
+          Assets.twoGang,
+          'Light 1 Switch',
+          OperationDialogType.onOff,
+          _createOnOffOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
      default:
        return _createSceneFunction(
          action,
@ -847,17 +875,44 @@ mixin SceneOperationsDataHelper {

  SceneStaticFunction _createSwitch2Function(Action action, bool isAutomation,
      String? comparator, String? uniqueCustomId) {
-    return _createSceneFunction(
-      action,
-      '3 Gang Button Switch L-L',
-      Assets.assetsIcons3GangSwitch,
-      'Light 2 Switch',
-      OperationDialogType.onOff,
-      _createOnOffOptions(),
-      isAutomation,
-      comparator,
-      uniqueCustomId,
-    );
+    switch (action.productType) {
+      case "3G":
+        return _createSceneFunction(
+          action,
+          '3 Gang Button Switch L-L',
+          Assets.assetsIcons3GangSwitch,
+          'Light 2 Switch',
+          OperationDialogType.onOff,
+          _createOnOffOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+      case "2G":
+        return _createSceneFunction(
+          action,
+          '2 Gang Button Switch L-L',
+          Assets.twoGang,
+          'Light 2 Switch',
+          OperationDialogType.onOff,
+          _createOnOffOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+      default:
+        return _createSceneFunction(
+          action,
+          '1 Gang Button Switch L-L',
+          Assets.oneGang,
+          'Light Switch',
+          OperationDialogType.onOff,
+          _createOnOffOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+    }
  }

  SceneStaticFunction _createSwitch3Function(Action action, bool isAutomation,
@ -894,6 +949,22 @@ mixin SceneOperationsDataHelper {
          comparator,
          uniqueCustomId,
        );
+      case "2G":
+        return _createSceneFunction(
+          action,
+          '2 Gang Button Switch L-L',
+          Assets.twoGang,
+          'Light 1 CountDown',
+          isAutomation
+              ? OperationDialogType.integerSteps
+              : OperationDialogType.countdown,
+          isAutomation
+              ? _createAutomationCountDownOptions()
+              : _createCountdownOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
      default:
        return _createSceneFunction(
          action,
@ -915,21 +986,56 @@ mixin SceneOperationsDataHelper {

  SceneStaticFunction _createCountdown2Function(Action action,
      bool isAutomation, String? comparator, String? uniqueCustomId) {
-    return _createSceneFunction(
-      action,
-      '3 Gang Button Switch L-L',
-      Assets.assetsIcons3GangSwitch,
-      'Light 2 CountDown',
-      isAutomation
-          ? OperationDialogType.integerSteps
-          : OperationDialogType.countdown,
-      isAutomation
-          ? _createAutomationCountDownOptions()
-          : _createCountdownOptions(),
-      isAutomation,
-      comparator,
-      uniqueCustomId,
-    );
+    switch (action.productType) {
+      case "3G":
+        return _createSceneFunction(
+          action,
+          '3 Gang Button Switch L-L',
+          Assets.assetsIcons3GangSwitch,
+          'Light 2 CountDown',
+          isAutomation
+              ? OperationDialogType.integerSteps
+              : OperationDialogType.countdown,
+          isAutomation
+              ? _createAutomationCountDownOptions()
+              : _createCountdownOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+      case "2G":
+        return _createSceneFunction(
+          action,
+          '2 Gang Button Switch L-L',
+          Assets.twoGang,
+          'Light 2 CountDown',
+          isAutomation
+              ? OperationDialogType.integerSteps
+              : OperationDialogType.countdown,
+          isAutomation
+              ? _createAutomationCountDownOptions()
+              : _createCountdownOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+      default:
+        return _createSceneFunction(
+          action,
+          '1 Gang Button Switch L-L',
+          Assets.oneGang,
+          'Light CountDown',
+          isAutomation
+              ? OperationDialogType.integerSteps
+              : OperationDialogType.countdown,
+          isAutomation
+              ? _createAutomationCountDownOptions()
+              : _createCountdownOptions(),
+          isAutomation,
+          comparator,
+          uniqueCustomId,
+        );
+    }
  }

  SceneStaticFunction _createCountdown3Function(Action action,
--- a/lib/features/scene/view/device_functions_view.dart
+++ b/lib/features/scene/view/device_functions_view.dart
@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter/widgets.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:flutter_svg/svg.dart';
 import 'package:syncrow_app/features/devices/model/device_control_model.dart';
 import 'package:syncrow_app/features/devices/model/device_model.dart';
 import 'package:syncrow_app/features/scene/bloc/create_scene/create_scene_bloc.dart';
@ -12,6 +13,7 @@ import 'package:syncrow_app/features/shared_widgets/default_container.dart';
 import 'package:syncrow_app/features/shared_widgets/default_scaffold.dart';
 import 'package:syncrow_app/features/shared_widgets/light_divider.dart';
 import 'package:syncrow_app/features/shared_widgets/text_widgets/body_medium.dart';
+import 'package:syncrow_app/generated/assets.dart';
 import 'package:syncrow_app/navigation/navigate_to_route.dart';
 import 'package:syncrow_app/navigation/routing_constants.dart';
 import 'package:syncrow_app/utils/context_extension.dart';
@ -51,22 +53,14 @@ class DeviceFunctionsView extends StatelessWidget
                .add(AddTaskEvent(isAutomation: isAutomation));
            navigateToRoute(context, Routes.sceneTasksRoute);
          },
-          child: BodyMedium(
-            text: 'Save',
-            fontWeight: FontWeight.normal,
-            fontColor: ColorsManager.secondaryColor.withOpacity(0.6),
-          ),
+          child: SvgPicture.asset(Assets.saveRoutinesIcon),
        ),
      ],
      leading: TextButton(
        onPressed: () {
          _cancelOperation(context, device, isAutomation);
        },
-        child: BodyMedium(
-          text: 'Cancel',
-          fontWeight: FontWeight.normal,
-          fontColor: ColorsManager.textPrimaryColor.withOpacity(0.6),
-        ),
+        child: SvgPicture.asset(Assets.cancelIcon),
      ),
      leadingWidth: 80,
      padding: EdgeInsets.zero,
@ -75,65 +69,63 @@ class DeviceFunctionsView extends StatelessWidget
        itemCount: functions.length,
        padding: const EdgeInsets.only(top: 24.0),
        itemBuilder: (context, index) {
-          return DefaultContainer(
-            padding: index == 0
-                ? const EdgeInsets.only(top: 8)
-                : index == functions.length - 1
-                    ? const EdgeInsets.only(bottom: 8)
-                    : EdgeInsets.zero,
-            margin: EdgeInsets.zero,
-            borderRadius: index == 0
-                ? const BorderRadius.only(
-                    topLeft: Radius.circular(20), topRight: Radius.circular(20))
-                : index == functions.length - 1
-                    ? const BorderRadius.only(
-                        bottomLeft: Radius.circular(20),
-                        bottomRight: Radius.circular(20))
-                    : BorderRadius.zero,
-            child: Column(
-              mainAxisSize: MainAxisSize.min,
-              children: [
-                BlocBuilder<CreateSceneBloc, CreateSceneState>(
-                  builder: (context, state) {
-                    return SceneListTile(
-                      iconsSize: 22,
-                      minLeadingWidth: 20,
-                      assetPath: functions[index].icon,
-                      titleString: functions[index].operationName,
-                      trailingWidget: const Row(
-                        mainAxisSize: MainAxisSize.min,
-                        children: [
-                          Icon(
+          final bool isFirstInPair = index % 2 == 0;
+          final bool isLastInPair =
+              index % 2 == 1 || index == functions.length - 1;
+          final bool isLastItem = index == functions.length - 1;
+
+          return Column(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              if (isFirstInPair && index != 0) const SizedBox(height: 16),
+              DefaultContainer(
+                padding: EdgeInsets.only(
+                  top: isFirstInPair ? 8 : 0,
+                  bottom: isLastInPair ? 8 : 0,
+                ),
+                margin: EdgeInsets.zero,
+                borderRadius: BorderRadius.only(
+                  topLeft: Radius.circular(isFirstInPair ? 20 : 0),
+                  topRight: Radius.circular(isFirstInPair ? 20 : 0),
+                  bottomLeft: Radius.circular(isLastInPair ? 20 : 0),
+                  bottomRight: Radius.circular(isLastInPair ? 20 : 0),
+                ),
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    BlocBuilder<CreateSceneBloc, CreateSceneState>(
+                      builder: (context, state) {
+                        return SceneListTile(
+                          iconsSize: 22,
+                          minLeadingWidth: 20,
+                          assetPath: functions[index].icon,
+                          titleString: functions[index].operationName,
+                          trailingWidget: const Icon(
                            Icons.arrow_forward_ios_rounded,
                            color: ColorsManager.greyColor,
                            size: 16,
                          ),
-                        ],
-                      ),
-                      onPressed: () {
-                        if (isAutomation) {
-                          _showAutomationDialog(
-                            context,
-                            functions[index],
-                            device,
-                          );
-                        } else {
-                          _showTabToRunDialog(
-                            context,
-                            functions[index],
-                            device,
-                          );
-                        }
+                          onPressed: () {
+                            if (isAutomation) {
+                              _showAutomationDialog(
+                                  context, functions[index], device);
+                            } else {
+                              _showTabToRunDialog(
+                                  context, functions[index], device);
+                            }
+                          },
+                        );
                      },
-                    );
-                  },
+                    ),
+                    if (isFirstInPair && !isLastItem)
+                      SizedBox(
+                        width: context.width * 0.8,
+                        child: const LightDivider(),
+                      ),
+                  ],
                ),
-                index != functions.length - 1
-                    ? SizedBox(
-                        width: context.width * 0.8, child: const LightDivider())
-                    : const SizedBox(),
-              ],
-            ),
+              ),
+            ],
          );
        },
      ),
--- a/lib/generated/assets.dart
+++ b/lib/generated/assets.dart
@ -1142,5 +1142,9 @@ class Assets {

    static const String toggleSwitchSmall = 'assets/icons/toggleSwitchSmall.svg';
    static const String offToggleSwitchSmall = 'assets/icons/offToggleSwitchSmall.svg';
+    static const String saveRoutinesIcon = 'assets/icons/save_routines_icon.svg';
+    static const String cancelIcon = 'assets/icons/cancel_icon.svg';
+
+

 }