Merge pull request #103 from SyncrowIOT/SP-1151-FE-Implement-Delete-Action-for-the-Space-Model

Sp 1151 fe implement delete action for the space model

assets/icons/delete_space_model.svg

@@ -0,0 +1,6 @@
+<svg width="16" height="18" viewBox="0 0 16 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.4 2.10938H11.7333V1.58203C11.7333 0.709699 11.0156 0 10.1333 0H5.86667C4.98443 0 4.26667 0.709699 4.26667 1.58203V2.10938H1.6C0.71776 2.10938 0 2.81907 0 3.69141C0 4.392 0.463111 4.9873 1.1024 5.19472L2.05369 16.5493C2.1222 17.3628 2.82258 18 3.64814 18H12.3519C13.1775 18 13.8778 17.3628 13.9464 16.5491L14.8976 5.19469C15.5369 4.9873 16 4.392 16 3.69141C16 2.81907 15.2822 2.10938 14.4 2.10938ZM5.33333 1.58203C5.33333 1.29125 5.57259 1.05469 5.86667 1.05469H10.1333C10.4274 1.05469 10.6667 1.29125 10.6667 1.58203V2.10938H5.33333V1.58203ZM12.8833 16.4618C12.8605 16.7329 12.6271 16.9453 12.3519 16.9453H3.64814C3.37298 16.9453 3.13952 16.7329 3.11673 16.462L2.17934 5.27344H13.8207L12.8833 16.4618ZM14.4 4.21875H1.6C1.30592 4.21875 1.06667 3.98218 1.06667 3.69141C1.06667 3.40063 1.30592 3.16406 1.6 3.16406H14.4C14.6941 3.16406 14.9333 3.40063 14.9333 3.69141C14.9333 3.98218 14.6941 4.21875 14.4 4.21875Z" fill="#999999"/>
+<path d="M5.86561 15.3307L5.33228 6.82286C5.31404 6.53215 5.05957 6.31106 4.76698 6.32916C4.47297 6.3472 4.24943 6.59744 4.26764 6.88811L4.80097 15.396C4.8185 15.6756 5.05331 15.8907 5.33278 15.8907C5.64165 15.8907 5.88456 15.6335 5.86561 15.3307Z" fill="#999999"/>
+<path d="M7.99989 6.32812C7.70534 6.32812 7.46655 6.56423 7.46655 6.85547V15.3633C7.46655 15.6545 7.70534 15.8906 7.99989 15.8906C8.29443 15.8906 8.53322 15.6545 8.53322 15.3633V6.85547C8.53322 6.56423 8.29443 6.32812 7.99989 6.32812Z" fill="#999999"/>
+<path d="M11.233 6.32915C10.9396 6.31112 10.6859 6.53215 10.6677 6.82285L10.1343 15.3307C10.1162 15.6213 10.3397 15.8716 10.6337 15.8896C10.9278 15.9076 11.1808 15.6865 11.199 15.3959L11.7323 6.8881C11.7505 6.5974 11.527 6.34715 11.233 6.32915Z" fill="#999999"/>
+</svg>

lib/pages/spaces_management/space_model/bloc/space_model_bloc.dart

@@ -4,9 +4,6 @@ import 'package:syncrow_web/pages/spaces_management/space_model/bloc/space_model
 import 'package:syncrow_web/pages/spaces_management/space_model/bloc/space_model_state.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/services/space_model_mang_api.dart';
