From a0dd12855766eb273c89e9e1c1b01baf3fa7c0b8 Mon Sep 17 00:00:00 2001 From: Faris Armoush Date: Thu, 17 Apr 2025 14:30:30 +0300 Subject: [PATCH] matched design of Function and action in `SaveRoutineHelper.showSaveRoutineDialog` --- .../routines/helper/save_routine_helper.dart | 103 +++++++++++------- 1 file changed, 64 insertions(+), 39 deletions(-) diff --git a/lib/pages/routines/helper/save_routine_helper.dart b/lib/pages/routines/helper/save_routine_helper.dart index 457f74dc..57081230 100644 --- a/lib/pages/routines/helper/save_routine_helper.dart +++ b/lib/pages/routines/helper/save_routine_helper.dart @@ -5,8 +5,8 @@ import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:syncrow_web/pages/routines/bloc/routine_bloc/routine_bloc.dart'; import 'package:syncrow_web/pages/routines/models/device_functions.dart'; -import 'package:syncrow_web/pages/routines/widgets/dialog_header.dart'; import 'package:syncrow_web/pages/routines/widgets/dialog_footer.dart'; +import 'package:syncrow_web/pages/routines/widgets/dialog_header.dart'; import 'package:syncrow_web/utils/color_manager.dart'; import 'package:syncrow_web/utils/constants/assets.dart'; import 'package:syncrow_web/utils/extension/build_context_x.dart'; @@ -31,7 +31,8 @@ class SaveRoutineHelper { children: [ DialogHeader('Create a scene: ${state.routineName ?? ""}'), Padding( - padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8), + padding: + const EdgeInsets.symmetric(horizontal: 16, vertical: 8), child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ @@ -59,8 +60,9 @@ class SaveRoutineHelper { ), if (state.isAutomation) ...state.ifItems.map((item) { - final functions = - state.selectedFunctions[item['uniqueCustomId']] ?? []; + final functions = state.selectedFunctions[ + item['uniqueCustomId']] ?? + []; return functionRow(item, context, functions); }), ], @@ -68,10 +70,8 @@ class SaveRoutineHelper { ), const SizedBox(width: 16), // Right side - THEN items - Expanded( child: ListView( - // crossAxisAlignment: CrossAxisAlignment.start, shrinkWrap: true, children: [ const Text( @@ -82,8 +82,9 @@ class SaveRoutineHelper { ), const SizedBox(height: 8), ...state.thenItems.map((item) { - final functions = - state.selectedFunctions[item['uniqueCustomId']] ?? []; + final functions = state.selectedFunctions[ + item['uniqueCustomId']] ?? + []; return functionRow(item, context, functions); }), ], @@ -92,33 +93,30 @@ class SaveRoutineHelper { ], ), ), - // if (state.errorMessage != null || state.errorMessage!.isNotEmpty) - // Padding( - // padding: const EdgeInsets.all(8.0), - // child: Text( - // state.errorMessage!, - // style: const TextStyle(color: Colors.red), - // ), - // ), DialogFooter( onCancel: () => Navigator.pop(context), onConfirm: () async { if (state.isAutomation) { if (state.isUpdate ?? false) { - context.read().add(const UpdateAutomation()); + context + .read() + .add(const UpdateAutomation()); } else { - context.read().add(const CreateAutomationEvent()); + context + .read() + .add(const CreateAutomationEvent()); } } else { if (state.isUpdate ?? false) { context.read().add(const UpdateScene()); } else { - context.read().add(const CreateSceneEvent()); + context + .read() + .add(const CreateSceneEvent()); } } - // if (state.errorMessage == null || state.errorMessage!.isEmpty) { + Navigator.pop(context); - // } }, isConfirmEnabled: true, ), @@ -133,7 +131,10 @@ class SaveRoutineHelper { } static Widget functionRow( - dynamic item, BuildContext context, List functions) { + dynamic item, + BuildContext context, + List functions, + ) { return Padding( padding: const EdgeInsets.only(top: 6), child: Row( @@ -142,19 +143,36 @@ class SaveRoutineHelper { Expanded( child: Row( mainAxisAlignment: MainAxisAlignment.start, - spacing: 8, + spacing: 17, children: [ - item['type'] == 'tap_to_run' || item['type'] == 'scene' - ? Image.memory( - base64Decode(item['icon']), - width: 22, - height: 22, - ) - : SvgPicture.asset( - item['imagePath'], - width: 22, - height: 22, - ), + Container( + width: 22, + height: 22, + padding: const EdgeInsetsDirectional.all(4), + decoration: BoxDecoration( + shape: BoxShape.circle, + color: ColorsManager.textFieldGreyColor, + border: Border.all( + color: ColorsManager.neutralGray, + width: 1.5, + ), + ), + child: Center( + child: item['type'] == 'tap_to_run' || item['type'] == 'scene' + ? Image.memory( + base64Decode(item['icon']), + width: 12, + height: 22, + fit: BoxFit.scaleDown, + ) + : SvgPicture.asset( + item['imagePath'], + width: 12, + height: 12, + fit: BoxFit.scaleDown, + ), + ), + ), Flexible( child: Column( mainAxisAlignment: MainAxisAlignment.start, @@ -166,16 +184,18 @@ class SaveRoutineHelper { maxLines: 1, overflow: TextOverflow.ellipsis, style: context.textTheme.bodySmall?.copyWith( - fontSize: 14, + fontSize: 15, color: ColorsManager.textPrimaryColor, ), ), Wrap( + runSpacing: 16, + spacing: 4, children: functions .map((f) => Text( '${f.operationName}: ${f.value}', - style: context.textTheme.bodySmall - ?.copyWith(color: ColorsManager.grayColor, fontSize: 8), + style: context.textTheme.bodySmall?.copyWith( + color: ColorsManager.grayColor, fontSize: 8), overflow: TextOverflow.ellipsis, maxLines: 3, )) @@ -197,7 +217,10 @@ class SaveRoutineHelper { child: Row( spacing: 2, children: [ - SizedBox(width: 8, height: 8, child: SvgPicture.asset(Assets.deviceTagIcon)), + SizedBox( + width: 8, + height: 8, + child: SvgPicture.asset(Assets.deviceTagIcon)), Text( item['tag'] ?? '', textAlign: TextAlign.center, @@ -218,7 +241,9 @@ class SaveRoutineHelper { spacing: 2, children: [ SizedBox( - width: 8, height: 8, child: SvgPicture.asset(Assets.spaceLocationIcon)), + width: 8, + height: 8, + child: SvgPicture.asset(Assets.spaceLocationIcon)), Text( item['subSpace'] ?? '', textAlign: TextAlign.center,