-import 'package:syncrow_web/utils/constants/strings_manager.dart';
-import 'package:syncrow_web/utils/constants/temp_const.dart';
-import 'package:syncrow_web/utils/helpers/shared_preferences_helper.dart';
 
 class SpaceModelBloc extends Bloc<SpaceModelEvent, SpaceModelState> {
   final SpaceModelManagementApi api;
@@ -17,6 +14,7 @@ class SpaceModelBloc extends Bloc<SpaceModelEvent, SpaceModelState> {
   }) : super(SpaceModelLoaded(spaceModels: initialSpaceModels)) {
     on<CreateSpaceModel>(_onCreateSpaceModel);
     on<UpdateSpaceModel>(_onUpdateSpaceModel);
+    on<DeleteSpaceModel>(_onDeleteSpaceModel);
   }
 
   Future<void> _onCreateSpaceModel(
@@ -50,7 +48,7 @@ class SpaceModelBloc extends Bloc<SpaceModelEvent, SpaceModelState> {
         final projectUuid = await ProjectManager.getProjectUUID() ?? '';
 
         final newSpaceModel =
-            await api.getSpaceModel(event.spaceModelUuid ?? '', projectUuid);
+            await api.getSpaceModel(event.spaceModelUuid, projectUuid);
         if (newSpaceModel != null) {
           final updatedSpaceModels = currentState.spaceModels.map((model) {
             return model.uuid == event.spaceModelUuid ? newSpaceModel : model;
@@ -62,4 +60,28 @@ class SpaceModelBloc extends Bloc<SpaceModelEvent, SpaceModelState> {
       }
     }
   }
+
+  Future<void> _onDeleteSpaceModel(
+      DeleteSpaceModel event, Emitter<SpaceModelState> emit) async {
+    final currentState = state;
+
+    if (currentState is SpaceModelLoaded) {
+      try {
+        final projectUuid = await ProjectManager.getProjectUUID() ?? '';
+
+        final deletedSuccessfully =
+            await api.deleteSpaceModel(event.spaceModelUuid, projectUuid);
+
+        if (deletedSuccessfully) {
+          final updatedSpaceModels = currentState.spaceModels
+              .where((model) => model.uuid != event.spaceModelUuid)
+              .toList();
+
+          emit(SpaceModelLoaded(spaceModels: updatedSpaceModels));
+        }
+      } catch (e) {
+        emit(SpaceModelError(message: e.toString()));
+      }
+    }
+  }
 }

lib/pages/spaces_management/space_model/bloc/space_model_event.dart

@@ -34,3 +34,12 @@ class UpdateSpaceModel extends SpaceModelEvent {
   @override
   List<Object?> get props => [spaceModelUuid];
 }
+
+class DeleteSpaceModel extends SpaceModelEvent {
+  final String spaceModelUuid;
+
+  DeleteSpaceModel({required this.spaceModelUuid});
+
+  @override
+  List<Object?> get props => [spaceModelUuid];
+}

lib/pages/spaces_management/space_model/view/space_model_page.dart

@@ -90,7 +90,11 @@ class SpaceModelPage extends StatelessWidget {
                             },
                             child: Container(
                               margin: const EdgeInsets.all(8.0),
-                              child: SpaceModelCardWidget(model: model),
+                              child: SpaceModelCardWidget(
+                                model: model,
+                                pageContext: context,
+                                topActionsDisabled: false,
+                              ),
                             ));
                       },
                     ),

lib/pages/spaces_management/space_model/widgets/dialog/delete_space_model_dialog.dart

@@ -0,0 +1,85 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/pages/common/buttons/cancel_button.dart';
+import 'package:syncrow_web/pages/common/buttons/default_button.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+
+class DeleteSpaceModelDialog extends StatelessWidget {
+  final VoidCallback onConfirmDelete;
+
+  const DeleteSpaceModelDialog({Key? key, required this.onConfirmDelete})
+      : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+
+    return AlertDialog(
+      shape: RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(20),
+      ),
+      backgroundColor: ColorsManager.whiteColors,
+      title: Center(
+        child: Text(
+          "Delete Space Model",
+          textAlign: TextAlign.center,
+          style: Theme.of(context)
+              .textTheme
+              .headlineLarge
+              ?.copyWith(color: ColorsManager.blackColor),
+        ),
+      ),
+      content: SizedBox(
+        width: screenWidth * 0.4,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Text(
+              "Are you sure you want to delete?",
+              textAlign: TextAlign.center,
+              style: Theme.of(context).textTheme.headlineSmall,
+            ),
+            const SizedBox(height: 15),
+            Text(
+              "The existing sub-spaces, devices, and routines will remain associated with the spaces, but the connection will be removed.",
+              textAlign: TextAlign.center,
+              style: Theme.of(context)
+                  .textTheme
+                  .bodyMedium
+                  ?.copyWith(color: ColorsManager.lightGrayColor),
+            ),
+          ],
+        ),
+      ),
+      actions: [
+        Row(
+          mainAxisAlignment: MainAxisAlignment.center,
+          children: [
+            SizedBox(
+              width: 200,
+              child: CancelButton(
+                onPressed: () {
+                  Navigator.of(context).pop(); // Close dialog
+                },
+                label: "Cancel",
+              ),
+            ),
+            const SizedBox(width: 10),
+            SizedBox(
+              width: 200,
+              child: DefaultButton(
+                onPressed: () {
+                  Navigator.of(context).pop(); // Close dialog
+                  onConfirmDelete(); // Execute delete action
+                },
+                backgroundColor: ColorsManager.semiTransparentRed,
+                borderRadius: 10,
+                foregroundColor: ColorsManager.whiteColors,
+                child: const Text('Delete'),
+              ),
+            ),
+          ],
+        ),
+      ],
+    );
+  }
+}

lib/pages/spaces_management/space_model/widgets/space_model_card_widget.dart

@@ -1,13 +1,30 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+
+import 'package:flutter_svg/svg.dart';
+import 'package:syncrow_web/pages/common/buttons/cancel_button.dart';
+import 'package:syncrow_web/pages/common/buttons/default_button.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/bloc/space_model_bloc.dart';
+
+import 'package:syncrow_web/pages/spaces_management/space_model/bloc/space_model_event.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/widgets/dialog/delete_space_model_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/dynamic_product_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/dynamic_room_widget.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
+import 'package:syncrow_web/utils/constants/assets.dart';
 
 class SpaceModelCardWidget extends StatelessWidget {
   final SpaceTemplateModel model;
+  final BuildContext? pageContext;
+  final bool topActionsDisabled;
 
-  const SpaceModelCardWidget({Key? key, required this.model}) : super(key: key);
+  const SpaceModelCardWidget({
+    Key? key,
+    required this.model,
+    this.pageContext,
+    this.topActionsDisabled = true,
+  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -34,7 +51,7 @@ class SpaceModelCardWidget extends StatelessWidget {
     return LayoutBuilder(
       builder: (context, constraints) {
         bool showOnlyName = constraints.maxWidth < 250;
-       return Container(
+        return Container(
           padding: const EdgeInsets.all(16.0),
           decoration: BoxDecoration(
             color: Colors.white,
@@ -51,14 +68,50 @@ class SpaceModelCardWidget extends StatelessWidget {
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              Text(
+              Row(
-                model.modelName,
+                children: [
-                style: Theme.of(context).textTheme.headlineMedium?.copyWith(
+                  Expanded(
-                      color: Colors.black,
+                    child: Text(
-                      fontWeight: FontWeight.bold,
+                      model.modelName,
+                      style:
+                          Theme.of(context).textTheme.headlineMedium?.copyWith(
+                                color: Colors.black,
+                                fontWeight: FontWeight.bold,
+                              ),
+                      maxLines: 1,
+                      overflow: TextOverflow.ellipsis,
                     ),
-                maxLines: 1,
+                  ),
-                overflow: TextOverflow.ellipsis,
+                  if (!topActionsDisabled)
+                    GestureDetector(
+                      onTap: () => _showDeleteDialog(context),
+                      child: Container(
+                        width: 36, // Adjust size as needed
+                        height: 36,
+                        decoration: BoxDecoration(
+                          shape: BoxShape.circle,
+                          color: Colors.white,
+                          boxShadow: [
+                            BoxShadow(
+                              color: Colors.black.withOpacity(0.1),
+                              spreadRadius: 2,
+                              blurRadius: 5,
+                              offset: const Offset(0, 2),
+                            ),
+                          ],
+                        ),
+                        child: Center(
+                          child: SvgPicture.asset(
+                            Assets.deleteSpaceModel, // Your actual SVG path
+                            width: 20,
+                            height: 20,
+                            colorFilter: const ColorFilter.mode(
+                                Colors.grey, BlendMode.srcIn),
+                          ),
+                        ),
+                      ),
+                    ),
+                ],
               ),
               if (!showOnlyName) ...[
                 const SizedBox(height: 10),
@@ -117,4 +170,22 @@ class SpaceModelCardWidget extends StatelessWidget {
       },
     );
   }
+
+  void _showDeleteDialog(BuildContext context) {
+    showDialog(
+      context: context,
+      barrierDismissible: true,
+      builder: (BuildContext dialogContext) {
+        return DeleteSpaceModelDialog(
+          onConfirmDelete: () {
+            if (pageContext != null) {
+              pageContext!.read<SpaceModelBloc>().add(
+                    DeleteSpaceModel(spaceModelUuid: model.uuid ?? ''),
+                  );
+            }
+          },
+        );
+      },
+    );
+  }
 }

lib/services/space_model_mang_api.dart

@@ -60,4 +60,17 @@ class SpaceModelManagementApi {
     );
     return response;
   }
+
+  Future<bool> deleteSpaceModel(String spaceModelUuid, String projectId) async {
+    final response = await HTTPService().delete(
+      path: ApiEndpoints.getSpaceModel
+          .replaceAll('{projectId}', projectId)
+          .replaceAll('{spaceModelUuid}', spaceModelUuid),
+      showServerMessage: true,
+      expectedResponseModel: (json) {
+        return json['success'] ?? false;
+      },
+    );
+    return response;
+  }
 }

lib/utils/color_manager.dart

@@ -71,4 +71,5 @@ abstract class ColorsManager {
   static const Color lightGrayBorderColor = Color(0xB2D5D5D5);
   //background: #F8F8F8;
   static const Color vividBlue = Color(0xFF023DFE);
+  static const Color semiTransparentRed = Color(0x99FF0000);
 }

lib/utils/constants/assets.dart

@@ -258,6 +258,7 @@ class Assets {
   static const String doorSensor = 'assets/icons/door_sensor.svg';
 
   static const String delete = 'assets/icons/delete.svg';
+  static const String deleteSpaceModel = 'assets/icons/delete_space_model.svg';
   static const String edit = 'assets/icons/edit.svg';
   static const String editSpace = 'assets/icons/edit_space.svg';
   //assets/icons/routine/tab_to_run.svg