removed print

assets/icons/duplicate.svg

@@ -0,0 +1,16 @@
+<svg width="21" height="20" viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M17.9807 2.67199L16.6413 0.219727H7.91051C7.43122 0.219727 7.04266 0.608281 7.04266 1.08758V16.605C7.04266 17.0843 7.43122 17.4729 7.91051 17.4729H18.2257C18.705 17.4729 19.0935 17.0843 19.0935 16.605V16.5459H19.7312V3.8127L17.9807 2.67199Z" fill="#60B7FF"/>
+<path d="M18.1513 6.23445H9.12553C8.95881 6.23445 8.82373 6.09934 8.82373 5.93266C8.82373 5.76598 8.95885 5.63086 9.12553 5.63086H18.1513C18.318 5.63086 18.4531 5.76598 18.4531 5.93266C18.4531 6.09934 18.318 6.23445 18.1513 6.23445Z" fill="#0055A3"/>
+<path d="M18.1513 8.54891H9.12553C8.95881 8.54891 8.82373 8.41379 8.82373 8.24711C8.82373 8.08043 8.95885 7.94531 9.12553 7.94531H18.1513C18.318 7.94531 18.4531 8.08043 18.4531 8.24711C18.4531 8.41379 18.318 8.54891 18.1513 8.54891Z" fill="#0055A3"/>
+<path d="M18.1513 10.8634H9.12553C8.95881 10.8634 8.82373 10.7282 8.82373 10.5616C8.82373 10.3949 8.95885 10.2598 9.12553 10.2598H18.1513C18.318 10.2598 18.4531 10.3949 18.4531 10.5616C18.4531 10.7282 18.318 10.8634 18.1513 10.8634Z" fill="#0055A3"/>
+<path d="M18.1513 13.1778H9.12556C8.95884 13.1778 8.82376 13.0427 8.82376 12.876C8.82376 12.7093 8.95888 12.5742 9.12556 12.5742H18.1513C18.3181 12.5742 18.4531 12.7093 18.4531 12.876C18.4531 13.0427 18.3181 13.1778 18.1513 13.1778Z" fill="#0055A3"/>
+<path d="M19.0935 3.39648V16.6044C19.0935 17.0837 18.7049 17.4722 18.2256 17.4722H19.3663C19.8456 17.4722 20.2342 17.0837 20.2342 16.6044V3.81203L19.0935 3.39648Z" fill="#26A6FE"/>
+<path d="M17.5091 3.8127H20.2342L16.6413 0.219727V2.94484C16.6413 3.42414 17.0298 3.8127 17.5091 3.8127Z" fill="#004281"/>
+<path d="M11.4172 19.7805C11.8965 19.7805 12.2851 19.392 12.2851 18.9127V18.8937H12.8297V6.12031L11.039 4.78906L9.83279 2.52734H1.10204C0.622747 2.52734 0.234192 2.9159 0.234192 3.3952V18.9127C0.234192 19.392 0.622747 19.7805 1.10204 19.7805H11.4172Z" fill="#D5EDFF"/>
+<path d="M12.285 4.97852V6.11922V18.9116C12.285 19.3909 11.8964 19.7794 11.4171 19.7794H12.5578C13.0371 19.7794 13.4257 19.3909 13.4257 18.9116V6.11922L12.285 4.97852Z" fill="#D8ECFE"/>
+<path d="M10.7006 6.12031H13.4258L9.83279 2.52734V5.25246C9.83276 5.73176 10.2213 6.12031 10.7006 6.12031Z" fill="#B3DAFE"/>
+<path d="M11.3429 8.54891H2.31709C2.15037 8.54891 2.01529 8.41379 2.01529 8.24711C2.01529 8.08043 2.15041 7.94531 2.31709 7.94531H11.3429C11.5096 7.94531 11.6447 8.08043 11.6447 8.24711C11.6447 8.41379 11.5096 8.54891 11.3429 8.54891Z" fill="#82AEE3"/>
+<path d="M11.3428 10.8634H2.31706C2.15034 10.8634 2.01526 10.7282 2.01526 10.5616C2.01526 10.3949 2.15038 10.2598 2.31706 10.2598H11.3428C11.5096 10.2598 11.6446 10.3949 11.6446 10.5616C11.6446 10.7282 11.5096 10.8634 11.3428 10.8634Z" fill="#82AEE3"/>
+<path d="M11.3428 13.1778H2.31706C2.15034 13.1778 2.01526 13.0427 2.01526 12.876C2.01526 12.7093 2.15038 12.5742 2.31706 12.5742H11.3428C11.5096 12.5742 11.6446 12.7093 11.6446 12.876C11.6446 13.0427 11.5096 13.1778 11.3428 13.1778Z" fill="#82AEE3"/>
+<path d="M11.3428 15.4923H2.31706C2.15034 15.4923 2.01526 15.3571 2.01526 15.1905C2.01526 15.0238 2.15038 14.8887 2.31706 14.8887H11.3428C11.5096 14.8887 11.6446 15.0238 11.6446 15.1905C11.6447 15.3571 11.5096 15.4923 11.3428 15.4923Z" fill="#82AEE3"/>
+</svg>

assets/icons/edit_space.svg

@@ -0,0 +1,22 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g filter="url(#filter0_d_4618_3290)">
+<path d="M18.7967 7.35156V19.8515C18.7967 21.0362 17.8329 22 16.6482 22H4.14825C2.9636 22 1.99982 21.0362 1.99982 19.8515V7.35156C1.99982 6.16691 2.9636 5.20312 4.14825 5.20312H16.6482C17.8329 5.20312 18.7967 6.16691 18.7967 7.35156Z" fill="#EDF2F2"/>
+<path d="M18.7967 19.8515C18.7967 21.0361 17.8329 21.9999 16.6482 21.9999H4.14825C3.55591 21.9999 3.0188 21.7589 2.62978 21.3699L18.1667 5.83301C18.5557 6.22203 18.7967 6.75914 18.7967 7.35148V19.8515Z" fill="#C9DCDC"/>
+<path d="M9.28417 14.7153C9.12722 14.5583 9.07241 14.3262 9.14265 14.1157L9.97128 11.6297C10 11.5434 10.0485 11.465 10.1128 11.4007L17.8468 3.66674C18.0756 3.43791 18.4466 3.43791 18.6754 3.66674L20.3327 5.324C20.5615 5.55283 20.5615 5.9238 20.3327 6.15263L12.5987 13.8866C12.5344 13.9509 12.456 13.9994 12.3697 14.0281L9.88374 14.8567C9.67323 14.927 9.44109 14.8722 9.28417 14.7153Z" fill="#4998EE"/>
+<path d="M19.504 4.49512L9.28413 14.715C9.44105 14.8719 9.6732 14.9267 9.88374 14.8565L12.3697 14.0279C12.456 13.9992 12.5344 13.9507 12.5987 13.8864L20.3327 6.15242C20.5615 5.92359 20.5615 5.55261 20.3327 5.32379L19.504 4.49512Z" fill="#176EDE"/>
+<path d="M20.3327 6.15305L17.8467 3.66711L19.2278 2.28602C19.6092 1.90466 20.2275 1.90466 20.6089 2.28602L21.7137 3.39087C22.0951 3.77223 22.0951 4.39055 21.7137 4.77192L20.3327 6.15305Z" fill="#FFE137"/>
+<path d="M21.1613 2.83789L19.0897 4.90949L20.3327 6.15245L21.7138 4.77136C22.0951 4.39 22.0951 3.77168 21.7138 3.39031L21.1613 2.83789Z" fill="#FAC814"/>
+</g>
+<defs>
+<filter id="filter0_d_4618_3290" x="-0.000183105" y="0" width="24" height="24" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset/>
+<feGaussianBlur stdDeviation="1"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4618_3290"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4618_3290" result="shape"/>
+</filter>
+</defs>
+</svg>

assets/icons/space_delete.svg

@@ -0,0 +1,9 @@
+<svg width="16" height="20" viewBox="0 0 16 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.8069 19.9998H3.50035C2.16411 19.9998 1.08087 18.9165 1.08087 17.5804V4.51562H14.2262V17.5804C14.2262 18.9165 13.1432 19.9998 11.8069 19.9998Z" fill="#D8D8D8"/>
+<path d="M1.08087 4.51562V5.48335H12.3715C12.8168 5.48335 13.1779 5.84438 13.1779 6.2898V17.3384C13.1779 18.2292 12.4557 18.9513 11.5649 18.9513H2.4519C2.05409 18.9513 1.67887 18.8547 1.34775 18.6844C1.74907 19.4652 2.56207 19.9998 3.50035 19.9998H11.8069C13.1432 19.9998 14.2262 18.9165 14.2262 17.5803V4.51562H1.08087Z" fill="#BABABA"/>
+<path d="M14.2667 1.77417H10.7439L10.1633 0.612956C9.9742 0.234837 9.5941 0 9.17142 0H6.13594C5.71311 0 5.33316 0.234837 5.1441 0.612956L4.56349 1.77417H1.04063C0.595221 1.77417 0.234192 2.1352 0.234192 2.58061V3.70978C0.234192 4.15504 0.595221 4.51622 1.04063 4.51622H14.2667C14.7121 4.51622 15.0732 4.15504 15.0732 3.70978V2.58077C15.0732 2.1352 14.7121 1.77417 14.2667 1.77417ZM5.68503 0.8835C5.77094 0.71153 5.94368 0.604869 6.13594 0.604869H9.17142C9.36354 0.604869 9.53627 0.71153 9.62218 0.8835L10.0676 1.77417H5.23977L5.68503 0.8835Z" fill="#757575"/>
+<path d="M14.2668 1.77441H12.9763C13.4217 1.77441 13.7829 2.13544 13.7829 2.58086V3.71003C13.7829 4.15529 13.4217 4.51647 12.9763 4.51647H14.2668C14.7122 4.51647 15.0732 4.15529 15.0732 3.71003V2.58101C15.0732 2.13544 14.7122 1.77441 14.2668 1.77441Z" fill="#595959"/>
+<path d="M11.3634 17.5C10.918 17.5 10.5569 17.139 10.5569 16.6935V9.15312C10.5569 8.70771 10.918 8.34668 11.3634 8.34668C11.8088 8.34668 12.1698 8.70771 12.1698 9.15312V16.6935C12.1698 17.139 11.8088 17.5 11.3634 17.5Z" fill="#757575"/>
+<path d="M3.94398 17.5C4.38924 17.5 4.75043 17.139 4.75043 16.6935V9.15312C4.75043 8.70771 4.38924 8.34668 3.94398 8.34668C3.49857 8.34668 3.13739 8.70771 3.13739 9.15312V16.6935C3.13739 17.139 3.49857 17.5 3.94398 17.5Z" fill="#757575"/>
+<path d="M7.65361 17.5C7.2082 17.5 6.84717 17.139 6.84717 16.6935V9.15312C6.84717 8.70771 7.2082 8.34668 7.65361 8.34668C8.09902 8.34668 8.46005 8.70771 8.46005 9.15312V16.6935C8.46005 17.139 8.09902 17.5 7.65361 17.5Z" fill="#757575"/>
+</svg>

lib/common/edit_chip.dart

@@ -0,0 +1,39 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+
+class EditChip extends StatelessWidget {
+  final String label;
+  final VoidCallback onTap;
+  final Color labelColor;
+  final Color backgroundColor;
+  final Color borderColor;
+  final double borderRadius;
+
+  const EditChip({
+    Key? key,
+    this.label = 'Edit',
+    required this.onTap,
+    this.labelColor = ColorsManager.spaceColor,
+    this.backgroundColor = ColorsManager.whiteColors,
+    this.borderColor = ColorsManager.spaceColor,
+    this.borderRadius = 16.0,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: onTap,
+      child: Chip(
+        label: Text(
+          label,
+          style: Theme.of(context).textTheme.bodySmall!.copyWith(color: labelColor)
+        ),
+        backgroundColor: backgroundColor,
+        shape: RoundedRectangleBorder(
+          borderRadius: BorderRadius.circular(borderRadius),
+          side: BorderSide(color: borderColor),
+        ),
+      ),
+    );
+  }
+}

lib/pages/common/buttons/default_button.dart

@@ -19,12 +19,14 @@ class DefaultButton extends StatelessWidget {
     this.padding,
     this.borderColor,
     this.elevation,
+    this.borderWidth = 1.0,
   });
   final void Function()? onPressed;
   final Widget child;
   final double? height;
   final bool isSecondary;
   final double? borderRadius;
+  final double borderWidth;
   final bool enabled;
   final double? padding;
   final bool isDone;
@@ -66,7 +68,10 @@ class DefaultButton extends StatelessWidget {
                 }),
                 shape: WidgetStateProperty.all(
                   RoundedRectangleBorder(
-                    side: BorderSide(color: borderColor ?? Colors.transparent),
+                    side: BorderSide(
+                      color: borderColor ?? Colors.transparent,
+                      width: borderWidth,
+                    ),
                     borderRadius: BorderRadius.circular(borderRadius ?? 20),
                   ),
                 ),

lib/pages/device_managment/all_devices/models/device_subspace.model.dart

@@ -0,0 +1,47 @@
+class DeviceSubspace {
+  final String uuid;
+  final DateTime? createdAt;
+  final DateTime? updatedAt;
+  final String subspaceName;
+  final bool disabled;
+
+  DeviceSubspace({
+    required this.uuid,
+    this.createdAt,
+    this.updatedAt,
+    required this.subspaceName,
+    required this.disabled,
+  });
+
+  factory DeviceSubspace.fromJson(Map<String, dynamic> json) {
+    return DeviceSubspace(
+      uuid: json['uuid'] as String,
+      createdAt: json['createdAt'] != null
+          ? DateTime.tryParse(json['createdAt'].toString())
+          : null,
+      updatedAt: json['updatedAt'] != null
+          ? DateTime.tryParse(json['updatedAt'].toString())
+          : null,
+      subspaceName: json['subspaceName'] as String,
+      disabled: json['disabled'] as bool,
+    );
+  }
+
+  Map<String, dynamic> toJson() {
+    return {
+      'uuid': uuid,
+      'createdAt': createdAt?.toIso8601String(),
+      'updatedAt': updatedAt?.toIso8601String(),
+      'subspaceName': subspaceName,
+      'disabled': disabled,
+    };
+  }
+
+  static List<DeviceSubspace> listFromJson(List<dynamic> jsonList) {
+    return jsonList.map((json) => DeviceSubspace.fromJson(json)).toList();
+  }
+
+  static List<Map<String, dynamic>> listToJson(List<DeviceSubspace> subspaces) {
+    return subspaces.map((subspace) => subspace.toJson()).toList();
+  }
+}

lib/pages/device_managment/all_devices/models/devices_model.dart

@@ -1,5 +1,6 @@
 import 'package:syncrow_web/pages/device_managment/all_devices/models/device_community.model.dart';
 import 'package:syncrow_web/pages/device_managment/all_devices/models/device_space_model.dart';
+import 'package:syncrow_web/pages/device_managment/all_devices/models/device_subspace.model.dart';
 import 'package:syncrow_web/pages/device_managment/all_devices/models/room.dart';
 import 'package:syncrow_web/pages/device_managment/all_devices/models/unit.dart';
 import 'package:syncrow_web/pages/routiens/models/ac/ac_function.dart';
@@ -47,6 +48,7 @@ class AllDevicesModel {
 */
 
   DevicesModelRoom? room;
+  DeviceSubspace? subspace;
   DevicesModelUnit? unit;
   DeviceCommunityModel? community;
   String? productUuid;
@@ -77,6 +79,7 @@ class AllDevicesModel {
 
   AllDevicesModel({
     this.room,
+    this.subspace,
     this.unit,
     this.community,
     this.productUuid,
@@ -110,6 +113,9 @@ class AllDevicesModel {
     room = (json['room'] != null && (json['room'] is Map))
         ? DevicesModelRoom.fromJson(json['room'])
         : null;
+    subspace = (json['subspace'] != null && (json['subspace'] is Map))
+        ? DeviceSubspace.fromJson(json['subspace'])
+        : null;
     unit = (json['unit'] != null && (json['unit'] is Map))
         ? DevicesModelUnit.fromJson(json['unit'])
         : null;
@@ -288,6 +294,9 @@ SOS
     if (room != null) {
       data['room'] = room!.toJson();
     }
+    if (subspace != null) {
+      data['subspace'] = subspace!.toJson();
+    }
     if (unit != null) {
       data['unit'] = unit!.toJson();
     }
@@ -330,6 +339,7 @@ SOS
 
     return other is AllDevicesModel &&
         other.room == room &&
+        other.subspace == subspace &&
         other.unit == unit &&
         other.productUuid == productUuid &&
         other.productType == productType &&
@@ -360,6 +370,7 @@ SOS
   @override
   int get hashCode {
     return room.hashCode ^
+        subspace.hashCode ^
         unit.hashCode ^
         productUuid.hashCode ^
         productType.hashCode ^

lib/pages/device_managment/shared/device_control_dialog.dart

@@ -95,8 +95,9 @@ class DeviceControlDialog extends StatelessWidget with RouteControlsBasedCode {
           ]),
           TableRow(
             children: [
-              _buildInfoRow('Space Name:', device.unit?.name ?? 'N/A'),
+              _buildInfoRow('Space Name:',
-              _buildInfoRow('Room:', device.room?.name ?? 'N/A'),
+                  device.spaces?.firstOrNull?.spaceName ?? 'N/A'),
+              _buildInfoRow('Room:', device.subspace?.subspaceName ?? 'N/A'),
             ],
           ),
           TableRow(
@@ -111,9 +112,13 @@ class DeviceControlDialog extends StatelessWidget with RouteControlsBasedCode {
               ),
               _buildInfoRow(
                 'Battery Level:',
-                device.batteryLevel != null ? '${device.batteryLevel ?? 0}%' : "-",
+                device.batteryLevel != null
+                    ? '${device.batteryLevel ?? 0}%'
+                    : "-",
                 statusColor: device.batteryLevel != null
-                    ? (device.batteryLevel! < 20 ? ColorsManager.red : ColorsManager.green)
+                    ? (device.batteryLevel! < 20
+                        ? ColorsManager.red
+                        : ColorsManager.green)
                     : null,
               ),
             ],

lib/pages/spaces_management/add_device_type/bloc/add_device_model_bloc.dart

@@ -1,38 +1,74 @@
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_state.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_type_model_event.dart';
 
-class AddDeviceTypeBloc
+class AddDeviceTypeBloc extends Bloc<AddDeviceTypeEvent, AddDeviceState> {
-    extends Bloc<AddDeviceTypeEvent, List<SelectedProduct>> {
+  AddDeviceTypeBloc() : super(AddDeviceInitial()) {
-  AddDeviceTypeBloc(List<SelectedProduct> initialProducts)
+    on<InitializeDevice>(_onInitializeTagModels);
-      : super(initialProducts) {
     on<UpdateProductCountEvent>(_onUpdateProductCount);
   }
 
+  void _onInitializeTagModels(
+      InitializeDevice event, Emitter<AddDeviceState> emit) {
+    emit(AddDeviceLoaded(
+      selectedProducts: event.addedProducts,
+      initialTag: event.initialTags,
+    ));
+  }
+
   void _onUpdateProductCount(
-      UpdateProductCountEvent event, Emitter<List<SelectedProduct>> emit) {
+      UpdateProductCountEvent event, Emitter<AddDeviceState> emit) {
-    final existingProduct = state.firstWhere(
+    final currentState = state;
+
+    if (currentState is AddDeviceLoaded) {
+      final existingProduct = currentState.selectedProducts.firstWhere(
         (p) => p.productId == event.productId,
-      orElse: () => SelectedProduct(productId: event.productId, count: 0,productName: event.productName,product: event.product ),
+        orElse: () => SelectedProduct(
+          productId: event.productId,
+          count: 0,
+          productName: event.productName,
+          product: event.product,
+        ),
       );
 
+      List<SelectedProduct> updatedProducts;
+
       if (event.count > 0) {
-      if (!state.contains(existingProduct)) {
+        if (!currentState.selectedProducts.contains(existingProduct)) {
-        emit([
+          updatedProducts = [
-          ...state,
+            ...currentState.selectedProducts,
-          SelectedProduct(productId: event.productId, count: event.count, productName: event.productName, product: event.product)
+            SelectedProduct(
-        ]);
+              productId: event.productId,
+              count: event.count,
+              productName: event.productName,
+              product: event.product,
+            ),
+          ];
         } else {
-        final updatedList = state.map((p) {
+          updatedProducts = currentState.selectedProducts.map((p) {
             if (p.productId == event.productId) {
-            return SelectedProduct(productId: p.productId, count: event.count, productName: p.productName,product: p.product);
+              return SelectedProduct(
+                productId: p.productId,
+                count: event.count,
+                productName: p.productName,
+                product: p.product,
+              );
             }
             return p;
           }).toList();
-        emit(updatedList);
         }
       } else {
-      emit(state.where((p) => p.productId != event.productId).toList());
+        // Remove the product if the count is 0
+        updatedProducts = currentState.selectedProducts
+            .where((p) => p.productId != event.productId)
+            .toList();
+      }
+
+      // Emit the updated state
+      emit(AddDeviceLoaded(
+          selectedProducts: updatedProducts,
+          initialTag: currentState.initialTag));
     }
   }
 }

lib/pages/spaces_management/add_device_type/bloc/add_device_state.dart

@@ -0,0 +1,36 @@
+import 'package:equatable/equatable.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
+
+abstract class AddDeviceState extends Equatable {
+  const AddDeviceState();
+
+  @override
+  List<Object> get props => [];
+}
+
+class AddDeviceInitial extends AddDeviceState {}
+
+class AddDeviceLoading extends AddDeviceState {}
+
+class AddDeviceLoaded extends AddDeviceState {
+  final List<SelectedProduct> selectedProducts;
+  final List<Tag> initialTag;
+
+  const AddDeviceLoaded({
+    required this.selectedProducts,
+    required this.initialTag,
+  });
+
+  @override
+  List<Object> get props => [selectedProducts, initialTag];
+}
+
+class AddDeviceError extends AddDeviceState {
+  final String errorMessage;
+
+  const AddDeviceError(this.errorMessage);
+
+  @override
+  List<Object> get props => [errorMessage];
+}

lib/pages/spaces_management/add_device_type/bloc/add_device_type_model_event.dart

@@ -1,7 +1,11 @@
 import 'package:equatable/equatable.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 
 abstract class AddDeviceTypeEvent extends Equatable {
+  const AddDeviceTypeEvent();
+
   @override
   List<Object> get props => [];
 }
@@ -12,8 +16,26 @@ class UpdateProductCountEvent extends AddDeviceTypeEvent {
   final String productName;
   final ProductModel product;
 
-  UpdateProductCountEvent({required this.productId, required this.count, required this.productName, required this.product});
+  UpdateProductCountEvent(
+      {required this.productId,
+      required this.count,
+      required this.productName,
+      required this.product});
 
   @override
   List<Object> get props => [productId, count];
 }
+
+
+class InitializeDevice extends AddDeviceTypeEvent {
+  final List<Tag> initialTags;
+  final List<SelectedProduct> addedProducts;
+
+  const InitializeDevice({
+    this.initialTags = const [],
+    required this.addedProducts,
+  });
+
+  @override
+  List<Object> get props => [initialTags, addedProducts];
+}

lib/pages/spaces_management/add_device_type/views/add_device_type_widget.dart

@@ -1,17 +1,19 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.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/add_device_type/bloc/add_device_model_bloc.dart';
+import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_state.dart';
+import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_type_model_event.dart';
 import 'package:syncrow_web/pages/spaces_management/add_device_type/widgets/scrollable_grid_view_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/subspace_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag/views/assign_tag_dialog.dart';
-import 'package:syncrow_web/pages/spaces_management/tag_model/widgets/action_button_widget.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 
-
 class AddDeviceTypeWidget extends StatelessWidget {
   final List<ProductModel>? products;
   final ValueChanged<List<SelectedProduct>>? onProductsSelected;
@@ -20,11 +22,12 @@ class AddDeviceTypeWidget extends StatelessWidget {
   final List<Tag>? spaceTags;
   final List<String>? allTags;
   final String spaceName;
+  final bool isCreate;
   final Function(List<Tag>, List<SubspaceModel>?)? onSave;
 
-
   const AddDeviceTypeWidget(
       {super.key,
+      required this.isCreate,
       this.products,
       this.initialSelectedProducts,
       this.onProductsSelected,
@@ -44,12 +47,22 @@ class AddDeviceTypeWidget extends StatelessWidget {
             : 3;
 
     return BlocProvider(
-        create: (_) => AddDeviceTypeBloc(initialSelectedProducts ?? []),
+        create: (_) => AddDeviceTypeBloc()
+          ..add(InitializeDevice(
+            initialTags: spaceTags ?? [],
+            addedProducts: initialSelectedProducts ?? [],
+          )),
         child: Builder(
           builder: (context) => AlertDialog(
             title: const Text('Add Devices'),
             backgroundColor: ColorsManager.whiteColors,
-            content: SingleChildScrollView(
+            content: BlocBuilder<AddDeviceTypeBloc, AddDeviceState>(
+                builder: (context, state) {
+              if (state is AddDeviceLoading) {
+                return const Center(child: CircularProgressIndicator());
+              }
+              if (state is AddDeviceLoaded) {
+                return SingleChildScrollView(
                   child: Container(
                     width: size.width * 0.9,
                     height: size.height * 0.65,
@@ -59,15 +72,22 @@ class AddDeviceTypeWidget extends StatelessWidget {
                         const SizedBox(height: 16),
                         Expanded(
                           child: Padding(
-                        padding: const EdgeInsets.symmetric(horizontal: 20.0),
+                            padding:
+                                const EdgeInsets.symmetric(horizontal: 20.0),
                             child: ScrollableGridViewWidget(
-                            products: products, crossAxisCount: crossAxisCount),
+                                initialProductCounts: state.selectedProducts,
+                                products: products,
+                                isCreate: isCreate,
+                                crossAxisCount: crossAxisCount),
                           ),
                         ),
                       ],
                     ),
                   ),
-            ),
+                );
+              }
+              return const SizedBox();
+            }),
             actions: [
               Row(
                 mainAxisAlignment: MainAxisAlignment.spaceBetween,
@@ -78,20 +98,27 @@ class AddDeviceTypeWidget extends StatelessWidget {
                       Navigator.of(context).pop();
                     },
                   ),
-                  ActionButton(
+                  SizedBox(
-                    label: 'Continue',
+                      width: 140,
+                      child: BlocBuilder<AddDeviceTypeBloc, AddDeviceState>(
+                        builder: (context, state) {
+                          final isDisabled = state is AddDeviceLoaded &&
+                              state.selectedProducts.isEmpty;
+                          return DefaultButton(
+                            borderRadius: 10,
                             backgroundColor: ColorsManager.secondaryColor,
-                    foregroundColor: ColorsManager.whiteColors,
+                            foregroundColor: isDisabled
+                                ? ColorsManager.whiteColorsWithOpacity
+                                : ColorsManager.whiteColors,
                             onPressed: () async {
-                      final currentState =
+                              if (state is AddDeviceLoaded &&
-                          context.read<AddDeviceTypeBloc>().state;
+                                  state.selectedProducts.isNotEmpty) {
-                      Navigator.of(context).pop();
+                                final initialTags =
-
+                                    TagHelper.generateInitialForTags(
-                      if (currentState.isNotEmpty) {
-                        final initialTags = generateInitialTags(
                                   spaceTags: spaceTags,
                                   subspaces: subspaces,
                                 );
+                                Navigator.of(context).pop();
 
                                 final dialogTitle = initialTags.isNotEmpty
                                     ? 'Edit Device'
@@ -102,48 +129,23 @@ class AddDeviceTypeWidget extends StatelessWidget {
                                   builder: (context) => AssignTagDialog(
                                       products: products,
                                       subspaces: subspaces,
-                            addedProducts: currentState,
+                                      addedProducts: state.selectedProducts,
                                       allTags: allTags,
                                       spaceName: spaceName,
                                       initialTags: initialTags,
                                       title: dialogTitle,
-                            onSave: (tags,subspaces){
+                                      onSave: onSave),
-                              onSave!(tags,subspaces);
-                            },
-                          ),
                                 );
                               }
                             },
-                  ),
+                            child: const Text('Next'),
+                          );
+                        },
+                      )),
                 ],
               ),
             ],
           ),
         ));
   }
-
-  List<Tag> generateInitialTags({
-    List<Tag>? spaceTags,
-    List<SubspaceModel>? subspaces,
-  }) {
-    final List<Tag> initialTags = [];
-
-    if (spaceTags != null) {
-      initialTags.addAll(spaceTags);
-    }
-
-    if (subspaces != null) {
-      for (var subspace in subspaces) {
-        if (subspace.tags != null) {
-          initialTags.addAll(
-            subspace.tags!.map(
-              (tag) => tag.copyWith(location: subspace.subspaceName),
-            ),
-          );
-        }
-      }
-    }
-
-    return initialTags;
-  }
 }

lib/pages/spaces_management/add_device_type/widgets/device_type_tile_widget.dart

@@ -13,12 +13,13 @@ import 'package:syncrow_web/utils/constants/assets.dart';
 class DeviceTypeTileWidget extends StatelessWidget {
   final ProductModel product;
   final List<SelectedProduct> productCounts;
+  final bool isCreate;
 
-  const DeviceTypeTileWidget({
+  const DeviceTypeTileWidget(
-    super.key,
+      {super.key,
       required this.product,
       required this.productCounts,
-  });
+      required this.isCreate});
 
   @override
   Widget build(BuildContext context) {
@@ -48,7 +49,7 @@ class DeviceTypeTileWidget extends StatelessWidget {
             DeviceNameWidget(name: product.name),
             const SizedBox(height: 4),
             CounterWidget(
-              isCreate: false,
+              isCreate: isCreate,
               initialCount: selectedProduct.count,
               onCountChanged: (newCount) {
                 context.read<AddDeviceTypeBloc>().add(

lib/pages/spaces_management/add_device_type/widgets/scrollable_grid_view_widget.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_model_bloc.dart';
+import 'package:syncrow_web/pages/spaces_management/add_device_type/bloc/add_device_state.dart';
 import 'package:syncrow_web/pages/spaces_management/add_device_type/widgets/device_type_tile_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
@@ -9,13 +10,14 @@ class ScrollableGridViewWidget extends StatelessWidget {
   final List<ProductModel>? products;
   final int crossAxisCount;
   final List<SelectedProduct>? initialProductCounts;
+  final bool isCreate;
 
-  const ScrollableGridViewWidget({
+  const ScrollableGridViewWidget(
-    super.key,
+      {super.key,
       required this.products,
       required this.crossAxisCount,
       this.initialProductCounts,
-  });
+      required this.isCreate});
 
   @override
   Widget build(BuildContext context) {
@@ -24,8 +26,11 @@ class ScrollableGridViewWidget extends StatelessWidget {
     return Scrollbar(
       controller: scrollController,
       thumbVisibility: true,
-      child: BlocBuilder<AddDeviceTypeBloc, List<SelectedProduct>>(
+      child: BlocBuilder<AddDeviceTypeBloc, AddDeviceState>(
-        builder: (context, productCounts) {
+        builder: (context, state) {
+          final productCounts = state is AddDeviceLoaded
+              ? state.selectedProducts
+              : <SelectedProduct>[];
           return GridView.builder(
             controller: scrollController,
             shrinkWrap: true,
@@ -42,6 +47,7 @@ class ScrollableGridViewWidget extends StatelessWidget {
 
               return DeviceTypeTileWidget(
                 product: product,
+                isCreate: isCreate,
                 productCounts: initialProductCount != null
                     ? [...productCounts, initialProductCount]
                     : productCounts,

lib/pages/spaces_management/all_spaces/bloc/space_management_bloc.dart

@@ -5,12 +5,15 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_mod
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_event.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_state.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/subspace_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_body_model.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_update_model.dart';
 import 'package:syncrow_web/services/product_api.dart';
 import 'package:syncrow_web/services/space_mana_api.dart';
 import 'package:syncrow_web/services/space_model_mang_api.dart';
+import 'package:syncrow_web/utils/constants/action_enum.dart';
 
 class SpaceManagementBloc
     extends Bloc<SpaceManagementEvent, SpaceManagementState> {
@@ -176,6 +179,7 @@ class SpaceManagementBloc
       final updatedCommunities =
           await Future.wait(communities.map((community) async {
         final spaces = await _fetchSpacesForCommunity(community.uuid);
+
         return CommunityModel(
           uuid: community.uuid,
           createdAt: community.createdAt,
@@ -310,6 +314,7 @@ class SpaceManagementBloc
     SelectSpaceEvent event,
     Emitter<SpaceManagementState> emit,
   ) {
+    
     _handleCommunitySpaceStateUpdate(
       emit: emit,
       selectedCommunity: event.selectedCommunity,
@@ -341,7 +346,7 @@ class SpaceManagementBloc
             products: _cachedProducts ?? [],
             selectedCommunity: selectedCommunity,
             selectedSpace: selectedSpace,
-            spaceModels: spaceModels ?? []));
+            spaceModels: spaceModels));
       }
     } catch (e) {
       emit(SpaceManagementError('Error updating state: $e'));
@@ -428,6 +433,76 @@ class SpaceManagementBloc
     for (var space in orderedSpaces) {
       try {
         if (space.uuid != null && space.uuid!.isNotEmpty) {
+          List<TagModelUpdate> tagUpdates = [];
+
+          final prevSpace = await _api.getSpace(communityUuid, space.uuid!);
+          final List<UpdateSubspaceTemplateModel> subspaceUpdates = [];
+          final List<SubspaceModel>? prevSubspaces = prevSpace?.subspaces;
+          final List<SubspaceModel>? newSubspaces = space.subspaces;
+
+          tagUpdates = processTagUpdates(prevSpace?.tags, space.tags);
+
+          if (prevSubspaces != null || newSubspaces != null) {
+            if (prevSubspaces != null && newSubspaces != null) {
+              for (var prevSubspace in prevSubspaces) {
+                final existsInNew = newSubspaces
+                    .any((subspace) => subspace.uuid == prevSubspace.uuid);
+                if (!existsInNew) {
+                  subspaceUpdates.add(UpdateSubspaceTemplateModel(
+                      action: Action.delete, uuid: prevSubspace.uuid));
+                }
+              }
+            } else if (prevSubspaces != null && newSubspaces == null) {
+              for (var prevSubspace in prevSubspaces) {
+                subspaceUpdates.add(UpdateSubspaceTemplateModel(
+                    action: Action.delete, uuid: prevSubspace.uuid));
+              }
+            }
+
+            if (newSubspaces != null) {
+              for (var newSubspace in newSubspaces) {
+                // Tag without UUID
+                if ((newSubspace.uuid == null || newSubspace.uuid!.isEmpty)) {
+                  final List<TagModelUpdate> tagUpdates = [];
+
+                  if (newSubspace.tags != null) {
+                    for (var tag in newSubspace.tags!) {
+                      tagUpdates.add(TagModelUpdate(
+                          action: Action.add,
+                          uuid: tag.uuid == '' ? null : tag.uuid,
+                          tag: tag.tag,
+                          productUuid: tag.product?.uuid));
+                    }
+                  }
+                  subspaceUpdates.add(UpdateSubspaceTemplateModel(
+                      action: Action.add,
+                      subspaceName: newSubspace.subspaceName,
+                      tags: tagUpdates));
+                }
+              }
+            }
+
+            if (prevSubspaces != null && newSubspaces != null) {
+              final newSubspaceMap = {
+                for (var subspace in newSubspaces) subspace.uuid: subspace
+              };
+
+              for (var prevSubspace in prevSubspaces) {
+                final newSubspace = newSubspaceMap[prevSubspace.uuid];
+
+                if (newSubspace != null) {
+                  final List<TagModelUpdate> tagSubspaceUpdates =
+                      processTagUpdates(prevSubspace.tags, newSubspace.tags);
+                  subspaceUpdates.add(UpdateSubspaceTemplateModel(
+                      action: Action.update,
+                      uuid: newSubspace.uuid,
+                      subspaceName: newSubspace.subspaceName,
+                      tags: tagSubspaceUpdates));
+                }
+              }
+            }
+          }
+
           final response = await _api.updateSpace(
             communityId: communityUuid,
             spaceId: space.uuid!,
@@ -436,6 +511,8 @@ class SpaceManagementBloc
             isPrivate: space.isPrivate,
             position: space.position,
             icon: space.icon,
+            subspaces: subspaceUpdates,
+            tags: tagUpdates,
             direction: space.incomingConnection?.direction,
           );
         } else {
@@ -535,4 +612,79 @@ class SpaceManagementBloc
       emit(SpaceManagementError('Error loading communities and spaces: $e'));
     }
   }
+
+  List<TagModelUpdate> processTagUpdates(
+    List<Tag>? prevTags,
+    List<Tag>? newTags,
+  ) {
+    final List<TagModelUpdate> tagUpdates = [];
+    final processedTags = <String?>{};
+
+    if (prevTags == null && newTags != null) {
+      for (var newTag in newTags) {
+        tagUpdates.add(TagModelUpdate(
+          action: Action.add,
+          tag: newTag.tag,
+          uuid: newTag.uuid,
+          productUuid: newTag.product?.uuid,
+        ));
+      }
+      return tagUpdates;
+    }
+
+    if (newTags != null || prevTags != null) {
+      // Case 1: Tags deleted
+      if (prevTags != null && newTags != null) {
+        for (var prevTag in prevTags) {
+          final existsInNew =
+              newTags.any((newTag) => newTag.uuid == prevTag.uuid);
+          if (!existsInNew) {
+            tagUpdates
+                .add(TagModelUpdate(action: Action.delete, uuid: prevTag.uuid));
+          }
+        }
+      } else if (prevTags != null && newTags == null) {
+        for (var prevTag in prevTags) {
+          tagUpdates
+              .add(TagModelUpdate(action: Action.delete, uuid: prevTag.uuid));
+        }
+      }
+
+      // Case 2: Tags added
+      if (newTags != null) {
+        final prevTagUuids = prevTags?.map((t) => t.uuid).toSet() ?? {};
+
+        for (var newTag in newTags) {
+          // Tag without UUID
+          if ((newTag.uuid == null || !prevTagUuids.contains(newTag.uuid)) &&
+              !processedTags.contains(newTag.tag)) {
+            tagUpdates.add(TagModelUpdate(
+                action: Action.add,
+                tag: newTag.tag,
+                uuid: newTag.uuid == '' ? null : newTag.uuid,
+                productUuid: newTag.product?.uuid));
+            processedTags.add(newTag.tag);
+          }
+        }
+      }
+
+      // Case 3: Tags updated
+      if (prevTags != null && newTags != null) {
+        final newTagMap = {for (var tag in newTags) tag.uuid: tag};
+
+        for (var prevTag in prevTags) {
+          final newTag = newTagMap[prevTag.uuid];
+          if (newTag != null) {
+            tagUpdates.add(TagModelUpdate(
+              action: Action.update,
+              uuid: newTag.uuid,
+              tag: newTag.tag,
+            ));
+          } else {}
+        }
+      }
+    }
+
+    return tagUpdates;
+  }
 }

lib/pages/spaces_management/all_spaces/model/base_tag.dart

@@ -0,0 +1,26 @@
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
+import 'package:uuid/uuid.dart';
+
+abstract class BaseTag {
+  String? uuid;
+  String? tag;
+  final ProductModel? product;
+  String internalId;
+  String? location;
+
+  BaseTag({
+    this.uuid,
+    required this.tag,
+    this.product,
+    String? internalId,
+    this.location,
+  }) : internalId = internalId ?? const Uuid().v4();
+
+ Map<String, dynamic> toJson();
+  BaseTag copyWith({
+    String? tag,
+    ProductModel? product,
+    String? location,
+    String? internalId,
+  });
+}

lib/pages/spaces_management/all_spaces/model/space_model.dart

@@ -66,7 +66,6 @@ class SpaceModel {
     final instance = SpaceModel(
       internalId: internalId,
       uuid: json['uuid'] ?? '',
-      spaceTuyaUuid: json['spaceTuyaUuid'],
       name: json['spaceName'],
       isPrivate: json['isPrivate'] ?? false,
       invitationCode: json['invitationCode'],
@@ -96,6 +95,9 @@ class SpaceModel {
       icon: json['icon'] ?? Assets.location,
       position: Offset(json['x'] ?? 0, json['y'] ?? 0),
       isHovered: false,
+      spaceModel: json['spaceModel'] != null
+          ? SpaceTemplateModel.fromJson(json['spaceModel'])
+          : null,
       tags: (json['tags'] as List<dynamic>?)
               ?.where((item) => item is Map<String, dynamic>) // Validate type
               .map((item) => Tag.fromJson(item as Map<String, dynamic>))

lib/pages/spaces_management/all_spaces/model/subspace_model.dart

@@ -1,5 +1,6 @@
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/utils/constants/action_enum.dart';
+import 'package:uuid/uuid.dart';
 
 import 'tag.dart';
 
@@ -8,19 +9,24 @@ class SubspaceModel {
   String subspaceName;
   final bool disabled;
   List<Tag>? tags;
+  String internalId;
 
   SubspaceModel({
     this.uuid,
     required this.subspaceName,
     required this.disabled,
     this.tags,
-  });
+    String? internalId,
+  }) : internalId = internalId ?? const Uuid().v4();
 
   factory SubspaceModel.fromJson(Map<String, dynamic> json) {
+    final String internalId = json['internalId'] ?? const Uuid().v4();
+
     return SubspaceModel(
       uuid: json['uuid'] ?? '',
       subspaceName: json['subspaceName'] ?? '',
       disabled: json['disabled'] ?? false,
+      internalId: internalId,
       tags: (json['tags'] as List<dynamic>?)
               ?.map((item) => Tag.fromJson(item))
               .toList() ??

lib/pages/spaces_management/all_spaces/model/tag.dart

@@ -1,22 +1,23 @@
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/base_tag.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/create_space_template_body_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_body_model.dart';
 import 'package:uuid/uuid.dart';
 
-class Tag {
+class Tag extends BaseTag {
-  String? uuid;
+  Tag({
-  String? tag;
+    String? uuid,
-  final ProductModel? product;
+    required String? tag,
-  String internalId;
+    ProductModel? product,
-  String? location;
-
-  Tag(
-      {this.uuid,
-      required this.tag,
-      this.product,
     String? internalId,
-      this.location})
+    String? location,
-      : internalId = internalId ?? const Uuid().v4();
+  }) : super(
+          uuid: uuid,
+          tag: tag,
+          product: product,
+          internalId: internalId,
+          location: location,
+        );
 
   factory Tag.fromJson(Map<String, dynamic> json) {
     final String internalId = json['internalId'] ?? const Uuid().v4();
@@ -31,15 +32,19 @@ class Tag {
     );
   }
 
+  @override
   Tag copyWith({
     String? tag,
     ProductModel? product,
     String? location,
+    String? internalId,
   }) {
     return Tag(
+      uuid: uuid,
       tag: tag ?? this.tag,
       product: product ?? this.product,
       location: location ?? this.location,
+      internalId: internalId ?? this.internalId,
     );
   }
 

lib/pages/spaces_management/all_spaces/widgets/community_structure_header_action_button.dart

@@ -0,0 +1,68 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/community_structure_header_button.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+import 'package:syncrow_web/utils/constants/assets.dart';
+
+class CommunityStructureHeaderActionButtons extends StatelessWidget {
+  const CommunityStructureHeaderActionButtons(
+      {super.key,
+      required this.theme,
+      required this.isSave,
+      required this.onSave,
+      required this.onDelete,
+      required this.selectedSpace,
+      required this.onDuplicate,
+      required this.onEdit});
+
+  final ThemeData theme;
+  final bool isSave;
+  final VoidCallback onSave;
+  final VoidCallback onDelete;
+  final VoidCallback onDuplicate;
+  final VoidCallback onEdit;
+
+  final SpaceModel? selectedSpace;
+
+  @override
+  Widget build(BuildContext context) {
+    final canShowActions = selectedSpace != null &&
+        selectedSpace?.status != SpaceStatus.deleted &&
+        selectedSpace?.status != SpaceStatus.parentDeleted;
+
+    return Wrap(
+      alignment: WrapAlignment.end,
+      spacing: 10,
+      children: [
+        if (isSave)
+          CommunityStructureHeaderButton(
+            label: "Save",
+            icon: const Icon(Icons.save,
+                size: 18, color: ColorsManager.spaceColor),
+            onPressed: onSave,
+            theme: theme,
+          ),
+        if (canShowActions) ...[
+          CommunityStructureHeaderButton(
+            label: "Edit",
+            svgAsset: Assets.editSpace,
+            onPressed: onEdit,
+            theme: theme,
+          ),
+          CommunityStructureHeaderButton(
+            label: "Duplicate",
+            svgAsset: Assets.duplicate,
+            onPressed: onDuplicate,
+            theme: theme,
+          ),
+          CommunityStructureHeaderButton(
+            label: "Delete",
+            svgAsset: Assets.spaceDelete,
+            onPressed: onDelete,
+            theme: theme,
+          ),
+        ],
+      ],
+    );
+  }
+}

lib/pages/spaces_management/all_spaces/widgets/community_structure_header_button.dart

@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+import 'package:syncrow_web/pages/common/buttons/default_button.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+
+class CommunityStructureHeaderButton extends StatelessWidget {
+  const CommunityStructureHeaderButton({
+    super.key,
+    required this.label,
+    this.icon,
+    required this.onPressed,
+    this.svgAsset,
+    required this.theme,
+  });
+
+  final String label;
+  final Widget? icon;
+  final VoidCallback onPressed;
+  final String? svgAsset;
+  final ThemeData theme;
+
+  @override
+  Widget build(BuildContext context) {
+    const double buttonHeight = 40;
+    return ConstrainedBox(
+      constraints: const BoxConstraints(
+        maxWidth: 130,
+        minHeight: buttonHeight,
+      ),
+      child: DefaultButton(
+        onPressed: onPressed,
+        borderWidth: 2,
+        backgroundColor: ColorsManager.textFieldGreyColor,
+        foregroundColor: ColorsManager.blackColor,
+        borderRadius: 12.0,
+        padding: 2.0,
+        height: buttonHeight,
+        elevation: 0,
+        borderColor: ColorsManager.lightGrayColor,
+        child: Row(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            if (icon != null) icon!,
+            if (svgAsset != null)
+              SvgPicture.asset(
+                svgAsset!,
+                width: 20,
+                height: 20,
+              ),
+            const SizedBox(width: 10),
+            Flexible(
+              child: Text(
+                label,
+                style: theme.textTheme.bodySmall
+                    ?.copyWith(color: ColorsManager.blackColor, fontSize: 14),
+                overflow: TextOverflow.ellipsis,
+                maxLines: 1,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/pages/spaces_management/all_spaces/widgets/community_structure_header_widget.dart

@@ -1,8 +1,8 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
-import 'package:syncrow_web/pages/common/buttons/default_button.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/community_structure_header_action_button.dart';
 import 'package:syncrow_web/pages/spaces_management/create_community/view/create_community_dialog.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 import 'package:syncrow_web/utils/constants/assets.dart';
@@ -14,6 +14,9 @@ class CommunityStructureHeader extends StatefulWidget {
   final TextEditingController nameController;
   final VoidCallback onSave;
   final VoidCallback onDelete;
+    final VoidCallback onEdit;
+  final VoidCallback onDuplicate;
+
   final VoidCallback onEditName;
   final ValueChanged<String> onNameSubmitted;
   final List<CommunityModel> communities;
@@ -32,7 +35,9 @@ class CommunityStructureHeader extends StatefulWidget {
       required this.onNameSubmitted,
       this.community,
       required this.communities,
-      this.selectedSpace});
+      this.selectedSpace,
+      required this.onDuplicate,
+      required this.onEdit});
 
   @override
   State<CommunityStructureHeader> createState() =>
@@ -141,70 +146,18 @@ class _CommunityStructureHeaderState extends State<CommunityStructureHeader> {
                 ),
               ),
               const SizedBox(width: 8),
-              _buildActionButtons(theme),
+              CommunityStructureHeaderActionButtons(
+                theme: theme,
+                isSave: widget.isSave,
+                onSave: widget.onSave,
+                onDelete: widget.onDelete,
+                onDuplicate: widget.onDuplicate,
+                onEdit: widget.onEdit,
+                selectedSpace: widget.selectedSpace,
+              ),
             ],
           ),
       ],
     );
   }
-
-  Widget _buildActionButtons(ThemeData theme) {
-    return Wrap(
-      alignment: WrapAlignment.end,
-      spacing: 10,
-      children: [
-        if (widget.isSave)
-          _buildButton(
-              label: "Save",
-              icon: const Icon(Icons.save,
-                  size: 18, color: ColorsManager.spaceColor),
-              onPressed: widget.onSave,
-              theme: theme),
-        if(widget.selectedSpace!= null)
-        _buildButton(
-            label: "Delete",
-            icon: const Icon(Icons.delete,
-                size: 18, color: ColorsManager.warningRed),
-            onPressed: widget.onDelete,
-            theme: theme),
-      ],
-    );
-  }
-
-  Widget _buildButton(
-      {required String label,
-      required Widget icon,
-      required VoidCallback onPressed,
-      required ThemeData theme}) {
-    const double buttonHeight = 30;
-    return ConstrainedBox(
-      constraints: BoxConstraints(maxWidth: 80, minHeight: buttonHeight),
-      child: DefaultButton(
-        onPressed: onPressed,
-        backgroundColor: ColorsManager.textFieldGreyColor,
-        foregroundColor: ColorsManager.blackColor,
-        borderRadius: 8.0,
-        padding: 2.0,
-        height: buttonHeight,
-        elevation: 0,
-        borderColor: ColorsManager.lightGrayColor,
-        child: Row(
-          mainAxisSize: MainAxisSize.min,
-          children: [
-            icon,
-            const SizedBox(width: 5),
-            Flexible(
-              child: Text(
-                label,
-                style: theme.textTheme.bodySmall
-                    ?.copyWith(color: ColorsManager.blackColor),
-                overflow: TextOverflow.ellipsis,
-                maxLines: 1,
-              ),
-            ),
-          ],
-        ),
-      ),
-    );
-  }
 }

lib/pages/spaces_management/all_spaces/widgets/community_structure_widget.dart

@@ -4,6 +4,8 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 
 // Syncrow project imports
 import 'package:syncrow_web/pages/common/buttons/add_space_button.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/all_spaces/bloc/space_management_bloc.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/bloc/space_management_event.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
@@ -17,8 +19,10 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/blank_com
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/community_structure_header_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/dialogs/create_space_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/curved_line_painter.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/dialogs/duplicate_process_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/space_card_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/space_container_widget.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/space_helper.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 
@@ -133,6 +137,8 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
               onSave: _saveSpaces,
               selectedSpace: widget.selectedSpace,
               onDelete: _onDelete,
+              onDuplicate: () => {_onDuplicate(context)},
+              onEdit: () => {_showEditSpaceDialog()},
               onEditName: () {
                 setState(() {
                   isEditingName = !isEditingName;
@@ -209,9 +215,6 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
                                       opacity: isHighlighted ? 1.0 : 0.3,
                                       child: SpaceContainerWidget(
                                         index: index,
-                                        onDoubleTap: () {
-                                          _showEditSpaceDialog(spaces[index]);
-                                        },
                                         onTap: () {
                                           _selectSpace(context, spaces[index]);
                                         },
@@ -292,6 +295,7 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
         return CreateSpaceDialog(
           products: widget.products,
           spaceModels: widget.spaceModels,
+          allTags: _getAllTagValues(spaces),
           parentSpace: parentIndex != null ? spaces[parentIndex] : null,
           onCreateSpace: (String name,
               String icon,
@@ -328,7 +332,6 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
                 parentSpace.addOutgoingConnection(newConnection);
                 parentSpace.children.add(newSpace);
               }
-
               spaces.add(newSpace);
               _updateNodePosition(newSpace, newSpace.position);
             });
@@ -338,16 +341,24 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
     );
   }
 
-  void _showEditSpaceDialog(SpaceModel space) {
+  void _showEditSpaceDialog() {
+    if (widget.selectedSpace != null) {
       showDialog(
         context: context,
         builder: (BuildContext context) {
           return CreateSpaceDialog(
             products: widget.products,
-          name: space.name,
+            spaceModels: widget.spaceModels,
-          icon: space.icon,
+            name: widget.selectedSpace!.name,
-          editSpace: space,
+            icon: widget.selectedSpace!.icon,
+            parentSpace: SpaceHelper.findSpaceByInternalId(
+                widget.selectedSpace?.parent?.internalId, spaces),
+            editSpace: widget.selectedSpace,
+            currentSpaceModel: widget.selectedSpace?.spaceModel,
+            tags: widget.selectedSpace?.tags,
+            subspaces: widget.selectedSpace?.subspaces,
             isEdit: true,
+            allTags: _getAllTagValues(spaces),
             onCreateSpace: (String name,
                 String icon,
                 List<SelectedProduct> selectedProducts,
@@ -356,22 +367,33 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
                 List<Tag>? tags) {
               setState(() {
                 // Update the space's properties
-              space.name = name;
+                widget.selectedSpace!.name = name;
-              space.icon = icon;
+                widget.selectedSpace!.icon = icon;
-              space.spaceModel = spaceModel;
+                widget.selectedSpace!.spaceModel = spaceModel;
+                widget.selectedSpace!.subspaces = subspaces;
+                widget.selectedSpace!.tags = tags;
+
+                if (widget.selectedSpace!.status != SpaceStatus.newSpace) {
+                  widget.selectedSpace!.status =
+                      SpaceStatus.modified; // Mark as modified
+                }
+
+                for (var space in spaces) {
+                  if (space.internalId == widget.selectedSpace?.internalId) {
+                    space.status = SpaceStatus.modified;
                     space.subspaces = subspaces;
                     space.tags = tags;
-
+                    space.name = name;
-              if (space.status != SpaceStatus.newSpace) {
+                  }
-                space.status = SpaceStatus.modified; // Mark as modified
                 }
               });
             },
-          key: Key(space.name),
+            key: Key(widget.selectedSpace!.name),
           );
         },
       );
     }
+  }
 
   void _handleHoverChanged(int index, bool isHovered) {
     setState(() {
@@ -442,7 +464,6 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
     }).toList();
 
     if (spacesToSave.isEmpty) {
-      debugPrint("No new or modified spaces to save.");
       return;
     }
 
@@ -545,4 +566,201 @@ class _CommunityStructureAreaState extends State<CommunityStructureArea> {
             space.status == SpaceStatus.modified ||
             space.status == SpaceStatus.deleted);
   }
+
+  void _onDuplicate(BuildContext parentContext) {
+    final screenWidth = MediaQuery.of(context).size.width;
+
+    if (widget.selectedSpace != null) {
+      showDialog(
+        context: context,
+        builder: (BuildContext context) {
+          return AlertDialog(
+            backgroundColor: ColorsManager.whiteColors,
+            title: Text(
+              "Duplicate Space",
+              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 duplicate?",
+                      textAlign: TextAlign.center,
+                      style: Theme.of(context).textTheme.headlineSmall),
+                  const SizedBox(height: 15),
+                  Text("All the child spaces will be duplicated.",
+                      textAlign: TextAlign.center,
+                      style: Theme.of(context)
+                          .textTheme
+                          .bodyMedium
+                          ?.copyWith(color: ColorsManager.lightGrayColor)),
+                  const SizedBox(width: 15),
+                ],
+              ),
+            ),
+            actions: [
+              Row(mainAxisAlignment: MainAxisAlignment.center, children: [
+                SizedBox(
+                  width: 200,
+                  child: CancelButton(
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                    },
+                    label: "Cancel",
+                  ),
+                ),
+                const SizedBox(width: 10),
+                SizedBox(
+                  width: 200,
+                  child: DefaultButton(
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                      showDialog(
+                        context: context,
+                        barrierDismissible: false,
+                        builder: (BuildContext context) {
+                          return DuplicateProcessDialog(
+                            onDuplicate: () {
+                              _duplicateSpace(widget.selectedSpace!);
+                              _deselectSpace(parentContext);
+                            },
+                          );
+                        },
+                      );
+                    },
+                    backgroundColor: ColorsManager.secondaryColor,
+                    borderRadius: 10,
+                    foregroundColor: ColorsManager.whiteColors,
+                    child: const Text('OK'),
+                  ),
+                ),
+              ])
+            ],
+          );
+        },
+      );
+    }
+  }
+
+  void _duplicateSpace(SpaceModel space) {
+    final Map<SpaceModel, SpaceModel> originalToDuplicate = {};
+    const double horizontalGap = 200.0;
+    const double verticalGap = 100.0;
+
+    final Map<String, int> nameCounters = {};
+
+    SpaceModel duplicateRecursive(SpaceModel original, Offset parentPosition,
+        SpaceModel? duplicatedParent) {
+      Offset newPosition = parentPosition + Offset(horizontalGap, 0);
+
+      while (spaces.any((s) =>
+          (s.position - newPosition).distance < horizontalGap &&
+          s.status != SpaceStatus.deleted)) {
+        newPosition += Offset(horizontalGap, 0);
+      }
+
+      final duplicatedName =
+          SpaceHelper.generateUniqueSpaceName(original.name, spaces);
+
+      final duplicated = SpaceModel(
+        name: duplicatedName,
+        icon: original.icon,
+        position: newPosition,
+        isPrivate: original.isPrivate,
+        children: [],
+        status: SpaceStatus.newSpace,
+        parent: duplicatedParent,
+        spaceModel: original.spaceModel,
+        subspaces: original.subspaces,
+        tags: original.tags,
+      );
+
+      originalToDuplicate[original] = duplicated;
+
+      setState(() {
+        spaces.add(duplicated);
+        _updateNodePosition(duplicated, duplicated.position);
+
+        if (duplicatedParent != null) {
+          final newConnection = Connection(
+            startSpace: duplicatedParent,
+            endSpace: duplicated,
+            direction: "down",
+          );
+          connections.add(newConnection);
+          duplicated.incomingConnection = newConnection;
+          duplicatedParent.addOutgoingConnection(newConnection);
+        }
+
+        if (original.parent != null && duplicatedParent == null) {
+          final originalParent = original.parent!;
+          final duplicatedParent =
+              originalToDuplicate[originalParent] ?? originalParent;
+
+          final parentConnection = Connection(
+            startSpace: duplicatedParent,
+            endSpace: duplicated,
+            direction: original.incomingConnection?.direction ?? "down",
+          );
+
+          connections.add(parentConnection);
+          duplicated.incomingConnection = parentConnection;
+          duplicatedParent.addOutgoingConnection(parentConnection);
+        }
+      });
+
+      final childrenWithDownDirection = original.children
+          .where((child) =>
+              child.incomingConnection?.direction == "down" &&
+              child.status != SpaceStatus.deleted)
+          .toList();
+
+      Offset childStartPosition = childrenWithDownDirection.length == 1
+          ? duplicated.position
+          : newPosition + Offset(0, verticalGap);
+
+      for (final child in original.children) {
+        final isDownDirection =
+            child.incomingConnection?.direction == "down" ?? false;
+
+        if (isDownDirection && childrenWithDownDirection.length == 1) {
+          // Place the only "down" child vertically aligned with the parent
+          childStartPosition = duplicated.position + Offset(0, verticalGap);
+        } else if (!isDownDirection) {
+          // Position children with other directions horizontally
+          childStartPosition = duplicated.position + Offset(horizontalGap, 0);
+        }
+
+        final duplicatedChild =
+            duplicateRecursive(child, childStartPosition, duplicated);
+        duplicated.children.add(duplicatedChild);
+        childStartPosition += Offset(0, verticalGap);
+      }
+
+      return duplicated;
+    }
+
+    if (space.parent == null) {
+      duplicateRecursive(space, space.position, null);
+    } else {
+      final duplicatedParent =
+          originalToDuplicate[space.parent!] ?? space.parent!;
+      duplicateRecursive(space, space.position, duplicatedParent);
+    }
+  }
+
+  List<String> _getAllTagValues(List<SpaceModel> spaces) {
+    final List<String> allTags = [];
+    for (final space in spaces) {
+      if (space.tags != null) {
+        allTags.addAll(space.listAllTagValues());
+      }
+    }
+    return allTags;
+  }
 }

lib/pages/spaces_management/all_spaces/widgets/dialogs/create_space_dialog.dart

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
+import 'package:syncrow_web/common/edit_chip.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/add_device_type/views/add_device_type_widget.dart';
@@ -9,16 +10,25 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/subspace_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/widgets/dialogs/icon_selection_dialog.dart';
+import 'package:syncrow_web/pages/spaces_management/assign_tag/views/assign_tag_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/create_subspace/views/create_subspace_model_dialog.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
 import 'package:syncrow_web/pages/spaces_management/link_space_model/view/link_space_model_dialog.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/button_content_widget.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/widgets/subspace_name_label_widget.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 import 'package:syncrow_web/utils/constants/assets.dart';
 import 'package:syncrow_web/utils/constants/space_icon_const.dart';
 
 class CreateSpaceDialog extends StatefulWidget {
-  final Function(String, String, List<SelectedProduct> selectedProducts,
+  final Function(
-      SpaceTemplateModel? spaceModel, List<SubspaceModel>? subspaces, List<Tag>? tags) onCreateSpace;
+      String,
+      String,
+      List<SelectedProduct> selectedProducts,
+      SpaceTemplateModel? spaceModel,
+      List<SubspaceModel>? subspaces,
+      List<Tag>? tags) onCreateSpace;
   final List<ProductModel>? products;
   final String? name;
   final String? icon;
@@ -29,6 +39,8 @@ class CreateSpaceDialog extends StatefulWidget {
   final List<SpaceTemplateModel>? spaceModels;
   final List<SubspaceModel>? subspaces;
   final List<Tag>? tags;
+  final List<String>? allTags;
+  final SpaceTemplateModel? currentSpaceModel;
 
   const CreateSpaceDialog(
       {super.key,
@@ -39,10 +51,12 @@ class CreateSpaceDialog extends StatefulWidget {
       this.icon,
       this.isEdit = false,
       this.editSpace,
+      this.allTags,
       this.selectedProducts = const [],
       this.spaceModels,
       this.subspaces,
-      this.tags});
+      this.tags,
+      this.currentSpaceModel});
 
   @override
   CreateSpaceDialogState createState() => CreateSpaceDialogState();
@@ -69,6 +83,9 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
         widget.selectedProducts.isNotEmpty ? widget.selectedProducts : [];
     isOkButtonEnabled =
         enteredName.isNotEmpty || nameController.text.isNotEmpty;
+    tags = widget.tags ?? [];
+    subspaces = widget.subspaces ?? [];
+    selectedSpaceModel = widget.currentSpaceModel;
   }
 
   @override
@@ -139,7 +156,9 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                 child: Column(
                   crossAxisAlignment: CrossAxisAlignment.start,
                   children: [
-                    TextField(
+                    SizedBox(
+                      width: screenWidth * 0.25,
+                      child: TextField(
                         controller: nameController,
                         onChanged: (value) {
                           enteredName = value.trim();
@@ -159,14 +178,13 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                             }
                           });
                         },
-                      style: const TextStyle(color: Colors.black),
+                        style: Theme.of(context).textTheme.bodyMedium,
                         decoration: InputDecoration(
                           hintText: 'Please enter the name',
-                        hintStyle: const TextStyle(
+                          hintStyle: Theme.of(context)
-                          fontSize: 14,
+                              .textTheme
-                          color: ColorsManager.lightGrayColor,
+                              .bodyMedium!
-                          fontWeight: FontWeight.w400,
+                              .copyWith(color: ColorsManager.lightGrayColor),
-                        ),
                           filled: true,
                           fillColor: ColorsManager.boxColor,
                           enabledBorder: OutlineInputBorder(
@@ -187,6 +205,7 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                           ),
                         ),
                       ),
+                    ),
                     if (isNameFieldInvalid)
                       Padding(
                         padding: const EdgeInsets.only(top: 8.0),
@@ -211,46 +230,20 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                       ),
                     const SizedBox(height: 10),
                     selectedSpaceModel == null
-                        ? DefaultButton(
+                        ? TextButton(
+                            style: TextButton.styleFrom(
+                              padding: EdgeInsets.zero,
+                            ),
                             onPressed: () {
                               _showLinkSpaceModelDialog(context);
                             },
-                            backgroundColor: ColorsManager.textFieldGreyColor,
+                            child: const ButtonContentWidget(
-                            foregroundColor: Colors.black,
+                              svgAssets: Assets.link,
-                            borderColor: ColorsManager.neutralGray,
+                              label: 'Link a space model',
-                            borderRadius: 16.0,
-                            padding: 10.0, // Reduced padding for smaller size
-                            child: Align(
-                              alignment: Alignment.centerLeft,
-                              child: Row(
-                                mainAxisSize: MainAxisSize.min,
-                                children: [
-                                  Padding(
-                                    padding: const EdgeInsets.only(left: 6.0),
-                                    child: SvgPicture.asset(
-                                      Assets.link,
-                                      width: screenWidth *
-                                          0.015, // Adjust icon size
-                                      height: screenWidth * 0.015,
-                                    ),
-                                  ),
-                                  const SizedBox(width: 3),
-                                  Flexible(
-                                    child: Text(
-                                      'Link a space model',
-                                      overflow: TextOverflow
-                                          .ellipsis, // Prevent overflow
-                                      style: Theme.of(context)
-                                          .textTheme
-                                          .bodyMedium,
-                                    ),
-                                  ),
-                                ],
-                              ),
                             ),
                           )
                         : Container(
-                            width: screenWidth * 0.35,
+                            width: screenWidth * 0.25,
                             padding: const EdgeInsets.symmetric(
                                 vertical: 10.0, horizontal: 16.0),
                             decoration: BoxDecoration(
@@ -264,7 +257,10 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                                 Chip(
                                     label: Text(
                                       selectedSpaceModel?.modelName ?? '',
-                                      style: const TextStyle(
+                                      style: Theme.of(context)
+                                          .textTheme
+                                          .bodyMedium!
+                                          .copyWith(
                                               color: ColorsManager.spaceColor),
                                     ),
                                     backgroundColor: ColorsManager.whiteColors,
@@ -298,25 +294,25 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                             ),
                           ),
                     const SizedBox(height: 25),
-                    const Row(
+                    Row(
                       children: [
-                        Expanded(
+                        const Expanded(
                           child: Divider(
                             color: ColorsManager.neutralGray,
                             thickness: 1.0,
                           ),
                         ),
                         Padding(
-                          padding: EdgeInsets.symmetric(horizontal: 8.0),
+                          padding: const EdgeInsets.symmetric(horizontal: 6.0),
                           child: Text(
                             'OR',
-                            style: TextStyle(
+                            style: Theme.of(context)
-                              color: Colors.black,
+                                .textTheme
-                              fontWeight: FontWeight.bold,
+                                .bodyMedium
+                                ?.copyWith(fontWeight: FontWeight.bold),
                           ),
                         ),
-                        ),
+                        const Expanded(
-                        Expanded(
                           child: Divider(
                             color: ColorsManager.neutralGray,
                             thickness: 1.0,
@@ -325,48 +321,23 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                       ],
                     ),
                     const SizedBox(height: 25),
-                    subspaces == null
+                    subspaces == null || subspaces!.isEmpty
-                        ? DefaultButton(
+                        ? TextButton(
-                            onPressed: () {
+                            style: TextButton.styleFrom(
+                              padding: EdgeInsets.zero,
+                              overlayColor: ColorsManager.transparentColor,
+                            ),
+                            onPressed: () async {
                               _showSubSpaceDialog(context, enteredName, [],
                                   false, widget.products, subspaces);
                             },
-                            backgroundColor: ColorsManager.textFieldGreyColor,
+                            child: const ButtonContentWidget(
-                            foregroundColor: Colors.black,
+                              icon: Icons.add,
-                            borderColor: ColorsManager.neutralGray,
+                              label: 'Create Sub Space',
-                            borderRadius: 16.0,
-                            padding: 10.0, // Reduced padding for smaller size
-                            child: Align(
-                              alignment: Alignment.centerLeft,
-                              child: Row(
-                                mainAxisSize: MainAxisSize.min,
-                                children: [
-                                  Padding(
-                                    padding: const EdgeInsets.only(left: 6.0),
-                                    child: SvgPicture.asset(
-                                      Assets.addIcon,
-                                      width: screenWidth *
-                                          0.015, // Adjust icon size
-                                      height: screenWidth * 0.015,
-                                    ),
-                                  ),
-                                  const SizedBox(width: 3),
-                                  Flexible(
-                                    child: Text(
-                                      'Create sub space',
-                                      overflow: TextOverflow
-                                          .ellipsis, // Prevent overflow
-                                      style: Theme.of(context)
-                                          .textTheme
-                                          .bodyMedium,
-                                    ),
-                                  ),
-                                ],
-                              ),
                             ),
                           )
                         : SizedBox(
-                            width: screenWidth * 0.35,
+                            width: screenWidth * 0.25,
                             child: Container(
                               padding: const EdgeInsets.all(8.0),
                               decoration: BoxDecoration(
@@ -382,51 +353,47 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                                 runSpacing: 8.0,
                                 children: [
                                   if (subspaces != null)
-                                    ...subspaces!.map(
+                                    ...subspaces!.map((subspace) {
-                                      (subspace) => Chip(
+                                      return Column(
-                                        label: Text(
+                                        crossAxisAlignment:
-                                          subspace.subspaceName,
+                                            CrossAxisAlignment.start,
-                                          style: const TextStyle(
+                                        children: [
-                                              color: ColorsManager
+                                          SubspaceNameDisplayWidget(
-                                                  .spaceColor), // Text color
+                                            text: subspace.subspaceName,
-                                        ),
+                                            validateName: (updatedName) {
-                                        backgroundColor: ColorsManager
+                                              bool nameExists =
-                                            .whiteColors, // Chip background color
+                                                  subspaces!.any((s) {
-                                        shape: RoundedRectangleBorder(
+                                                bool isSameId = s.internalId ==
-                                          borderRadius: BorderRadius.circular(
+                                                    subspace.internalId;
-                                              16), // Rounded chip
+                                                bool isSameName = s.subspaceName
-                                          side: const BorderSide(
+                                                        .trim()
-                                              color: ColorsManager
+                                                        .toLowerCase() ==
-                                                  .spaceColor), // Border color
+                                                    updatedName
-                                        ),
+                                                        .trim()
-                                      ),
+                                                        .toLowerCase();
-                                    ),
+
-                                  GestureDetector(
+                                                return !isSameId && isSameName;
-                                    onTap: () async {
+                                              });
-                                      _showSubSpaceDialog(
+
-                                          context,
+                                              return !nameExists;
-                                          enteredName,
+                                            },
-                                          [],
+                                            onNameChanged: (updatedName) {
-                                          false,
+                                              setState(() {
-                                          widget.products,
+                                                subspace.subspaceName =
-                                          subspaces);
+                                                    updatedName;
+                                              });
                                             },
-                                    child: Chip(
-                                      label: const Text(
-                                        'Edit',
-                                        style: TextStyle(
-                                            color: ColorsManager.spaceColor),
-                                      ),
-                                      backgroundColor:
-                                          ColorsManager.whiteColors,
-                                      shape: RoundedRectangleBorder(
-                                        borderRadius: BorderRadius.circular(16),
-                                        side: const BorderSide(
-                                            color: ColorsManager.spaceColor),
-                                      ),
-                                    ),
                                           ),
                                         ],
+                                      );
+                                    }),
+                                  EditChip(
+                                    onTap: () async {
+                                      _showSubSpaceDialog(context, enteredName,
+                                          [], true, widget.products, subspaces);
+                                    },
+                                  )
+                                ],
                               ),
                             ),
                           ),
@@ -452,7 +419,7 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                                 runSpacing: 8.0,
                                 children: [
                                   // Combine tags from spaceModel and subspaces
-                                  ..._groupTags([
+                                  ...TagHelper.groupTags([
                                     ...?tags,
                                     ...?subspaces?.expand(
                                         (subspace) => subspace.tags ?? [])
@@ -469,9 +436,12 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                                           ),
                                           label: Text(
                                             'x${entry.value}', // Show count
-                                            style: const TextStyle(
+                                            style: Theme.of(context)
-                                              color: ColorsManager.spaceColor,
+                                                .textTheme
-                                            ),
+                                                .bodySmall
+                                                ?.copyWith(
+                                                    color: ColorsManager
+                                                        .spaceColor),
                                           ),
                                           backgroundColor:
                                               ColorsManager.whiteColors,
@@ -484,70 +454,52 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                                           ),
                                         ),
                                       ),
-                                  GestureDetector(
+
-                                    onTap: () async {
+                                  EditChip(onTap: () async {
-                                      _showTagCreateDialog(context, enteredName,
+                                    final result = await showDialog(
-                                          widget.products);
+                                      context: context,
-                                      // Edit action
+                                      builder: (context) => AssignTagDialog(
+                                        products: widget.products,
+                                        subspaces: subspaces,
+                                        addedProducts: TagHelper
+                                            .createInitialSelectedProductsForTags(
+                                                tags ?? [], subspaces),
+                                        title: 'Edit Device',
+                                        initialTags:
+                                            TagHelper.generateInitialForTags(
+                                                spaceTags: tags,
+                                                subspaces: subspaces),
+                                        spaceName: widget.name ?? '',
+                                        onSave:
+                                            (updatedTags, updatedSubspaces) {
+                                          setState(() {
+                                            tags = updatedTags;
+                                            subspaces = updatedSubspaces;
+                                          });
                                         },
-                                    child: Chip(
-                                      label: const Text(
-                                        'Edit',
-                                        style: TextStyle(
-                                            color: ColorsManager.spaceColor),
-                                      ),
-                                      backgroundColor:
-                                          ColorsManager.whiteColors,
-                                      shape: RoundedRectangleBorder(
-                                        borderRadius: BorderRadius.circular(16),
-                                        side: const BorderSide(
-                                            color: ColorsManager.spaceColor),
-                                      ),
-                                    ),
                                       ),
+                                    );
+                                  })
                                 ],
                               ),
                             ),
                           )
-                        : DefaultButton(
+                        : TextButton(
                             onPressed: () {
                               _showTagCreateDialog(
-                                  context, enteredName, widget.products);
+                                context,
+                                enteredName,
+                                widget.isEdit,
+                                widget.products,
+                              );
                             },
-                            backgroundColor: ColorsManager.textFieldGreyColor,
+                            style: TextButton.styleFrom(
-                            foregroundColor: Colors.black,
+                              padding: EdgeInsets.zero,
-                            borderColor: ColorsManager.neutralGray,
-                            borderRadius: 16.0,
-                            padding: 10.0, // Reduced padding for smaller size
-                            child: Align(
-                              alignment: Alignment.centerLeft,
-                              child: Row(
-                                mainAxisSize: MainAxisSize.min,
-                                children: [
-                                  Padding(
-                                    padding: const EdgeInsets.only(left: 6.0),
-                                    child: SvgPicture.asset(
-                                      Assets.addIcon,
-                                      width: screenWidth *
-                                          0.015, // Adjust icon size
-                                      height: screenWidth * 0.015,
                             ),
-                                  ),
+                            child: const ButtonContentWidget(
-                                  const SizedBox(width: 3),
+                              icon: Icons.add,
-                                  Flexible(
+                              label: 'Add Devices',
-                                    child: Text(
+                            ))
-                                      'Add devices',
-                                      overflow: TextOverflow
-                                          .ellipsis, // Prevent overflow
-                                      style: Theme.of(context)
-                                          .textTheme
-                                          .bodyMedium,
-                                    ),
-                                  ),
-                                ],
-                              ),
-                            ),
-                          )
                   ],
                 ),
               ),
@@ -579,8 +531,13 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                         ? enteredName
                         : (widget.name ?? '');
                     if (newName.isNotEmpty) {
-                      widget.onCreateSpace(newName, selectedIcon,
+                      widget.onCreateSpace(
-                          selectedProducts, selectedSpaceModel,subspaces,tags);
+                          newName,
+                          selectedIcon,
+                          selectedProducts,
+                          selectedSpaceModel,
+                          subspaces,
+                          tags);
                       Navigator.of(context).pop();
                     }
                   }
@@ -616,12 +573,23 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
   }
 
   bool _isNameConflict(String value) {
-    return (widget.parentSpace?.children.any((child) => child.name == value) ??
+    final parentSpace = widget.parentSpace;
-            false) ||
+    final editSpace = widget.editSpace;
-        (widget.parentSpace?.name == value) ||
+    final siblings = parentSpace?.children
-        (widget.editSpace?.parent?.name == value) ||
+            .where((child) => child.uuid != editSpace?.uuid)
-        (widget.editSpace?.children.any((child) => child.name == value) ??
+            .toList() ??
-            false);
+        [];
+    final siblingConflict = siblings.any((child) => child.name == value);
+    final parentConflict =
+        parentSpace?.name == value && parentSpace?.uuid != editSpace?.uuid;
+    final parentOfEditSpaceConflict = editSpace?.parent?.name == value &&
+        editSpace?.parent?.uuid != editSpace?.uuid;
+    final childConflict =
+        editSpace?.children.any((child) => child.name == value) ?? false;
+    return siblingConflict ||
+        parentConflict ||
+        parentOfEditSpaceConflict ||
+        childConflict;
   }
 
   void _showLinkSpaceModelDialog(BuildContext context) {
@@ -635,6 +603,7 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
               setState(() {
                 selectedSpaceModel = selectedModel;
                 subspaces = null;
+                tags = null;
               });
             }
           },
@@ -655,15 +624,32 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
       builder: (BuildContext context) {
         return CreateSubSpaceDialog(
             spaceName: name,
-            dialogTitle: 'Create Sub-space',
+            dialogTitle: isEdit ? 'Edit Sub-space' : 'Create Sub-space',
             spaceTags: spaceTags,
             isEdit: isEdit,
             products: products,
             existingSubSpaces: existingSubSpaces,
             onSave: (slectedSubspaces) {
+              final List<Tag> tagsToAppendToSpace = [];
+
+              if (slectedSubspaces != null) {
+                final updatedIds =
+                    slectedSubspaces.map((s) => s.internalId).toSet();
+                if (existingSubSpaces != null) {
+                  final deletedSubspaces = existingSubSpaces
+                      .where((s) => !updatedIds.contains(s.internalId))
+                      .toList();
+                  for (var s in deletedSubspaces) {
+                    if (s.tags != null) {
+                      tagsToAppendToSpace.addAll(s.tags!);
+                    }
+                  }
+                }
+              }
               if (slectedSubspaces != null) {
                 setState(() {
                   subspaces = slectedSubspaces;
+                  tags?.addAll(tagsToAppendToSpace);
                   selectedSpaceModel = null;
                 });
               }
@@ -672,9 +658,43 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
     );
   }
 
-  void _showTagCreateDialog(
+  void _showTagCreateDialog(BuildContext context, String name, bool isEdit,
-      BuildContext context, String name, List<ProductModel>? products) {
+      List<ProductModel>? products) {
-    showDialog(
+    isEdit
+        ? showDialog(
+            context: context,
+            builder: (BuildContext context) {
+              return AssignTagDialog(
+                title: 'Edit Device',
+                addedProducts: TagHelper.createInitialSelectedProductsForTags(
+                    tags, subspaces),
+                spaceName: name,
+                products: products,
+                subspaces: subspaces,
+                allTags: widget.allTags,
+                onSave: (selectedSpaceTags, selectedSubspaces) {
+                  setState(() {
+                    tags = selectedSpaceTags;
+                    selectedSpaceModel = null;
+
+                    if (selectedSubspaces != null) {
+                      if (subspaces != null) {
+                        for (final subspace in subspaces!) {
+                          for (final selectedSubspace in selectedSubspaces) {
+                            if (subspace.subspaceName ==
+                                selectedSubspace.subspaceName) {
+                              subspace.tags = selectedSubspace.tags;
+                            }
+                          }
+                        }
+                      }
+                    }
+                  });
+                },
+              );
+            },
+          )
+        : showDialog(
             context: context,
             builder: (BuildContext context) {
               return AddDeviceTypeWidget(
@@ -682,9 +702,11 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
                 products: products,
                 subspaces: subspaces,
                 spaceTags: tags,
-          allTags: [],
+                isCreate: true,
+                allTags: widget.allTags,
                 initialSelectedProducts:
-              createInitialSelectedProducts(tags, subspaces),
+                    TagHelper.createInitialSelectedProductsForTags(
+                        tags, subspaces),
                 onSave: (selectedSpaceTags, selectedSubspaces) {
                   setState(() {
                     tags = selectedSpaceTags;
@@ -708,49 +730,4 @@ class CreateSpaceDialogState extends State<CreateSpaceDialog> {
             },
           );
   }
-
-  List<SelectedProduct> createInitialSelectedProducts(
-      List<Tag>? tags, List<SubspaceModel>? subspaces) {
-    final Map<ProductModel, int> productCounts = {};
-
-    if (tags != null) {
-      for (var tag in tags) {
-        if (tag.product != null) {
-          productCounts[tag.product!] = (productCounts[tag.product!] ?? 0) + 1;
-        }
-      }
-    }
-
-    if (subspaces != null) {
-      for (var subspace in subspaces) {
-        if (subspace.tags != null) {
-          for (var tag in subspace.tags!) {
-            if (tag.product != null) {
-              productCounts[tag.product!] =
-                  (productCounts[tag.product!] ?? 0) + 1;
-            }
-          }
-        }
-      }
-    }
-
-    return productCounts.entries
-        .map((entry) => SelectedProduct(
-              productId: entry.key.uuid,
-              count: entry.value,
-              productName: entry.key.name ?? 'Unnamed',
-              product: entry.key,
-            ))
-        .toList();
-  }
-
-  Map<ProductModel, int> _groupTags(List<Tag> tags) {
-    final Map<ProductModel, int> groupedTags = {};
-    for (var tag in tags) {
-      if (tag.product != null) {
-        groupedTags[tag.product!] = (groupedTags[tag.product!] ?? 0) + 1;
-      }
-    }
-    return groupedTags;
-  }
 }

lib/pages/spaces_management/all_spaces/widgets/dialogs/duplicate_process_dialog.dart

@@ -0,0 +1,86 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+
+class DuplicateProcessDialog extends StatefulWidget {
+  final VoidCallback onDuplicate;
+
+  const DuplicateProcessDialog({required this.onDuplicate, Key? key})
+      : super(key: key);
+
+  @override
+  _DuplicateProcessDialogState createState() => _DuplicateProcessDialogState();
+}
+
+class _DuplicateProcessDialogState extends State<DuplicateProcessDialog> {
+  bool isDuplicating = true;
+
+  @override
+  void initState() {
+    super.initState();
+    _startDuplication();
+  }
+
+  void _startDuplication() async {
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      widget.onDuplicate();
+    });
+    await Future.delayed(const Duration(seconds: 2));
+    setState(() {
+      isDuplicating = false;
+    });
+
+    await Future.delayed(const Duration(seconds: 2));
+    if (mounted) {
+      Navigator.of(context).pop();
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final screenWidth = MediaQuery.of(context).size.width;
+
+    return AlertDialog(
+      backgroundColor: Colors.white,
+      shape: RoundedRectangleBorder(
+        borderRadius: BorderRadius.circular(20),
+      ),
+      content: SizedBox(
+        width: screenWidth * 0.4,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            if (isDuplicating) ...[
+              const CircularProgressIndicator(
+                color: ColorsManager.vividBlue,
+              ),
+              const SizedBox(height: 15),
+              Text(
+                "Duplicating in progress",
+                style: Theme.of(context)
+                    .textTheme
+                    .headlineSmall
+                    ?.copyWith(color: ColorsManager.primaryColor),
+                textAlign: TextAlign.center,
+              ),
+            ] else ...[
+              const Icon(
+                Icons.check_circle,
+                color: ColorsManager.vividBlue,
+                size: 50,
+              ),
+              const SizedBox(height: 15),
+              Text(
+                "Duplicating successful",
+                textAlign: TextAlign.center,
+                style: Theme.of(context)
+                    .textTheme
+                    .headlineSmall
+                    ?.copyWith(color: ColorsManager.primaryColor),
+              ),
+            ],
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/pages/spaces_management/all_spaces/widgets/loaded_space_widget.dart

@@ -11,7 +11,7 @@ import 'package:syncrow_web/pages/spaces_management/space_model/models/space_tem
 import 'package:syncrow_web/pages/spaces_management/space_model/view/space_model_page.dart';
 import 'package:syncrow_web/services/space_model_mang_api.dart';
 
-class LoadedSpaceView extends StatelessWidget {
+class LoadedSpaceView extends StatefulWidget {
   final List<CommunityModel> communities;
   final CommunityModel? selectedCommunity;
   final SpaceModel? selectedSpace;
@@ -26,41 +26,73 @@ class LoadedSpaceView extends StatelessWidget {
     this.selectedSpace,
     this.products,
     this.spaceModels,
-    required this.shouldNavigateToSpaceModelPage
+    required this.shouldNavigateToSpaceModelPage,
   });
 
   @override
-  Widget build(BuildContext context) {
+  _LoadedSpaceViewState createState() => _LoadedSpaceViewState();
+}
 
+class _LoadedSpaceViewState extends State<LoadedSpaceView> {
+  late List<SpaceTemplateModel> _spaceModels;
+
+  @override
+  void initState() {
+    super.initState();
+    _spaceModels = List.from(widget.spaceModels ?? []);
+  }
+
+  @override
+  void didUpdateWidget(covariant LoadedSpaceView oldWidget) {
+    super.didUpdateWidget(oldWidget);
+    if (widget.spaceModels != oldWidget.spaceModels) {
+      setState(() {
+        _spaceModels = List.from(widget.spaceModels ?? []);
+      });
+    }
+  }
+
+  void _onSpaceModelsUpdated(List<SpaceTemplateModel> updatedModels) {
+    if (mounted && updatedModels != _spaceModels) {
+      setState(() {
+        _spaceModels = updatedModels;
+      });
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
     return Stack(
       clipBehavior: Clip.none,
       children: [
         Row(
           children: [
             SidebarWidget(
-              communities: communities,
+              communities: widget.communities,
-              selectedSpaceUuid:
+              selectedSpaceUuid: widget.selectedSpace?.uuid ??
-                  selectedSpace?.uuid ?? selectedCommunity?.uuid ?? '',
+                  widget.selectedCommunity?.uuid ??
+                  '',
             ),
-            shouldNavigateToSpaceModelPage
+            widget.shouldNavigateToSpaceModelPage
                 ? Expanded(
                     child: BlocProvider(
                       create: (context) => SpaceModelBloc(
                         api: SpaceModelManagementApi(),
-                        initialSpaceModels: spaceModels ?? [],
+                        initialSpaceModels: _spaceModels,
                       ),
                       child: SpaceModelPage(
-                        products: products,
+                        products: widget.products,
+                        onSpaceModelsUpdated: _onSpaceModelsUpdated,
                       ),
                     ),
                   )
                 : CommunityStructureArea(
-                    selectedCommunity: selectedCommunity,
+                    selectedCommunity: widget.selectedCommunity,
-                    selectedSpace: selectedSpace,
+                    selectedSpace: widget.selectedSpace,
-                    spaces: selectedCommunity?.spaces ?? [],
+                    spaces: widget.selectedCommunity?.spaces ?? [],
-                    products: products,
+                    products: widget.products,
-                    communities: communities,
+                    communities: widget.communities,
-                    spaceModels: spaceModels,
+                    spaceModels: _spaceModels,
                   ),
           ],
         ),
@@ -68,13 +100,4 @@ class LoadedSpaceView extends StatelessWidget {
       ],
     );
   }
-
-  SpaceModel? findSpaceByUuid(String? uuid, List<CommunityModel> communities) {
-    for (var community in communities) {
-      for (var space in community.spaces) {
-        if (space.uuid == uuid) return space;
-      }
-    }
-    return null;
-  }
 }

lib/pages/spaces_management/all_spaces/widgets/sidebar_widget.dart

@@ -199,9 +199,11 @@ class _SidebarWidgetState extends State<SidebarWidget> {
       },
       children: hasChildren
           ? community.spaces
+              .where((space) => (space.status != SpaceStatus.deleted ||
+                  space.status != SpaceStatus.parentDeleted))
               .map((space) => _buildSpaceTile(space, community))
               .toList()
-          : null, // Render spaces within the community
+          : null,
     );
   }
 

lib/pages/spaces_management/all_spaces/widgets/space_widget.dart

@@ -20,8 +20,7 @@ class SpaceWidget extends StatelessWidget {
       top: position.dy,
       child: GestureDetector(
         onTap: onTap,
-        child: 
+        child: Container(
-        Container(
           padding: const EdgeInsets.all(8.0),
           decoration: BoxDecoration(
             color: ColorsManager.whiteColors,
@@ -39,11 +38,10 @@ class SpaceWidget extends StatelessWidget {
             children: [
               const Icon(Icons.location_on, color: ColorsManager.spaceColor),
               const SizedBox(width: 8),
-              Text(name, style: const TextStyle(fontSize: 16)),
+              Text(name, style: Theme.of(context).textTheme.bodyMedium),
             ],
           ),
         ),
-    
       ),
     );
   }

lib/pages/spaces_management/assign_tag/bloc/assign_tag_bloc.dart

@@ -48,7 +48,7 @@ class AssignTagBloc extends Bloc<AssignTagEvent, AssignTagState> {
       emit(AssignTagLoaded(
           tags: allTags,
           isSaveEnabled: _validateTags(allTags),
-      ));
+          errorMessage: ''));
     });
 
     on<UpdateTagEvent>((event, emit) {
@@ -117,12 +117,10 @@ class AssignTagBloc extends Bloc<AssignTagEvent, AssignTagState> {
   }
 
   bool _validateTags(List<Tag> tags) {
-    if (tags.isEmpty) {
-      return false;
-    }
     final uniqueTags = tags.map((tag) => tag.tag?.trim() ?? '').toSet();
     final hasEmptyTag = tags.any((tag) => (tag.tag?.trim() ?? '').isEmpty);
-    return uniqueTags.length == tags.length && !hasEmptyTag;
+    final isValid = uniqueTags.length == tags.length && !hasEmptyTag;
+    return isValid;
   }
 
   String? _getValidationError(List<Tag> tags) {

lib/pages/spaces_management/assign_tag/views/assign_tag_dialog.dart

@@ -1,7 +1,10 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:syncrow_web/common/dialog_dropdown.dart';
+import 'package:syncrow_web/common/dialog_textfield_dropdown.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/add_device_type/views/add_device_type_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/subspace_model.dart';
@@ -9,6 +12,7 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag/bloc/assign_tag_bloc.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag/bloc/assign_tag_event.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag/bloc/assign_tag_state.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 
 class AssignTagDialog extends StatelessWidget {
@@ -37,8 +41,11 @@ class AssignTagDialog extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    final List<String> locations =
+    final List<String> locations = (subspaces ?? [])
-        (subspaces ?? []).map((subspace) => subspace.subspaceName).toList();
+        .map((subspace) => subspace.subspaceName)
+        .toList()
+      ..add('Main Space');
+
     return BlocProvider(
       create: (_) => AssignTagBloc()
         ..add(InitializeTags(
@@ -79,6 +86,7 @@ class AssignTagDialog extends StatelessWidget {
                                   style:
                                       Theme.of(context).textTheme.bodyMedium)),
                           DataColumn(
+                              numeric: false,
                               label: Text('Tag',
                                   style:
                                       Theme.of(context).textTheme.bodyMedium)),
@@ -89,30 +97,32 @@ class AssignTagDialog extends StatelessWidget {
                         ],
                         rows: state.tags.isEmpty
                             ? [
-                                const DataRow(cells: [
+                                DataRow(cells: [
                                   DataCell(
                                     Center(
-                                      child: Text(
+                                      child: Text('No Data Available',
-                                        'No Data Available',
+                                          style: Theme.of(context)
-                                        style: TextStyle(
+                                              .textTheme
-                                          fontSize: 14,
+                                              .bodyMedium
-                                          color: ColorsManager.lightGrayColor,
+                                              ?.copyWith(
+                                                color: ColorsManager
+                                                    .lightGrayColor,
+                                              )),
                                     ),
                                   ),
-                                    ),
+                                  const DataCell(SizedBox()),
-                                  ),
+                                  const DataCell(SizedBox()),
-                                  DataCell(SizedBox()),
+                                  const DataCell(SizedBox()),
-                                  DataCell(SizedBox()),
-                                  DataCell(SizedBox()),
                                 ])
                               ]
                             : List.generate(state.tags.length, (index) {
                                 final tag = state.tags[index];
                                 final controller = controllers[index];
-
+                                final availableTags = getAvailableTags(
+                                    allTags ?? [], state.tags, tag);
                                 return DataRow(
                                   cells: [
-                                    DataCell(Text(index.toString())),
+                                    DataCell(Text((index + 1).toString())),
                                     DataCell(
                                       Row(
                                         mainAxisAlignment:
@@ -123,28 +133,53 @@ class AssignTagDialog extends StatelessWidget {
                                             tag.product?.name ?? 'Unknown',
                                             overflow: TextOverflow.ellipsis,
                                           )),
-                                          IconButton(
+                                          const SizedBox(width: 10),
-                                            icon: const Icon(Icons.close,
+                                          Container(
-                                                color: ColorsManager.warningRed,
+                                            width: 20.0,
-                                                size: 16),
+                                            height: 20.0,
+                                            decoration: BoxDecoration(
+                                              shape: BoxShape.circle,
+                                              border: Border.all(
+                                                color: ColorsManager
+                                                    .lightGrayColor,
+                                                width: 1.0,
+                                              ),
+                                            ),
+                                            child: IconButton(
+                                              icon: const Icon(
+                                                Icons.close,
+                                                color: ColorsManager
+                                                    .lightGreyColor,
+                                                size: 16,
+                                              ),
                                               onPressed: () {
-                                              context.read<AssignTagBloc>().add(
+                                                context
-                                                  DeleteTag(
+                                                    .read<AssignTagBloc>()
+                                                    .add(DeleteTag(
                                                         tagToDelete: tag,
                                                         tags: state.tags));
                                               },
                                               tooltip: 'Delete Tag',
-                                          )
+                                              padding: EdgeInsets.zero,
+                                              constraints:
+                                                  const BoxConstraints(),
+                                            ),
+                                          ),
                                         ],
                                       ),
                                     ),
                                     DataCell(
-                                      Row(
+                                      Container(
-                                        children: [
+                                        alignment: Alignment
-                                          Expanded(
+                                            .centerLeft, // Align cell content to the left
-                                            child: TextFormField(
+                                        child: SizedBox(
-                                              controller: controller,
+                                          width: double
-                                              onChanged: (value) {
+                                              .infinity, // Ensure full width for dropdown
+                                          child: DialogTextfieldDropdown(
+                                            items: availableTags,
+                                            initialValue: tag.tag,
+                                            onSelected: (value) {
+                                              controller.text = value;
                                               context
                                                   .read<AssignTagBloc>()
                                                   .add(UpdateTagEvent(
@@ -152,118 +187,26 @@ class AssignTagDialog extends StatelessWidget {
                                                     tag: value.trim(),
                                                   ));
                                             },
-                                              decoration: const InputDecoration(
-                                                hintText: 'Enter Tag',
-                                                border: InputBorder.none,
-                                              ),
-                                              style: const TextStyle(
-                                                fontSize: 14,
-                                                color: ColorsManager.blackColor,
                                           ),
                                         ),
                                       ),
-                                          SizedBox(
-                                            width: MediaQuery.of(context)
-                                                    .size
-                                                    .width *
-                                                0.15,
-                                            child: PopupMenuButton<String>(
-                                              color: ColorsManager.whiteColors,
-                                              icon: const Icon(
-                                                  Icons.arrow_drop_down,
-                                                  color:
-                                                      ColorsManager.blackColor),
-                                              onSelected: (value) {
-                                                controller.text = value;
-                                                context
-                                                    .read<AssignTagBloc>()
-                                                    .add(UpdateTagEvent(
-                                                      index: index,
-                                                      tag: value,
-                                                    ));
-                                              },
-                                              itemBuilder: (context) {
-                                                return (allTags ?? [])
-                                                    .where((tagValue) => !state
-                                                        .tags
-                                                        .map((e) => e.tag)
-                                                        .contains(tagValue))
-                                                    .map((tagValue) {
-                                                  return PopupMenuItem<String>(
-                                                      textStyle: const TextStyle(
-                                                          color: ColorsManager
-                                                              .textPrimaryColor),
-                                                      value: tagValue,
-                                                      child: ConstrainedBox(
-                                                        constraints:
-                                                            BoxConstraints(
-                                                          minWidth: MediaQuery.of(
-                                                                      context)
-                                                                  .size
-                                                                  .width *
-                                                              0.15,
-                                                          maxWidth: MediaQuery.of(
-                                                                      context)
-                                                                  .size
-                                                                  .width *
-                                                              0.15,
-                                                        ),
-                                                        child: Text(
-                                                          tagValue,
-                                                          overflow: TextOverflow
-                                                              .ellipsis,
-                                                        ),
-                                                      ));
-                                                }).toList();
-                                              },
-                                            ),
-                                          ),
-                                        ],
-                                      ),
                                     ),
                                     DataCell(
-                                      DropdownButtonHideUnderline(
+                                      SizedBox(
-                                        child: DropdownButton<String>(
+                                          width: double.infinity,
-                                          value: tag.location ?? 'Main',
+                                          child: DialogDropdown(
-                                          dropdownColor: ColorsManager
+                                            items: locations,
-                                              .whiteColors, // Dropdown background
+                                            selectedValue:
-                                          style: const TextStyle(
+                                                tag.location ?? 'Main Space',
-                                              color: Colors
+                                            onSelected: (value) {
-                                                  .black), // Style for selected text
-                                          items: [
-                                            const DropdownMenuItem<String>(
-                                              value: 'Main Space',
-                                              child: Text(
-                                                'Main Space',
-                                                style: TextStyle(
-                                                    color: ColorsManager
-                                                        .textPrimaryColor),
-                                              ),
-                                            ),
-                                            ...locations.map((location) {
-                                              return DropdownMenuItem<String>(
-                                                value: location,
-                                                child: Text(
-                                                  location,
-                                                  style: const TextStyle(
-                                                      color: ColorsManager
-                                                          .textPrimaryColor),
-                                                ),
-                                              );
-                                            }).toList(),
-                                          ],
-                                          onChanged: (value) {
-                                            if (value != null) {
                                               context
                                                   .read<AssignTagBloc>()
                                                   .add(UpdateLocation(
                                                     index: index,
                                                     location: value,
                                                   ));
-                                            }
                                             },
-                                        ),
+                                          )),
-                                      ),
                                     ),
                                   ],
                                 );
@@ -271,10 +214,11 @@ class AssignTagDialog extends StatelessWidget {
                       ),
                     ),
                     if (state.errorMessage != null)
-                      Text(
+                      Text(state.errorMessage!,
-                        state.errorMessage!,
+                          style: Theme.of(context)
-                        style: const TextStyle(color: ColorsManager.warningRed),
+                              .textTheme
-                      ),
+                              .bodySmall
+                              ?.copyWith(color: ColorsManager.warningRed)),
                   ],
                 ),
               ),
@@ -284,13 +228,39 @@ class AssignTagDialog extends StatelessWidget {
                   children: [
                     const SizedBox(width: 10),
                     Expanded(
-                      child: CancelButton(
+                      child: Builder(
-                        label: 'Cancel',
+                        builder: (buttonContext) => CancelButton(
+                          label: 'Add New Device',
                           onPressed: () async {
+                            final updatedTags = List<Tag>.from(state.tags);
+                            final result =
+                                TagHelper.processTags(updatedTags, subspaces);
+
+                            final processedTags =
+                                result['updatedTags'] as List<Tag>;
+                            final processedSubspaces = List<SubspaceModel>.from(
+                                result['subspaces'] as List<dynamic>);
+
                             Navigator.of(context).pop();
+
+                            await showDialog(
+                              context: context,
+                              builder: (context) => AddDeviceTypeWidget(
+                                products: products,
+                                subspaces: processedSubspaces,
+                                initialSelectedProducts: TagHelper
+                                    .createInitialSelectedProductsForTags(
+                                        processedTags, processedSubspaces),
+                                spaceName: spaceName,
+                                spaceTags: processedTags,
+                                isCreate: false,
+                                onSave: onSave,
+                              ),
+                            );
                           },
                         ),
                       ),
+                    ),
                     const SizedBox(width: 10),
                     Expanded(
                       child: DefaultButton(
@@ -301,23 +271,17 @@ class AssignTagDialog extends StatelessWidget {
                         foregroundColor: ColorsManager.whiteColors,
                         onPressed: state.isSaveEnabled
                             ? () async {
+                                final updatedTags = List<Tag>.from(state.tags);
+                                final result = TagHelper.processTags(
+                                    updatedTags, subspaces);
+
+                                final processedTags =
+                                    result['updatedTags'] as List<Tag>;
+                                final processedSubspaces =
+                                    List<SubspaceModel>.from(
+                                        result['subspaces'] as List<dynamic>);
+                                onSave?.call(processedTags, processedSubspaces);
                                 Navigator.of(context).pop();
-                                final assignedTags = <Tag>{};
-                                for (var tag in state.tags) {
-                                  if (tag.location == null ||
-                                      subspaces == null) {
-                                    continue;
-                                  }
-                                  for (var subspace in subspaces!) {
-                                    if (tag.location == subspace.subspaceName) {
-                                      subspace.tags ??= [];
-                                      subspace.tags!.add(tag);
-                                      assignedTags.add(tag);
-                                      break;
-                                    }
-                                  }
-                                }
-                                onSave!(state.tags,subspaces);
                               }
                             : null,
                         child: const Text('Save'),
@@ -337,4 +301,15 @@ class AssignTagDialog extends StatelessWidget {
       ),
     );
   }
+
+  List<String> getAvailableTags(
+      List<String> allTags, List<Tag> currentTags, Tag currentTag) {
+    List<String> availableTagsForTagModel = TagHelper.getAvailableTags<Tag>(
+      allTags: allTags,
+      currentTags: currentTags,
+      currentTag: currentTag,
+      getTag: (tag) => tag.tag ?? '',
+    );
+    return availableTagsForTagModel;
+  }
 }

lib/pages/spaces_management/assign_tag_models/views/assign_tag_models_dialog.dart

@@ -15,6 +15,7 @@ import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_model
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/dialog/create_space_model_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/tag_model/views/add_device_type_model_widget.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
 
 class AssignTagModelsDialog extends StatelessWidget {
   final List<ProductModel>? products;
@@ -29,6 +30,7 @@ class AssignTagModelsDialog extends StatelessWidget {
   final String title;
   final BuildContext? pageContext;
   final List<String>? otherSpaceModels;
+  final List<SpaceTemplateModel>? allSpaceModels;
 
   const AssignTagModelsDialog(
       {Key? key,
@@ -42,7 +44,8 @@ class AssignTagModelsDialog extends StatelessWidget {
       required this.title,
       this.pageContext,
       this.otherSpaceModels,
-      this.spaceModel})
+      this.spaceModel,
+      this.allSpaceModels})
       : super(key: key);
 
   @override
@@ -97,7 +100,6 @@ class AssignTagModelsDialog extends StatelessWidget {
                                           .bodyMedium)),
                               DataColumn(
                                   numeric: false,
-                                  headingRowAlignment: MainAxisAlignment.start,
                                   label: Text('Tag',
                                       style: Theme.of(context)
                                           .textTheme
@@ -110,28 +112,29 @@ class AssignTagModelsDialog extends StatelessWidget {
                             ],
                             rows: state.tags.isEmpty
                                 ? [
-                                    const DataRow(cells: [
+                                    DataRow(cells: [
                                       DataCell(
                                         Center(
-                                          child: Text(
+                                          child: Text('No Devices Available',
-                                            'No Data Available',
+                                              style: Theme.of(context)
-                                            style: TextStyle(
+                                                  .textTheme
-                                              fontSize: 14,
+                                                  .bodyMedium
-                                              color:
+                                                  ?.copyWith(
-                                                  ColorsManager.lightGrayColor,
+                                                    color: ColorsManager
+                                                        .lightGrayColor,
+                                                  )),
                                         ),
                                       ),
-                                        ),
+                                      const DataCell(SizedBox()),
-                                      ),
+                                      const DataCell(SizedBox()),
-                                      DataCell(SizedBox()),
+                                      const DataCell(SizedBox()),
-                                      DataCell(SizedBox()),
-                                      DataCell(SizedBox()),
                                     ])
                                   ]
                                 : List.generate(state.tags.length, (index) {
                                     final tag = state.tags[index];
                                     final controller = controllers[index];
-                                    final availableTags = getAvailableTags(
+                                    final availableTags =
+                                        TagHelper.getAvailableTagModels(
                                             allTags ?? [], state.tags, tag);
 
                                     return DataRow(
@@ -212,8 +215,8 @@ class AssignTagModelsDialog extends StatelessWidget {
                                               width: double.infinity,
                                               child: DialogDropdown(
                                                 items: locations,
-                                                selectedValue:
+                                                selectedValue: tag.location ??
-                                                    tag.location ?? 'Main Space',
+                                                    'Main Space',
                                                 onSelected: (value) {
                                                   context
                                                       .read<
@@ -231,11 +234,11 @@ class AssignTagModelsDialog extends StatelessWidget {
                           ),
                         ),
                         if (state.errorMessage != null)
-                          Text(
+                          Text(state.errorMessage!,
-                            state.errorMessage!,
+                              style: Theme.of(context)
-                            style: const TextStyle(
+                                  .textTheme
-                                color: ColorsManager.warningRed),
+                                  .bodySmall
-                          ),
+                                  ?.copyWith(color: ColorsManager.warningRed)),
                       ],
                     ),
                   ),
@@ -249,33 +252,18 @@ class AssignTagModelsDialog extends StatelessWidget {
                             builder: (buttonContext) => CancelButton(
                               label: 'Add New Device',
                               onPressed: () async {
-                                for (var tag in state.tags) {
+                                final updatedTags =
-                                  if (tag.location == null ||
+                                    List<TagModel>.from(state.tags);
-                                      subspaces == null) {
+                                final result =
-                                    continue;
+                                    TagHelper.updateSubspaceTagModels(
-                                  }
+                                        updatedTags, subspaces);
 
-                                  final previousTagSubspace =
+                                final processedTags =
-                                      checkTagExistInSubspace(
+                                    result['updatedTags'] as List<TagModel>;
-                                          tag, subspaces ?? []);
+                                final processedSubspaces =
+                                    List<SubspaceTemplateModel>.from(
+                                        result['subspaces'] as List<dynamic>);
 
-                                  if (tag.location == 'Main Space') {
-                                    removeTagFromSubspace(
-                                        tag, previousTagSubspace);
-                                  } else if (tag.location !=
-                                      previousTagSubspace?.subspaceName) {
-                                    removeTagFromSubspace(
-                                        tag, previousTagSubspace);
-                                    moveToNewSubspace(tag, subspaces ?? []);
-                                    state.tags.removeWhere(
-                                        (t) => t.internalId == tag.internalId);
-                                  } else {
-                                    updateTagInSubspace(
-                                        tag, previousTagSubspace);
-                                    state.tags.removeWhere(
-                                        (t) => t.internalId == tag.internalId);
-                                  }
-                                }
                                 if (context.mounted) {
                                   Navigator.of(context).pop();
 
@@ -285,22 +273,25 @@ class AssignTagModelsDialog extends StatelessWidget {
                                     builder: (dialogContext) =>
                                         AddDeviceTypeModelWidget(
                                             products: products,
-                                            subspaces: subspaces,
+                                            subspaces: processedSubspaces,
                                             isCreate: false,
-                                            initialSelectedProducts:
+                                            initialSelectedProducts: TagHelper
-                                                addedProducts,
+                                                .createInitialSelectedProducts(
+                                                    processedTags,
+                                                    processedSubspaces),
                                             allTags: allTags,
                                             spaceName: spaceName,
                                             otherSpaceModels: otherSpaceModels,
-                                            spaceTagModels: state.tags,
+                                            spaceTagModels: processedTags,
                                             pageContext: pageContext,
                                             spaceModel: SpaceTemplateModel(
                                                 modelName: spaceName,
-                                                tags: state.tags,
+                                                tags: updatedTags,
                                                 uuid: spaceModel?.uuid,
                                                 internalId:
                                                     spaceModel?.internalId,
-                                                subspaceModels: subspaces)),
+                                                subspaceModels:
+                                                    processedSubspaces)),
                                   );
                                 }
                               },
@@ -317,33 +308,20 @@ class AssignTagModelsDialog extends StatelessWidget {
                             foregroundColor: ColorsManager.whiteColors,
                             onPressed: state.isSaveEnabled
                                 ? () async {
-                                    for (var tag in state.tags) {
+                                    final updatedTags =
-                                      if (tag.location == null ||
+                                        List<TagModel>.from(state.tags);
-                                          subspaces == null) {
-                                        continue;
-                                      }
 
-                                      final previousTagSubspace =
+                                    final result =
-                                          checkTagExistInSubspace(
+                                        TagHelper.updateSubspaceTagModels(
-                                              tag, subspaces ?? []);
+                                            updatedTags, subspaces);
+
+                                    final processedTags =
+                                        result['updatedTags'] as List<TagModel>;
+                                    final processedSubspaces =
+                                        List<SubspaceTemplateModel>.from(
+                                            result['subspaces']
+                                                as List<dynamic>);
 
-                                      if (tag.location == 'Main Space') {
-                                        removeTagFromSubspace(
-                                            tag, previousTagSubspace);
-                                      } else if (tag.location !=
-                                          previousTagSubspace?.subspaceName) {
-                                        removeTagFromSubspace(
-                                            tag, previousTagSubspace);
-                                        moveToNewSubspace(tag, subspaces ?? []);
-                                        state.tags.removeWhere((t) =>
-                                            t.internalId == tag.internalId);
-                                      } else {
-                                        updateTagInSubspace(
-                                            tag, previousTagSubspace);
-                                        state.tags.removeWhere((t) =>
-                                            t.internalId == tag.internalId);
-                                      }
-                                    }
                                     Navigator.of(context)
                                         .popUntil((route) => route.isFirst);
 
@@ -352,16 +330,18 @@ class AssignTagModelsDialog extends StatelessWidget {
                                       builder: (BuildContext dialogContext) {
                                         return CreateSpaceModelDialog(
                                           products: products,
+                                          allSpaceModels: allSpaceModels,
                                           allTags: allTags,
                                           pageContext: pageContext,
                                           otherSpaceModels: otherSpaceModels,
                                           spaceModel: SpaceTemplateModel(
                                               modelName: spaceName,
-                                              tags: state.tags,
+                                              tags: processedTags,
                                               uuid: spaceModel?.uuid,
                                               internalId:
                                                   spaceModel?.internalId,
-                                              subspaceModels: subspaces),
+                                              subspaceModels:
+                                                  processedSubspaces),
                                         );
                                       },
                                     );
@@ -384,50 +364,4 @@ class AssignTagModelsDialog extends StatelessWidget {
           ),
         ));
   }
-
-  List<String> getAvailableTags(
-      List<String> allTags, List<TagModel> currentTags, TagModel currentTag) {
-    return allTags
-        .where((tagValue) => !currentTags
-            .where((e) => e != currentTag) // Exclude the current row
-            .map((e) => e.tag)
-            .contains(tagValue))
-        .toList();
-  }
-
-  void removeTagFromSubspace(TagModel tag, SubspaceTemplateModel? subspace) {
-    subspace?.tags?.removeWhere((t) => t.internalId == tag.internalId);
-  }
-
-  SubspaceTemplateModel? checkTagExistInSubspace(
-      TagModel tag, List<SubspaceTemplateModel>? subspaces) {
-    if (subspaces == null) return null;
-    for (var subspace in subspaces) {
-      if (subspace.tags == null) return null;
-      for (var t in subspace.tags!) {
-        if (tag.internalId == t.internalId) return subspace;
-      }
-    }
-    return null;
-  }
-
-  void moveToNewSubspace(TagModel tag, List<SubspaceTemplateModel> subspaces) {
-    final targetSubspace = subspaces
-        .firstWhere((subspace) => subspace.subspaceName == tag.location);
-
-    targetSubspace.tags ??= [];
-    if (targetSubspace.tags?.any((t) => t.internalId == tag.internalId) !=
-        true) {
-      targetSubspace.tags?.add(tag);
-    }
-  }
-
-  void updateTagInSubspace(TagModel tag, SubspaceTemplateModel? subspace) {
-    final currentTag = subspace?.tags?.firstWhere(
-      (t) => t.internalId == tag.internalId,
-    );
-    if (currentTag != null) {
-      currentTag.tag = tag.tag;
-    }
-  }
 }

lib/pages/spaces_management/create_community/view/create_community_dialog.dart

@@ -77,9 +77,7 @@ class CreateCommunityDialog extends StatelessWidget {
                                 .read<CommunityDialogBloc>()
                                 .add(ValidateCommunityNameEvent(value));
                           },
-                          style: const TextStyle(
+                          style: Theme.of(context).textTheme.bodyMedium,
-                            color: ColorsManager.blackColor,
-                          ),
                           decoration: InputDecoration(
                             hintText: 'Please enter the community name',
                             filled: true,

lib/pages/spaces_management/create_subspace/bloc/subspace_bloc.dart

@@ -6,27 +6,43 @@ import 'subspace_event.dart';
 import 'subspace_state.dart';
 
 class SubSpaceBloc extends Bloc<SubSpaceEvent, SubSpaceState> {
-  SubSpaceBloc() : super(SubSpaceState([], [], '')) {
+  SubSpaceBloc() : super(SubSpaceState([], [], '', {})) {
     on<AddSubSpace>((event, emit) {
-      final existingNames =
+      final existingNames = state.subSpaces.map((e) => e.subspaceName).toSet();
-          state.subSpaces.map((e) => e.subspaceName).toSet();
 
       if (existingNames.contains(event.subSpace.subspaceName.toLowerCase())) {
+        final updatedDuplicates = Set<String>.from(state.duplicates)
+          ..add(event.subSpace.subspaceName.toLowerCase());
+        final updatedSubSpaces = List<SubspaceModel>.from(state.subSpaces)
+          ..add(event.subSpace);
         emit(SubSpaceState(
-          state.subSpaces,
+          updatedSubSpaces,
           state.updatedSubSpaceModels,
-          'Subspace name already exists.',
+          '*Duplicated sub-space name',
+          updatedDuplicates,
         ));
       } else {
+        // Add subspace if no duplicate exists
         final updatedSubSpaces = List<SubspaceModel>.from(state.subSpaces)
           ..add(event.subSpace);
 
+        if (state.duplicates.isNotEmpty) {
+          emit(SubSpaceState(
+            updatedSubSpaces,
+            state.updatedSubSpaceModels,
+            '*Duplicated sub-space name',
+            state.duplicates,
+          ));
+        } else {
           emit(SubSpaceState(
             updatedSubSpaces,
             state.updatedSubSpaceModels,
             '',
+            state.duplicates,
+// Clear error message
           ));
         }
+      }
     });
 
     // Handle RemoveSubSpace Event
@@ -45,13 +61,50 @@ class SubSpaceBloc extends Bloc<SubSpaceEvent, SubSpaceState> {
         ));
       }
 
+      final nameOccurrences = <String, int>{};
+      for (final subSpace in updatedSubSpaces) {
+        final lowerName = subSpace.subspaceName.toLowerCase();
+        nameOccurrences[lowerName] = (nameOccurrences[lowerName] ?? 0) + 1;
+      }
+
+      final updatedDuplicates = nameOccurrences.entries
+          .where((entry) => entry.value > 1)
+          .map((entry) => entry.key)
+          .toSet();
+      final errorMessage =
+          updatedDuplicates.isNotEmpty ? '*Duplicated sub-space name' : '';
+
       emit(SubSpaceState(
         updatedSubSpaces,
         updatedSubspaceModels,
-        '', // Clear error message
+        errorMessage,
+        updatedDuplicates,
       ));
     });
 
-    // Handle UpdateSubSpace Event
+    on<UpdateSubSpace>((event, emit) {
+      final updatedSubSpaces = state.subSpaces.map((subSpace) {
+        if (subSpace.uuid == event.updatedSubSpace.uuid) {
+          return event.updatedSubSpace;
+        }
+        return subSpace;
+      }).toList();
+
+      final updatedSubspaceModels = List<UpdateSubspaceModel>.from(
+        state.updatedSubSpaceModels,
+      );
+
+      updatedSubspaceModels.add(UpdateSubspaceModel(
+        action: Action.update,
+        uuid: event.updatedSubSpace.uuid!,
+      ));
+
+      emit(SubSpaceState(
+        updatedSubSpaces,
+        updatedSubspaceModels,
+        '',
+        state.duplicates,
+      ));
+    });
   }
 }

lib/pages/spaces_management/create_subspace/bloc/subspace_state.dart

@@ -4,23 +4,26 @@ class SubSpaceState {
   final List<SubspaceModel> subSpaces;
   final List<UpdateSubspaceModel> updatedSubSpaceModels;
   final String errorMessage;
+  final Set<String> duplicates;
 
   SubSpaceState(
     this.subSpaces,
     this.updatedSubSpaceModels,
     this.errorMessage,
+    this.duplicates,
   );
 
- 
   SubSpaceState copyWith({
     List<SubspaceModel>? subSpaces,
     List<UpdateSubspaceModel>? updatedSubSpaceModels,
     String? errorMessage,
+    Set<String>? duplicates,
   }) {
     return SubSpaceState(
       subSpaces ?? this.subSpaces,
       updatedSubSpaceModels ?? this.updatedSubSpaceModels,
       errorMessage ?? this.errorMessage,
+      duplicates ?? this.duplicates,
     );
   }
 }

lib/pages/spaces_management/create_subspace/views/create_subspace_model_dialog.dart

@@ -81,18 +81,41 @@ class CreateSubSpaceDialog extends StatelessWidget {
                             spacing: 8.0,
                             runSpacing: 8.0,
                             children: [
-                              ...state.subSpaces.map(
+                              ...state.subSpaces.asMap().entries.map(
-                                (subSpace) => Chip(
+                                (entry) {
-                                  label: Text(
+                                  final index = entry.key;
-                                    subSpace.subspaceName,
+                                  final subSpace = entry.value;
-                                    style: const TextStyle(
+
-                                        color: ColorsManager.spaceColor),
+                                  final lowerName =
-                                  ),
+                                      subSpace.subspaceName.toLowerCase();
+
+                                  final duplicateIndices = state.subSpaces
+                                      .asMap()
+                                      .entries
+                                      .where((e) =>
+                                          e.value.subspaceName.toLowerCase() ==
+                                          lowerName)
+                                      .map((e) => e.key)
+                                      .toList();
+                                  final isDuplicate =
+                                      duplicateIndices.length > 1 &&
+                                          duplicateIndices.indexOf(index) != 0;
+
+                                  return Chip(
+                                    label: Text(subSpace.subspaceName,
+                                        style: Theme.of(context)
+                                            .textTheme
+                                            .bodyMedium
+                                            ?.copyWith(
+                                                color:
+                                                    ColorsManager.spaceColor)),
                                     backgroundColor: ColorsManager.whiteColors,
                                     shape: RoundedRectangleBorder(
-                                    borderRadius: BorderRadius.circular(8),
+                                      borderRadius: BorderRadius.circular(10),
-                                    side: const BorderSide(
+                                      side: BorderSide(
-                                      color: ColorsManager.transparentColor,
+                                        color: isDuplicate
+                                            ? ColorsManager.red
+                                            : ColorsManager.transparentColor,
                                         width: 0,
                                       ),
                                     ),
@@ -115,7 +138,8 @@ class CreateSubSpaceDialog extends StatelessWidget {
                                     onDeleted: () => context
                                         .read<SubSpaceBloc>()
                                         .add(RemoveSubSpace(subSpace)),
-                                ),
+                                  );
+                                },
                               ),
                               SizedBox(
                                 width: 200,
@@ -126,9 +150,12 @@ class CreateSubSpaceDialog extends StatelessWidget {
                                         hintText: state.subSpaces.isEmpty
                                             ? 'Please enter the name'
                                             : null,
-                                    hintStyle: const TextStyle(
+                                        hintStyle: Theme.of(context)
-                                        color: ColorsManager.lightGrayColor),
+                                            .textTheme
-                                  ),
+                                            .bodySmall
+                                            ?.copyWith(
+                                                color: ColorsManager
+                                                    .lightGrayColor)),
                                     onSubmitted: (value) {
                                       if (value.trim().isNotEmpty) {
                                         context.read<SubSpaceBloc>().add(
@@ -138,23 +165,22 @@ class CreateSubSpaceDialog extends StatelessWidget {
                                         textController.clear();
                                       }
                                     },
-                                  style: const TextStyle(
+                                    style:
-                                      color: ColorsManager.blackColor),
+                                        Theme.of(context).textTheme.bodyMedium),
+                              ),
+                            ],
                           ),
                         ),
                         if (state.errorMessage.isNotEmpty)
                           Padding(
                             padding: const EdgeInsets.only(top: 8.0),
-                                  child: Text(
+                            child: Text(state.errorMessage,
-                                    state.errorMessage,
+                                style: Theme.of(context)
-                                    style: const TextStyle(
+                                    .textTheme
+                                    .bodySmall
+                                    ?.copyWith(
                                       color: ColorsManager.warningRed,
-                                      fontSize: 12,
+                                    )),
-                                    ),
-                                  ),
-                                ),
-                            ],
-                          ),
                           ),
                         const SizedBox(height: 16),
                         Row(
@@ -162,13 +188,17 @@ class CreateSubSpaceDialog extends StatelessWidget {
                             Expanded(
                               child: CancelButton(
                                 label: 'Cancel',
-                                onPressed: () async {},
+                                onPressed: () async {
+                                  Navigator.of(context).pop();
+                                },
                               ),
                             ),
                             const SizedBox(width: 10),
                             Expanded(
                               child: DefaultButton(
-                                onPressed: () async {
+                                onPressed: (state.errorMessage.isNotEmpty)
+                                    ? null
+                                    : () async {
                                         final subSpaces = context
                                             .read<SubSpaceBloc>()
                                             .state
@@ -178,7 +208,9 @@ class CreateSubSpaceDialog extends StatelessWidget {
                                       },
                                 backgroundColor: ColorsManager.secondaryColor,
                                 borderRadius: 10,
-                                foregroundColor: ColorsManager.whiteColors,
+                                foregroundColor: state.errorMessage.isNotEmpty
+                                    ? ColorsManager.whiteColorsWithOpacity
+                                    : ColorsManager.whiteColors,
                                 child: const Text('OK'),
                               ),
                             ),

lib/pages/spaces_management/create_subspace_model/bloc/subspace_model_bloc.dart

@@ -25,22 +25,30 @@ class SubSpaceModelBloc extends Bloc<SubSpaceModelEvent, SubSpaceModelState> {
           updatedDuplicates,
         ));
       } else {
-        // Add subspace if no duplicate exists
         final updatedSubSpaces =
             List<SubspaceTemplateModel>.from(state.subSpaces)
               ..add(event.subSpace);
 
+        if (state.duplicates.isNotEmpty) {
+          emit(SubSpaceModelState(
+            updatedSubSpaces,
+            state.updatedSubSpaceModels,
+            '*Duplicated sub-space name',
+            state.duplicates,
+          ));
+        } else {
           emit(SubSpaceModelState(
             updatedSubSpaces,
             state.updatedSubSpaceModels,
             '',
             state.duplicates,
-// Clear error message
           ));
         }
+      }
     });
 
     // Handle RemoveSubSpaceModel Event
+
     on<RemoveSubSpaceModel>((event, emit) {
       final updatedSubSpaces = List<SubspaceTemplateModel>.from(state.subSpaces)
         ..remove(event.subSpace);
@@ -48,16 +56,6 @@ class SubSpaceModelBloc extends Bloc<SubSpaceModelEvent, SubSpaceModelState> {
       final updatedSubspaceModels = List<UpdateSubspaceTemplateModel>.from(
         state.updatedSubSpaceModels,
       );
-      final nameOccurrences = <String, int>{};
-      for (final subSpace in updatedSubSpaces) {
-        final lowerName = subSpace.subspaceName.toLowerCase();
-        nameOccurrences[lowerName] = (nameOccurrences[lowerName] ?? 0) + 1;
-      }
-
-      final updatedDuplicates = nameOccurrences.entries
-          .where((entry) => entry.value > 1)
-          .map((entry) => entry.key)
-          .toSet();
 
       if (event.subSpace.uuid?.isNotEmpty ?? false) {
         updatedSubspaceModels.add(UpdateSubspaceTemplateModel(
@@ -66,12 +64,28 @@ class SubSpaceModelBloc extends Bloc<SubSpaceModelEvent, SubSpaceModelState> {
         ));
       }
 
+      // Count occurrences of sub-space names to identify duplicates
+      final nameOccurrences = <String, int>{};
+      for (final subSpace in updatedSubSpaces) {
+        final lowerName = subSpace.subspaceName.toLowerCase();
+        nameOccurrences[lowerName] = (nameOccurrences[lowerName] ?? 0) + 1;
+      }
+
+      // Identify duplicate names
+      final updatedDuplicates = nameOccurrences.entries
+          .where((entry) => entry.value > 1)
+          .map((entry) => entry.key)
+          .toSet();
+
+      // Determine the error message
+      final errorMessage =
+          updatedDuplicates.isNotEmpty ? '*Duplicated sub-space name' : '';
+
       emit(SubSpaceModelState(
         updatedSubSpaces,
         updatedSubspaceModels,
-        '',
+        errorMessage,
         updatedDuplicates,
-// Clear error message
       ));
     });
 

lib/pages/spaces_management/create_subspace_model/views/create_subspace_model_dialog.dart

@@ -94,12 +94,13 @@ class CreateSubSpaceModelDialog extends StatelessWidget {
                                           duplicateIndices.indexOf(index) != 0;
 
                                   return Chip(
-                                    label: Text(
+                                    label: Text(subSpace.subspaceName,
-                                      subSpace.subspaceName,
+                                        style: Theme.of(context)
-                                      style: const TextStyle(
+                                            .textTheme
+                                            .bodySmall
+                                            ?.copyWith(
                                               color: ColorsManager.spaceColor,
-                                      ),
+                                            )),
-                                    ),
                                     backgroundColor: ColorsManager.whiteColors,
                                     shape: RoundedRectangleBorder(
                                       borderRadius: BorderRadius.circular(10),
@@ -141,9 +142,12 @@ class CreateSubSpaceModelDialog extends StatelessWidget {
                                         hintText: state.subSpaces.isEmpty
                                             ? 'Please enter the name'
                                             : null,
-                                    hintStyle: const TextStyle(
+                                        hintStyle: Theme.of(context)
-                                        color: ColorsManager.lightGrayColor),
+                                            .textTheme
-                                  ),
+                                            .bodySmall!
+                                            .copyWith(
+                                                color: ColorsManager
+                                                    .lightGrayColor)),
                                     onSubmitted: (value) {
                                       if (value.trim().isNotEmpty) {
                                         context.read<SubSpaceModelBloc>().add(
@@ -154,9 +158,11 @@ class CreateSubSpaceModelDialog extends StatelessWidget {
                                         textController.clear();
                                       }
                                     },
-                                  style: const TextStyle(
+                                    style: Theme.of(context)
-                                      color: ColorsManager.blackColor),
+                                        .textTheme
-                                ),
+                                        .bodyMedium
+                                        ?.copyWith(
+                                            color: ColorsManager.blackColor)),
                               ),
                             ],
                           ),
@@ -164,13 +170,13 @@ class CreateSubSpaceModelDialog extends StatelessWidget {
                         if (state.errorMessage.isNotEmpty)
                           Padding(
                             padding: const EdgeInsets.only(bottom: 16.0),
-                            child: Text(
+                            child: Text(state.errorMessage,
-                              state.errorMessage,
+                                style: Theme.of(context)
-                              style: const TextStyle(
+                                    .textTheme
+                                    .bodySmall
+                                    ?.copyWith(
                                       color: ColorsManager.red,
-                                fontSize: 12,
+                                    )),
-                              ),
-                            ),
                           ),
                         const SizedBox(height: 16),
                         Row(

lib/pages/spaces_management/helper/space_helper.dart

@@ -0,0 +1,43 @@
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/community_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
+
+class SpaceHelper {
+  static SpaceModel? findSpaceByUuid(
+      String? uuid, List<CommunityModel> communities) {
+    for (var community in communities) {
+      for (var space in community.spaces) {
+        if (space.uuid == uuid) return space;
+      }
+    }
+    return null;
+  }
+
+  static SpaceModel? findSpaceByInternalId(
+      String? internalId, List<SpaceModel> spaces) {
+    if (internalId != null) {
+      for (var space in spaces) {
+        if (space.internalId == internalId) return space;
+      }
+    }
+
+    return null;
+  }
+
+  static String generateUniqueSpaceName(
+      String originalName, List<SpaceModel> spaces) {
+    final baseName = originalName.replaceAll(RegExp(r'\(\d+\)$'), '').trim();
+    int maxNumber = 0;
+
+    for (var space in spaces) {
+      final match = RegExp(r'^(.*?)\((\d+)\)$').firstMatch(space.name);
+      if (match != null && match.group(1)?.trim() == baseName) {
+        int existingNumber = int.parse(match.group(2)!);
+        if (existingNumber > maxNumber) {
+          maxNumber = existingNumber;
+        }
+      }
+    }
+
+    return "$baseName(${maxNumber + 1})";
+  }
+}

lib/pages/spaces_management/helper/tag_helper.dart

@@ -1,9 +1,144 @@
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/base_tag.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/subspace_model.dart';
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/tag.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/subspace_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_model.dart';
 
 class TagHelper {
+  static Map<String, dynamic> updateTags<T>({
+    required List<T> updatedTags,
+    required List<dynamic>? subspaces,
+    required String Function(T) getInternalId,
+    required String? Function(T) getLocation,
+    required void Function(T, String) setLocation,
+    required String Function(dynamic) getSubspaceName,
+    required List<T>? Function(dynamic) getSubspaceTags,
+    required void Function(dynamic, List<T>?) setSubspaceTags,
+    required int? Function(T, List<dynamic>) checkTagExistInSubspace,
+  }) {
+    final modifiedTags = List<T>.from(updatedTags);
+    final modifiedSubspaces = List<dynamic>.from(subspaces ?? []);
+
+    if (subspaces != null) {
+      for (var subspace in subspaces) {
+        getSubspaceTags(subspace)?.removeWhere(
+          (tag) => !modifiedTags.any(
+              (updatedTag) => getInternalId(updatedTag) == getInternalId(tag)),
+        );
+      }
+    }
+
+    for (var tag in modifiedTags.toList()) {
+      if (modifiedSubspaces.isEmpty) continue;
+
+      final prevIndice = checkTagExistInSubspace(tag, modifiedSubspaces);
+      final tagLocation = getLocation(tag);
+
+      if ((tagLocation == 'Main Space' || tagLocation == null) &&
+          (prevIndice == null ||
+              getSubspaceName(modifiedSubspaces[prevIndice]) == 'Main Space')) {
+        continue;
+      }
+
+      if ((tagLocation == 'Main Space' || tagLocation == null) &&
+          prevIndice != null) {
+        getSubspaceTags(modifiedSubspaces[prevIndice])
+            ?.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+        continue;
+      }
+
+      if ((tagLocation != 'Main Space' && tagLocation != null) &&
+          prevIndice == null) {
+        final newIndex = modifiedSubspaces
+            .indexWhere((subspace) => getSubspaceName(subspace) == tagLocation);
+
+        if (newIndex != -1) {
+          if (getSubspaceTags(modifiedSubspaces[newIndex])
+                  ?.any((t) => getInternalId(t) == getInternalId(tag)) !=
+              true) {
+            setLocation(tag, getSubspaceName(modifiedSubspaces[newIndex]));
+            final subspaceTags =
+                getSubspaceTags(modifiedSubspaces[newIndex]) ?? [];
+            subspaceTags.add(tag);
+            setSubspaceTags(modifiedSubspaces[newIndex], subspaceTags);
+          }
+        }
+
+        modifiedTags.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+        continue;
+      }
+
+      if ((tagLocation != 'Main Space' && tagLocation != null) &&
+          tagLocation != getSubspaceName(modifiedSubspaces[prevIndice!])) {
+        getSubspaceTags(modifiedSubspaces[prevIndice])
+            ?.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+
+        final newIndex = modifiedSubspaces
+            .indexWhere((subspace) => getSubspaceName(subspace) == tagLocation);
+
+        if (newIndex != -1) {
+          if (getSubspaceTags(modifiedSubspaces[newIndex])
+                  ?.any((t) => getInternalId(t) == getInternalId(tag)) !=
+              true) {
+            setLocation(tag, getSubspaceName(modifiedSubspaces[newIndex]));
+            final subspaceTags =
+                getSubspaceTags(modifiedSubspaces[newIndex]) ?? [];
+            subspaceTags.add(tag);
+            setSubspaceTags(modifiedSubspaces[newIndex], subspaceTags);
+          }
+        }
+
+        modifiedTags.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+        continue;
+      }
+
+      if ((tagLocation != 'Main Space' && tagLocation != null) &&
+          tagLocation == getSubspaceName(modifiedSubspaces[prevIndice!])) {
+        modifiedTags.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+        continue;
+      }
+
+      if ((tagLocation == 'Main Space' || tagLocation == null) &&
+          prevIndice != null) {
+        getSubspaceTags(modifiedSubspaces[prevIndice])
+            ?.removeWhere((t) => getInternalId(t) == getInternalId(tag));
+      }
+    }
+
+    return {
+      'updatedTags': modifiedTags,
+      'subspaces': modifiedSubspaces,
+    };
+  }
+
+  static List<String> getAvailableTags<T>({
+    required List<String> allTags,
+    required List<T> currentTags,
+    required T currentTag,
+    required String? Function(T) getTag, // Allow nullable return type
+  }) {
+    return allTags
+        .where((tagValue) => !currentTags
+            .where((e) => e != currentTag) // Exclude the current row
+            .map((e) => getTag(e) ?? '') // Handle null values gracefully
+            .contains(tagValue))
+        .toList();
+  }
+
+  static List<String> getAvailableTagModels(
+      List<String> allTags, List<TagModel> currentTags, TagModel currentTag) {
+    List<String> availableTagsForTagModel =
+        TagHelper.getAvailableTags<TagModel>(
+      allTags: allTags,
+      currentTags: currentTags,
+      currentTag: currentTag,
+      getTag: (tag) => tag.tag ?? '',
+    );
+    return availableTagsForTagModel;
+  }
+
   static List<TagModel> generateInitialTags({
     List<TagModel>? spaceTagModels,
     List<SubspaceTemplateModel>? subspaces,
@@ -17,23 +152,52 @@ class TagHelper {
     if (subspaces != null) {
       for (var subspace in subspaces) {
         if (subspace.tags != null) {
-          for (var existingTag in subspace.tags!) {
           initialTags.addAll(
             subspace.tags!.map(
               (tag) => tag.copyWith(
                 location: subspace.subspaceName,
-                    internalId: existingTag.internalId,
+                internalId: tag.internalId,
-                    tag: existingTag.tag),
+                tag: tag.tag,
+              ),
             ),
           );
         }
       }
     }
-    }
+
     return initialTags;
   }
 
-  static Map<ProductModel, int> groupTags(List<TagModel> tags) {
+  static List<Tag> generateInitialForTags({
+    List<Tag>? spaceTags,
+    List<SubspaceModel>? subspaces,
+  }) {
+    final List<Tag> initialTags = [];
+
+    if (spaceTags != null) {
+      initialTags.addAll(spaceTags);
+    }
+
+    if (subspaces != null) {
+      for (var subspace in subspaces) {
+        if (subspace.tags != null) {
+          initialTags.addAll(
+            subspace.tags!.map(
+              (tag) => tag.copyWith(
+                location: subspace.subspaceName,
+                internalId: tag.internalId,
+                tag: tag.tag,
+              ),
+            ),
+          );
+        }
+      }
+    }
+
+    return initialTags;
+  }
+
+  static Map<ProductModel, int> groupTags(List<BaseTag> tags) {
     final Map<ProductModel, int> groupedTags = {};
     for (var tag in tags) {
       if (tag.product != null) {
@@ -78,4 +242,99 @@ class TagHelper {
             ))
         .toList();
   }
+
+  static List<SelectedProduct> createInitialSelectedProductsForTags(
+      List<Tag>? tags, List<SubspaceModel>? subspaces) {
+    final Map<ProductModel, int> productCounts = {};
+
+    if (tags != null) {
+      for (var tag in tags) {
+        if (tag.product != null) {
+          productCounts[tag.product!] = (productCounts[tag.product!] ?? 0) + 1;
+        }
+      }
+    }
+
+    if (subspaces != null) {
+      for (var subspace in subspaces) {
+        if (subspace.tags != null) {
+          for (var tag in subspace.tags!) {
+            if (tag.product != null) {
+              productCounts[tag.product!] =
+                  (productCounts[tag.product!] ?? 0) + 1;
+            }
+          }
+        }
+      }
+    }
+
+    return productCounts.entries
+        .map((entry) => SelectedProduct(
+              productId: entry.key.uuid,
+              count: entry.value,
+              productName: entry.key.name ?? 'Unnamed',
+              product: entry.key,
+            ))
+        .toList();
+  }
+
+  static int? checkTagExistInSubspaceModels(
+      TagModel tag, List<dynamic>? subspaces) {
+    if (subspaces == null) return null;
+
+    for (int i = 0; i < subspaces.length; i++) {
+      final subspace = subspaces[i] as SubspaceTemplateModel; // Explicit cast
+      if (subspace.tags == null) continue;
+      for (var t in subspace.tags!) {
+        if (tag.internalId == t.internalId) {
+          return i;
+        }
+      }
+    }
+    return null;
+  }
+
+  static Map<String, dynamic> updateSubspaceTagModels(
+      List<TagModel> updatedTags, List<SubspaceTemplateModel>? subspaces) {
+    return TagHelper.updateTags<TagModel>(
+      updatedTags: updatedTags,
+      subspaces: subspaces,
+      getInternalId: (tag) => tag.internalId,
+      getLocation: (tag) => tag.location,
+      setLocation: (tag, location) => tag.location = location,
+      getSubspaceName: (subspace) => subspace.subspaceName,
+      getSubspaceTags: (subspace) => subspace.tags,
+      setSubspaceTags: (subspace, tags) => subspace.tags = tags,
+      checkTagExistInSubspace: checkTagExistInSubspaceModels,
+    );
+  }
+
+  static int? checkTagExistInSubspace(Tag tag, List<dynamic>? subspaces) {
+    if (subspaces == null) return null;
+    for (int i = 0; i < subspaces.length; i++) {
+      final subspace = subspaces[i];
+      if (subspace.tags == null) continue;
+      for (var t in subspace.tags!) {
+        if (tag.internalId == t.internalId) {
+          return i;
+        }
+      }
+    }
+    return null;
+  }
+
+  static Map<String, dynamic> processTags(
+      List<Tag> updatedTags, List<SubspaceModel>? subspaces) {
+    return TagHelper.updateTags<Tag>(
+      updatedTags: updatedTags,
+      subspaces: subspaces,
+      getInternalId: (tag) => tag.internalId,
+      getLocation: (tag) => tag.location,
+      setLocation: (tag, location) => tag.location = location,
+      getSubspaceName: (subspace) => subspace.subspaceName,
+      getSubspaceTags: (subspace) => subspace.tags,
+      setSubspaceTags: (subspace, tags) => subspace.tags = tags,
+      checkTagExistInSubspace: checkTagExistInSubspace,
+    );
+  }
 }

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

@@ -68,8 +68,11 @@ class CreateSpaceModelBloc
 
     on<UpdateSpaceTemplate>((event, emit) {
       _space = event.spaceTemplate;
-      emit(CreateSpaceModelLoaded(_space!));
+      final String? errorMessage = _checkDuplicateModelName(
+          event.allModels ?? [], event.spaceTemplate.modelName);
+      emit(CreateSpaceModelLoaded(_space!, errorMessage: errorMessage));
     });
+
     on<AddSubspacesToSpaceTemplate>((event, emit) {
       final currentState = state;
 
@@ -132,7 +135,8 @@ class CreateSpaceModelBloc
         final updatedSpace =
             currentState.space.copyWith(subspaceModels: updatedSubspaces);
 
-        emit(CreateSpaceModelLoaded(updatedSpace));
+        emit(CreateSpaceModelLoaded(updatedSpace,
+            errorMessage: currentState.errorMessage));
       } else {
         emit(CreateSpaceModelError("Space template not initialized"));
       }
@@ -197,26 +201,30 @@ class CreateSpaceModelBloc
 
     on<ModifySpaceTemplate>((event, emit) async {
       try {
-        final prevSpaceModel = event.spaceTemplate;
+        if (event.spaceTemplate.uuid != null) {
+          final prevSpaceModel =
+              await _api.getSpaceModel(event.spaceTemplate.uuid ?? '');
+
           final newSpaceModel = event.updatedSpaceTemplate;
           String? spaceModelName;
-        if (prevSpaceModel.modelName != newSpaceModel.modelName) {
+          if (prevSpaceModel?.modelName != newSpaceModel.modelName) {
             spaceModelName = newSpaceModel.modelName;
           }
           List<TagModelUpdate> tagUpdates = [];
           final List<UpdateSubspaceTemplateModel> subspaceUpdates = [];
           final List<SubspaceTemplateModel>? prevSubspaces =
-            prevSpaceModel.subspaceModels;
+              prevSpaceModel?.subspaceModels;
           final List<SubspaceTemplateModel>? newSubspaces =
               newSpaceModel.subspaceModels;
 
-        tagUpdates = processTagUpdates(prevSpaceModel.tags, newSpaceModel.tags);
+          tagUpdates =
+              processTagUpdates(prevSpaceModel?.tags, newSpaceModel.tags);
 
           if (prevSubspaces != null || newSubspaces != null) {
             if (prevSubspaces != null && newSubspaces != null) {
-            for (var prevSubspace in prevSubspaces!) {
+              for (var prevSubspace in prevSubspaces) {
-              final existsInNew = newSubspaces!
+                final existsInNew = newSubspaces
-                  .any((newTag) => newTag.uuid == prevSubspace.uuid);
+                    .any((subspace) => subspace.uuid == prevSubspace.uuid);
                 if (!existsInNew) {
                   subspaceUpdates.add(UpdateSubspaceTemplateModel(
                       action: Action.delete, uuid: prevSubspace.uuid));
@@ -239,6 +247,7 @@ class CreateSpaceModelBloc
                     for (var tag in newSubspace.tags!) {
                       tagUpdates.add(TagModelUpdate(
                           action: Action.add,
+                          uuid: tag.uuid == '' ? null : tag.uuid,
                           tag: tag.tag,
                           productUuid: tag.product?.uuid));
                     }
@@ -256,8 +265,9 @@ class CreateSpaceModelBloc
                 for (var subspace in newSubspaces!) subspace.uuid: subspace
               };
 
-            for (var prevSubspace in prevSubspaces!) {
+              for (var prevSubspace in prevSubspaces) {
                 final newSubspace = newSubspaceMap[prevSubspace.uuid];
+
                 if (newSubspace != null) {
                   final List<TagModelUpdate> tagSubspaceUpdates =
                       processTagUpdates(prevSubspace.tags, newSubspace.tags);
@@ -266,7 +276,7 @@ class CreateSpaceModelBloc
                       uuid: newSubspace.uuid,
                       subspaceName: newSubspace.subspaceName,
                       tags: tagSubspaceUpdates));
-              } else {}
+                }
               }
             }
           }
@@ -277,7 +287,7 @@ class CreateSpaceModelBloc
               subspaceModels: subspaceUpdates);
 
           final res = await _api.updateSpaceModel(
-            spaceModelBody, prevSpaceModel.uuid ?? '');
+              spaceModelBody, prevSpaceModel?.uuid ?? '');
 
           if (res != null) {
             emit(CreateSpaceModelLoaded(newSpaceModel));
@@ -285,6 +295,7 @@ class CreateSpaceModelBloc
               event.onUpdate!(event.updatedSpaceTemplate);
             }
           }
+        }
       } catch (e) {
         emit(CreateSpaceModelError('Error creating space model'));
       }
@@ -298,10 +309,22 @@ class CreateSpaceModelBloc
     final List<TagModelUpdate> tagUpdates = [];
     final processedTags = <String?>{};
 
+    if (prevTags == null && newTags != null) {
+      for (var newTag in newTags) {
+        tagUpdates.add(TagModelUpdate(
+          action: Action.add,
+          tag: newTag.tag,
+          uuid: newTag.uuid,
+          productUuid: newTag.product?.uuid,
+        ));
+      }
+      return tagUpdates;
+    }
+
     if (newTags != null || prevTags != null) {
       // Case 1: Tags deleted
       if (prevTags != null && newTags != null) {
-        for (var prevTag in prevTags!) {
+        for (var prevTag in prevTags) {
           final existsInNew =
               newTags!.any((newTag) => newTag.uuid == prevTag.uuid);
           if (!existsInNew) {
@@ -318,13 +341,16 @@ class CreateSpaceModelBloc
 
       // Case 2: Tags added
       if (newTags != null) {
+        final prevTagUuids = prevTags?.map((t) => t.uuid).toSet() ?? {};
+
         for (var newTag in newTags!) {
           // Tag without UUID
-          if ((newTag.uuid == null || newTag.uuid!.isEmpty) &&
+          if ((newTag.uuid == null || !prevTagUuids.contains(newTag.uuid)) &&
               !processedTags.contains(newTag.tag)) {
             tagUpdates.add(TagModelUpdate(
                 action: Action.add,
                 tag: newTag.tag,
+                uuid: newTag.uuid == '' ? null : newTag.uuid,
                 productUuid: newTag.product?.uuid));
             processedTags.add(newTag.tag);
           }
@@ -350,4 +376,11 @@ class CreateSpaceModelBloc
 
     return tagUpdates;
   }
+
+  String? _checkDuplicateModelName(List<String> allModels, String name) {
+    if (allModels.contains(name)) {
+      return "Duplicate Model name";
+    }
+    return null;
+  }
 }

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

@@ -14,8 +14,9 @@ class LoadSpaceTemplate extends CreateSpaceModelEvent {}
 
 class UpdateSpaceTemplate extends CreateSpaceModelEvent {
   final SpaceTemplateModel spaceTemplate;
+  List<String>? allModels;
 
-  UpdateSpaceTemplate(this.spaceTemplate);
+  UpdateSpaceTemplate(this.spaceTemplate,this.allModels);
 }
 
 class CreateSpaceTemplate extends CreateSpaceModelEvent {

lib/pages/spaces_management/space_model/models/create_space_template_body_model.dart

@@ -1,5 +1,5 @@
 class TagBodyModel {
-  late String uuid;
+  late String? uuid;
   late String tag;
   late final String? productUuid;
 

lib/pages/spaces_management/space_model/models/space_template_model.dart

@@ -1,5 +1,4 @@
 import 'package:equatable/equatable.dart';
-import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/subspace_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_update_model.dart';

lib/pages/spaces_management/space_model/models/subspace_template_model.dart

@@ -20,7 +20,7 @@ class SubspaceTemplateModel {
     final String internalId = json['internalId'] ?? const Uuid().v4();
 
     return SubspaceTemplateModel(
-      uuid: json['uuid'] ?? '',
+      uuid: json['uuid'],
       subspaceName: json['subspaceName'] ?? '',
       internalId: internalId,
       disabled: json['disabled'] ?? false,

lib/pages/spaces_management/space_model/models/tag_model.dart

@@ -1,27 +1,27 @@
+import 'package:syncrow_web/pages/spaces_management/all_spaces/model/base_tag.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/create_space_template_body_model.dart';
 import 'package:uuid/uuid.dart';
 
-class TagModel {
+class TagModel extends BaseTag {
-  String? uuid;
+  TagModel({
-  String? tag;
+    String? uuid,
-  final ProductModel? product;
+    required String? tag,
-  String internalId;
+    ProductModel? product,
-  String? location;
-
-  TagModel(
-      {this.uuid,
-      required this.tag,
-      this.product,
     String? internalId,
-      this.location})
+    String? location,
-      : internalId = internalId ?? const Uuid().v4();
+  }) : super(
-
+          uuid: uuid,
+          tag: tag,
+          product: product,
+          internalId: internalId,
+          location: location,
+        );
   factory TagModel.fromJson(Map<String, dynamic> json) {
     final String internalId = json['internalId'] ?? const Uuid().v4();
 
     return TagModel(
-      uuid: json['uuid'] ?? '',
+      uuid: json['uuid'] ,
       internalId: internalId,
       tag: json['tag'] ?? '',
       product: json['product'] != null
@@ -30,9 +30,11 @@ class TagModel {
     );
   }
 
+  @override
   TagModel copyWith(
       {String? tag,
       ProductModel? product,
+      String? uuid,
       String? location,
       String? internalId}) {
     return TagModel(
@@ -40,6 +42,7 @@ class TagModel {
       product: product ?? this.product,
       location: location ?? this.location,
       internalId: internalId ?? this.internalId,
+      uuid:uuid?? this.uuid
     );
   }
 
@@ -55,7 +58,7 @@ class TagModel {
 extension TagModelExtensions on TagModel {
   TagBodyModel toTagBodyModel() {
     return TagBodyModel()
-      ..uuid = uuid ?? ''
+      ..uuid = uuid
       ..tag = tag ?? ''
       ..productUuid = product?.uuid;
   }

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

@@ -11,8 +11,10 @@ import 'package:syncrow_web/utils/color_manager.dart';
 
 class SpaceModelPage extends StatelessWidget {
   final List<ProductModel>? products;
+  final Function(List<SpaceTemplateModel>)? onSpaceModelsUpdated;
 
-  const SpaceModelPage({Key? key, this.products}) : super(key: key);
+  const SpaceModelPage({Key? key, this.products, this.onSpaceModelsUpdated})
+      : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -25,6 +27,10 @@ class SpaceModelPage extends StatelessWidget {
           final allTagValues = _getAllTagValues(spaceModels);
           final allSpaceModelNames = _getAllSpaceModelName(spaceModels);
 
+          if (onSpaceModelsUpdated != null) {
+            onSpaceModelsUpdated!(spaceModels);
+          }
+
           return Scaffold(
             backgroundColor: ColorsManager.whiteColors,
             body: Padding(
@@ -63,7 +69,8 @@ class SpaceModelPage extends StatelessWidget {
                         }
                         // Render existing space model
                         final model = spaceModels[index];
-                        final otherModel = List<String>.from(allSpaceModelNames);
+                        final otherModel =
+                            List<String>.from(allSpaceModelNames);
                         otherModel.remove(model.modelName);
                         return GestureDetector(
                             onTap: () {
@@ -76,6 +83,7 @@ class SpaceModelPage extends StatelessWidget {
                                     spaceModel: model,
                                     otherSpaceModels: otherModel,
                                     pageContext: context,
+                                    allSpaceModels: spaceModels,
                                   );
                                 },
                               );
@@ -95,7 +103,10 @@ class SpaceModelPage extends StatelessWidget {
           return Center(
             child: Text(
               'Error: ${state.message}',
-              style: const TextStyle(color: ColorsManager.warningRed),
+              style: Theme.of(context)
+                  .textTheme
+                  .bodySmall
+                  ?.copyWith(color: ColorsManager.warningRed),
             ),
           );
         }
@@ -107,14 +118,14 @@ class SpaceModelPage extends StatelessWidget {
   double _calculateChildAspectRatio(BuildContext context) {
     double screenWidth = MediaQuery.of(context).size.width;
     if (screenWidth > 1600) {
-      return 2;
+      return 1.5; // Decrease to make cards taller
     }
     if (screenWidth > 1200) {
-      return 3;
+      return 2.0;
     } else if (screenWidth > 800) {
-      return 3.5;
+      return 2.5;
     } else {
-      return 4.0;
+      return 3.0;
     }
   }
 

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

@@ -1,15 +1,15 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_svg/svg.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 
 class ButtonContentWidget extends StatelessWidget {
-  final IconData icon;
+  final IconData? icon;
   final String label;
+  final String? svgAssets;
 
-  const ButtonContentWidget({
+  const ButtonContentWidget(
-    Key? key,
+      {Key? key, this.icon, required this.label, this.svgAssets})
-    required this.icon,
+      : super(key: key);
-    required this.label,
-  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -30,10 +30,20 @@ class ButtonContentWidget extends StatelessWidget {
           padding: const EdgeInsets.symmetric(vertical: 10.0, horizontal: 16.0),
           child: Row(
             children: [
+              if (icon != null)
                 Icon(
                   icon,
                   color: ColorsManager.spaceColor,
                 ),
+              if (svgAssets != null)
+                Padding(
+                  padding: const EdgeInsets.only(left: 6.0),
+                  child: SvgPicture.asset(
+                    svgAssets!,
+                    width: screenWidth * 0.015, // Adjust icon size
+                    height: screenWidth * 0.015,
+                  ),
+                ),
               const SizedBox(width: 10),
               Expanded(
                 child: Text(

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

@@ -22,6 +22,7 @@ class CreateSpaceModelDialog extends StatelessWidget {
   final SpaceTemplateModel? spaceModel;
   final BuildContext? pageContext;
   final List<String>? otherSpaceModels;
+  final List<SpaceTemplateModel>? allSpaceModels;
 
   const CreateSpaceModelDialog(
       {Key? key,
@@ -29,7 +30,8 @@ class CreateSpaceModelDialog extends StatelessWidget {
       this.allTags,
       this.spaceModel,
       this.pageContext,
-      this.otherSpaceModels})
+      this.otherSpaceModels,
+      this.allSpaceModels})
       : super(key: key);
 
   @override
@@ -50,12 +52,14 @@ class CreateSpaceModelDialog extends StatelessWidget {
           create: (_) {
             final bloc = CreateSpaceModelBloc(_spaceModelApi);
             if (spaceModel != null) {
-              bloc.add(UpdateSpaceTemplate(spaceModel!));
+              bloc.add(UpdateSpaceTemplate(spaceModel!, otherSpaceModels));
             } else {
-              bloc.add(UpdateSpaceTemplate(SpaceTemplateModel(
+              bloc.add(UpdateSpaceTemplate(
+                  SpaceTemplateModel(
                     modelName: '',
                     subspaceModels: const [],
-              )));
+                  ),
+                  otherSpaceModels));
             }
 
             spaceNameController.addListener(() {
@@ -98,14 +102,19 @@ class CreateSpaceModelDialog extends StatelessWidget {
                                   name: value,
                                   allModels: otherSpaceModels ?? []));
                         },
-                        style: const TextStyle(color: ColorsManager.blackColor),
+                        style: Theme.of(context)
+                            .textTheme
+                            .bodySmall!
+                            .copyWith(color: ColorsManager.blackColor),
                         decoration: InputDecoration(
                           filled: true,
                           fillColor: ColorsManager.textFieldGreyColor,
                           hintText: 'Please enter the name',
                           errorText: state.errorMessage,
-                          hintStyle: const TextStyle(
+                          hintStyle: Theme.of(context)
-                              color: ColorsManager.lightGrayColor),
+                              .textTheme
+                              .bodySmall!
+                              .copyWith(color: ColorsManager.lightGrayColor),
                           border: OutlineInputBorder(
                             borderRadius: BorderRadius.circular(10),
                             borderSide: BorderSide.none,
@@ -119,12 +128,17 @@ class CreateSpaceModelDialog extends StatelessWidget {
                     ),
                     const SizedBox(height: 16),
                     SubspaceModelCreate(
-                      context,
                       subspaces: state.space.subspaceModels ?? [],
-                      onSpaceModelUpdate: (updatedSubspaces) {
+                      tags: state.space.tags ?? [],
+                      onSpaceModelUpdate: (updatedSubspaces,updatedTags) {
                         context
                             .read<CreateSpaceModelBloc>()
                             .add(AddSubspacesToSpaceTemplate(updatedSubspaces));
+                        if(updatedTags!=null){
+                          context
+                            .read<CreateSpaceModelBloc>()
+                            .add(AddTagsToSpaceTemplate(updatedTags));
+                        }
                       },
                     ),
                     const SizedBox(height: 10),
@@ -138,6 +152,7 @@ class CreateSpaceModelDialog extends StatelessWidget {
                       spaceNameController: spaceNameController,
                       pageContext: pageContext,
                       otherSpaceModels: otherSpaceModels,
+                      allSpaceModels: allSpaceModels,
                     ),
                     const SizedBox(height: 20),
                     SizedBox(
@@ -147,15 +162,19 @@ class CreateSpaceModelDialog extends StatelessWidget {
                           Expanded(
                             child: CancelButton(
                               label: 'Cancel',
-                              onPressed: () => Navigator.of(context).pop(),
+                              onPressed: () {
+                                Navigator.of(context).pop();
+                              },
                             ),
                           ),
                           const SizedBox(width: 10),
                           Expanded(
                             child: DefaultButton(
-                              onPressed: state.errorMessage == null ||
+                              onPressed: ((state.errorMessage != null &&
-                                      isNameValid
+                                          state.errorMessage != '') ||
-                                  ? () {
+                                      !isNameValid)
+                                  ? null
+                                  : () {
                                       final updatedSpaceTemplate =
                                           updatedSpaceModel.copyWith(
                                         modelName:
@@ -228,13 +247,14 @@ class CreateSpaceModelDialog extends StatelessWidget {
                                           }
                                         }
                                       }
-                                    }
+                                    },
-                                  : null,
                               backgroundColor: ColorsManager.secondaryColor,
                               borderRadius: 10,
-                              foregroundColor: isNameValid
+                              foregroundColor: ((state.errorMessage != null &&
-                                  ? ColorsManager.whiteColors
+                                          state.errorMessage != '') ||
-                                  : ColorsManager.whiteColorsWithOpacity,
+                                      !isNameValid)
+                                  ? ColorsManager.whiteColorsWithOpacity
+                                  : ColorsManager.whiteColors,
                               child: const Text('OK'),
                             ),
                           ),
@@ -246,7 +266,10 @@ class CreateSpaceModelDialog extends StatelessWidget {
               } else if (state is CreateSpaceModelError) {
                 return Text(
                   'Error: ${state.message}',
-                  style: const TextStyle(color: ColorsManager.warningRed),
+                  style: Theme.of(context)
+                      .textTheme
+                      .bodyMedium!
+                      .copyWith(color: ColorsManager.warningRed),
                 );
               }
 

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

@@ -29,7 +29,7 @@ class DynamicRoomWidget extends StatelessWidget {
       final TextPainter textPainter = TextPainter(
         text: TextSpan(
           text: subspace.subspaceName,
-          style: const TextStyle(fontSize: 16),
+          style: Theme.of(context).textTheme.bodyMedium
         ),
         textDirection: TextDirection.ltr,
       )..layout();

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

@@ -31,6 +31,9 @@ class SpaceModelCardWidget extends StatelessWidget {
       }
     }
 
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        bool showOnlyName = constraints.maxWidth < 250;
        return Container(
           padding: const EdgeInsets.all(16.0),
           decoration: BoxDecoration(
@@ -57,6 +60,7 @@ class SpaceModelCardWidget extends StatelessWidget {
                 maxLines: 1,
                 overflow: TextOverflow.ellipsis,
               ),
+              if (!showOnlyName) ...[
                 const SizedBox(height: 10),
                 Expanded(
                   child: Row(
@@ -80,7 +84,8 @@ class SpaceModelCardWidget extends StatelessWidget {
                           ),
                         ),
                       ),
-                if (productTagCount.isNotEmpty && model.subspaceModels != null)
+                      if (productTagCount.isNotEmpty &&
+                          model.subspaceModels != null)
                         Container(
                           width: 1.0,
                           color: ColorsManager.softGray,
@@ -105,8 +110,11 @@ class SpaceModelCardWidget extends StatelessWidget {
                     ],
                   ),
                 ),
+              ]
             ],
           ),
         );
+      },
+    );
   }
 }

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

@@ -1,23 +1,47 @@
 import 'package:flutter/material.dart';
+import 'package:syncrow_web/common/edit_chip.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/subspace_template_model.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/button_content_widget.dart';
 import 'package:syncrow_web/pages/spaces_management/create_subspace_model/views/create_subspace_model_dialog.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/widgets/subspace_name_label_widget.dart';
 import 'package:syncrow_web/utils/color_manager.dart';
 
-class SubspaceModelCreate extends StatelessWidget {
+class SubspaceModelCreate extends StatefulWidget {
   final List<SubspaceTemplateModel> subspaces;
-  final void Function(List<SubspaceTemplateModel> newSubspaces)?
+  final void Function(
+          List<SubspaceTemplateModel> newSubspaces, List<TagModel>? tags)?
       onSpaceModelUpdate;
+  final List<TagModel> tags;
 
-  const SubspaceModelCreate(BuildContext context,
+  const SubspaceModelCreate({
-      {Key? key, required this.subspaces, this.onSpaceModelUpdate})
+    Key? key,
-      : super(key: key);
+    required this.subspaces,
+    this.onSpaceModelUpdate,
+    required this.tags,
+  }) : super(key: key);
+
+  @override
+  _SubspaceModelCreateState createState() => _SubspaceModelCreateState();
+}
+
+class _SubspaceModelCreateState extends State<SubspaceModelCreate> {
+  late List<SubspaceTemplateModel> _subspaces;
+  String? errorSubspaceId;
+  late List<TagModel> _tags;
+
+  @override
+  void initState() {
+    super.initState();
+    _subspaces = List.from(widget.subspaces);
+    _tags = List.from(widget.tags);
+  }
 
   @override
   Widget build(BuildContext context) {
     final screenWidth = MediaQuery.of(context).size.width;
     return Container(
-      child: subspaces.isEmpty
+      child: _subspaces.isEmpty
           ? TextButton(
               style: TextButton.styleFrom(
                 overlayColor: ColorsManager.transparentColor,
@@ -39,46 +63,37 @@ class SubspaceModelCreate extends StatelessWidget {
                   borderRadius: BorderRadius.circular(15),
                   border: Border.all(
                     color: ColorsManager.textFieldGreyColor,
-                    width: 3.0, // Border width
+                    width: 3.0,
                   ),
                 ),
                 child: Wrap(
                   spacing: 8.0,
                   runSpacing: 8.0,
                   children: [
-                    ...subspaces.map((subspace) => Container(
+                    ..._subspaces.map((subspace) {
-                          padding: const EdgeInsets.symmetric(
+                      return Column(
-                              horizontal: 8.0, vertical: 4.0),
+                        crossAxisAlignment: CrossAxisAlignment.start,
-                          decoration: BoxDecoration(
+                        children: [
-                            color: ColorsManager.whiteColors,
+                          SubspaceNameDisplayWidget(
-                            borderRadius: BorderRadius.circular(10),
+                            text: subspace.subspaceName,
-                            border: Border.all(
+                            validateName: (updatedName) {
-                                color: ColorsManager.transparentColor),
+                              return !_subspaces.any((s) =>
+                                  s != subspace &&
+                                  s.subspaceName == updatedName);
+                            },
+                            onNameChanged: (updatedName) {
+                              setState(() {
+                                subspace.subspaceName = updatedName;
+                              });
+                            },
                           ),
-                          child: Text(
+                        ],
-                            subspace.subspaceName,
+                      );
-                            style: Theme.of(context)
+                    }),
-                                .textTheme
+                    EditChip(
-                                .bodySmall
-                                ?.copyWith(color: ColorsManager.spaceColor),
-                          ),
-                        )),
-                    GestureDetector(
                       onTap: () async {
                         await _openDialog(context, 'Edit Sub-space');
                       },
-                      child: Chip(
-                        label: const Text(
-                          'Edit',
-                          style: TextStyle(color: ColorsManager.spaceColor),
-                        ),
-                        backgroundColor: ColorsManager.whiteColors,
-                        shape: RoundedRectangleBorder(
-                          borderRadius: BorderRadius.circular(16),
-                          side:
-                              const BorderSide(color: ColorsManager.spaceColor),
-                        ),
-                      ),
                     ),
                   ],
                 ),
@@ -95,9 +110,28 @@ class SubspaceModelCreate extends StatelessWidget {
         return CreateSubSpaceModelDialog(
           isEdit: true,
           dialogTitle: dialogTitle,
-          existingSubSpaces: subspaces,
+          existingSubSpaces: _subspaces,
           onUpdate: (subspaceModels) {
-            onSpaceModelUpdate!(subspaceModels);
+            final updatedIds = subspaceModels.map((s) => s.internalId).toSet();
+            final deletedSubspaces = _subspaces
+                .where((s) => !updatedIds.contains(s.internalId))
+                .toList();
+
+            final List<TagModel> tagsToAppendToSpace = [];
+
+            for (var s in deletedSubspaces) {
+              if (s.tags != null) {
+                tagsToAppendToSpace.addAll(s.tags!);
+              }
+            }
+
+            setState(() {
+              _subspaces = subspaceModels;
+              _tags.addAll(tagsToAppendToSpace);
+            });
+            if (widget.onSpaceModelUpdate != null) {
+              widget.onSpaceModelUpdate!(subspaceModels, _tags);
+            }
           },
         );
       },

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

@@ -0,0 +1,137 @@
+import 'package:flutter/material.dart';
+import 'package:syncrow_web/utils/color_manager.dart';
+
+class SubspaceNameDisplayWidget extends StatefulWidget {
+  final String text;
+  final TextStyle? textStyle;
+  final Color backgroundColor;
+  final Color borderColor;
+  final EdgeInsetsGeometry padding;
+  final BorderRadiusGeometry borderRadius;
+  final void Function(String updatedName) onNameChanged;
+  final bool Function(String updatedName) validateName;
+
+  const SubspaceNameDisplayWidget({
+    Key? key,
+    required this.text,
+    this.textStyle,
+    this.backgroundColor = ColorsManager.whiteColors,
+    this.borderColor = ColorsManager.transparentColor,
+    this.padding = const EdgeInsets.symmetric(horizontal: 8.0, vertical: 4.0),
+    this.borderRadius = const BorderRadius.all(Radius.circular(10)),
+    required this.onNameChanged,
+    required this.validateName,
+  }) : super(key: key);
+
+  @override
+  _SubspaceNameDisplayWidgetState createState() =>
+      _SubspaceNameDisplayWidgetState();
+}
+
+class _SubspaceNameDisplayWidgetState extends State<SubspaceNameDisplayWidget> {
+  bool isEditing = false;
+  late TextEditingController _controller;
+  late FocusNode _focusNode;
+  late String previousName;
+  String? errorText;
+
+  @override
+  void initState() {
+    super.initState();
+    _controller = TextEditingController(text: widget.text);
+    _focusNode = FocusNode();
+    previousName = widget.text;
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    _focusNode.dispose();
+    super.dispose();
+  }
+
+  void _handleValidationAndSave() {
+    final updatedName = _controller.text;
+
+    if (updatedName.isEmpty) {
+      setState(() {
+        errorText = 'Subspace name cannot be empty.';
+      });
+      return;
+    }
+    if (widget.validateName(updatedName)) {
+      setState(() {
+        errorText = null;
+        isEditing = false;
+        previousName = updatedName;
+        widget.onNameChanged(updatedName);
+      });
+    } else {
+      setState(() {
+        errorText = 'Subspace name already exists.';
+      });
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Column(
+      crossAxisAlignment: CrossAxisAlignment.start,
+      children: [
+        GestureDetector(
+          onTap: () {
+            setState(() {
+              isEditing = true;
+              _focusNode.requestFocus();
+            });
+          },
+          child: Container(
+            padding: widget.padding,
+            decoration: BoxDecoration(
+              color: widget.backgroundColor,
+              borderRadius: widget.borderRadius,
+              border: Border.all(color: widget.borderColor),
+            ),
+            child: isEditing
+                ? TextField(
+                    controller: _controller,
+                    focusNode: _focusNode,
+                    style: widget.textStyle ??
+                        Theme.of(context)
+                            .textTheme
+                            .bodySmall
+                            ?.copyWith(color: ColorsManager.spaceColor),
+                    autofocus: true,
+                    decoration: const InputDecoration(
+                      border: InputBorder.none,
+                      contentPadding: EdgeInsets.symmetric(horizontal: 8.0),
+                    ),
+                    onSubmitted: (value) {
+                      _handleValidationAndSave();
+                    },
+                  )
+                : Text(
+                    widget.text,
+                    style: widget.textStyle ??
+                        Theme.of(context)
+                            .textTheme
+                            .bodySmall
+                            ?.copyWith(color: ColorsManager.spaceColor),
+                  ),
+          ),
+        ),
+        if (errorText != null)
+          Padding(
+            padding: const EdgeInsets.only(top: 4.0),
+            child: Text(
+              errorText!,
+              style: Theme.of(context)
+                  .textTheme
+                  .bodyMedium!
+                  .copyWith(color: ColorsManager.warningRed),
+            ),
+          ),
+      ],
+    );
+  }
+}

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

@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/svg.dart';
+import 'package:syncrow_web/common/edit_chip.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag_models/views/assign_tag_models_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
@@ -18,6 +19,7 @@ class TagChipDisplay extends StatelessWidget {
   final TextEditingController spaceNameController;
   final BuildContext? pageContext;
   final List<String>? otherSpaceModels;
+  final List<SpaceTemplateModel>? allSpaceModels;
 
   const TagChipDisplay(BuildContext context,
       {Key? key,
@@ -28,7 +30,8 @@ class TagChipDisplay extends StatelessWidget {
       required this.allTags,
       required this.spaceNameController,
       this.pageContext,
-      this.otherSpaceModels})
+      this.otherSpaceModels,
+      this.allSpaceModels})
       : super(key: key);
 
   @override
@@ -70,9 +73,12 @@ class TagChipDisplay extends StatelessWidget {
                           ),
                           label: Text(
                             'x${entry.value}', // Show count
-                            style: const TextStyle(
+                            style: Theme.of(context)
-                              color: ColorsManager.spaceColor,
+                                .textTheme
-                            ),
+                                .bodySmall!
+                                .copyWith(
+                                    color:
+                                        ColorsManager.spaceColor),
                           ),
                           backgroundColor: ColorsManager.whiteColors,
                           shape: RoundedRectangleBorder(
@@ -83,22 +89,21 @@ class TagChipDisplay extends StatelessWidget {
                           ),
                         ),
                       ),
-                  GestureDetector(
+                  EditChip(onTap: () async {
-                    onTap: () async {
                     // Use the Navigator's context for showDialog
-                      final navigatorContext =
+                    Navigator.of(context).pop();
-                          Navigator.of(context).overlay?.context;
 
-                      if (navigatorContext != null) {
                     await showDialog<bool>(
                         barrierDismissible: false,
-                            context: navigatorContext,
+                        context: context,
                         builder: (context) => AssignTagModelsDialog(
                               products: products,
+                              allSpaceModels: allSpaceModels,
                               subspaces: subspaces,
                               pageContext: pageContext,
                               allTags: allTags,
                               spaceModel: spaceModel,
+                              otherSpaceModels: otherSpaceModels,
                               initialTags: TagHelper.generateInitialTags(
                                   subspaces: subspaces,
                                   spaceTagModels: spaceModel?.tags ?? []),
@@ -108,20 +113,7 @@ class TagChipDisplay extends StatelessWidget {
                                       spaceModel?.tags ?? [], subspaces),
                               spaceName: spaceModel?.modelName ?? '',
                             ));
-                      }
+                  })
-                    },
-                    child: Chip(
-                      label: const Text(
-                        'Edit',
-                        style: TextStyle(color: ColorsManager.spaceColor),
-                      ),
-                      backgroundColor: ColorsManager.whiteColors,
-                      shape: RoundedRectangleBorder(
-                        borderRadius: BorderRadius.circular(16),
-                        side: const BorderSide(color: ColorsManager.spaceColor),
-                      ),
-                    ),
-                  ),
                 ],
               ),
             ),
@@ -141,6 +133,7 @@ class TagChipDisplay extends StatelessWidget {
                   pageContext: pageContext,
                   isCreate: true,
                   spaceModel: spaceModel,
+                  otherSpaceModels: otherSpaceModels,
                 ),
               );
             },

lib/pages/spaces_management/tag_model/views/add_device_type_model_widget.dart

@@ -5,6 +5,7 @@ import 'package:syncrow_web/pages/common/buttons/default_button.dart';
 import 'package:syncrow_web/pages/spaces_management/assign_tag_models/views/assign_tag_models_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/selected_product_model.dart';
+import 'package:syncrow_web/pages/spaces_management/helper/tag_helper.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/subspace_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_model.dart';
@@ -26,6 +27,7 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
   final List<String>? otherSpaceModels;
   final BuildContext? pageContext;
   final SpaceTemplateModel? spaceModel;
+  final List<SpaceTemplateModel>? allSpaceModels;
 
   const AddDeviceTypeModelWidget(
       {super.key,
@@ -38,7 +40,8 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
       required this.isCreate,
       this.pageContext,
       this.otherSpaceModels,
-      this.spaceModel});
+      this.spaceModel,
+      this.allSpaceModels});
 
   @override
   Widget build(BuildContext context) {
@@ -106,6 +109,7 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
                         context: context,
                         builder: (BuildContext dialogContext) {
                           return CreateSpaceModelDialog(
+                            allSpaceModels: allSpaceModels,
                             products: products,
                             allTags: allTags,
                             pageContext: pageContext,
@@ -120,7 +124,7 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
                         },
                       );
                     } else {
-                      final initialTags = generateInitialTags(
+                      final initialTags = TagHelper.generateInitialTags(
                         spaceTagModels: spaceTagModels,
                         subspaces: subspaces,
                       );
@@ -162,7 +166,8 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
                             : () async {
                                 if (state is AddDeviceModelLoaded &&
                                     state.selectedProducts.isNotEmpty) {
-                                  final initialTags = generateInitialTags(
+                                  final initialTags =
+                                      TagHelper.generateInitialTags(
                                     spaceTagModels: spaceTagModels,
                                     subspaces: subspaces,
                                   );
@@ -175,11 +180,12 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
                                     context: context,
                                     builder: (context) => AssignTagModelsDialog(
                                       products: products,
+                                      allSpaceModels: allSpaceModels,
                                       subspaces: subspaces,
                                       addedProducts: state.selectedProducts,
                                       allTags: allTags,
                                       spaceName: spaceName,
-                                      initialTags: state.initialTag,
+                                      initialTags: initialTags,
                                       otherSpaceModels: otherSpaceModels,
                                       title: dialogTitle,
                                       spaceModel: spaceModel,
@@ -200,29 +206,4 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
       ),
     );
   }
-
-  List<TagModel> generateInitialTags({
-    List<TagModel>? spaceTagModels,
-    List<SubspaceTemplateModel>? subspaces,
-  }) {
-    final List<TagModel> initialTags = [];
-
-    if (spaceTagModels != null) {
-      initialTags.addAll(spaceTagModels);
-    }
-
-    if (subspaces != null) {
-      for (var subspace in subspaces) {
-        if (subspace.tags != null) {
-          initialTags.addAll(
-            subspace.tags!.map(
-              (tag) => tag.copyWith(location: subspace.subspaceName),
-            ),
-          );
-        }
-      }
-    }
-
-    return initialTags;
-  }
 }

lib/services/space_mana_api.dart

@@ -4,7 +4,9 @@ import 'package:syncrow_web/pages/spaces_management/all_spaces/model/create_subs
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_model.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/space_response_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/create_space_template_body_model.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_body_model.dart';
+import 'package:syncrow_web/pages/spaces_management/space_model/models/tag_update_model.dart';
 import 'package:syncrow_web/services/api/http_service.dart';
 import 'package:syncrow_web/utils/constants/api_const.dart';
 import 'package:syncrow_web/utils/constants/temp_const.dart';
@@ -154,7 +156,7 @@ class CommunitySpaceManagementApi {
             .replaceAll('{spaceId}', spaceId)
             .replaceAll('{projectId}', TempConst.projectId),
         expectedResponseModel: (json) {
-          return SpaceModel.fromJson(json);
+          return SpaceModel.fromJson(json['data']);
         },
       );
       return response;
@@ -210,7 +212,7 @@ class CommunitySpaceManagementApi {
     }
   }
 
-  Future<SpaceModel?> updateSpace({
+  Future<bool> updateSpace({
     required String communityId,
     required spaceId,
     required String name,
@@ -219,6 +221,8 @@ class CommunitySpaceManagementApi {
     String? direction,
     bool isPrivate = false,
     required Offset position,
+    List<TagModelUpdate>? tags,
+    List<UpdateSubspaceTemplateModel>? subspaces,
   }) async {
     try {
       final body = {
@@ -228,6 +232,8 @@ class CommunitySpaceManagementApi {
         'y': position.dy,
         'direction': direction,
         'icon': icon,
+        'subspace': subspaces,
+        'tags': tags,
       };
       if (parentId != null) {
         body['parentUuid'] = parentId;
@@ -240,13 +246,13 @@ class CommunitySpaceManagementApi {
             .replaceAll('{projectId}', TempConst.projectId),
         body: body,
         expectedResponseModel: (json) {
-          return SpaceModel.fromJson(json['data']);
+          return json['success'] ?? false;
         },
       );
       return response;
     } catch (e) {
-      debugPrint('Error creating space: $e');
+      debugPrint('Error updating space: $e');
-      return null;
+      return false;
     }
   }
 

lib/utils/color_manager.dart

@@ -70,5 +70,5 @@ abstract class ColorsManager {
   static const Color invitedOrangeText = Color(0xFFFFBF00);
   static const Color lightGrayBorderColor = Color(0xB2D5D5D5);
   //background: #F8F8F8;
-
+  static const Color vividBlue = Color(0xFF023DFE);
 }

lib/utils/constants/assets.dart

@@ -259,6 +259,7 @@ class Assets {
 
   static const String delete = 'assets/icons/delete.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
   static const String tabToRun = 'assets/icons/routine/tab_to_run.svg';
 
@@ -398,5 +399,7 @@ class Assets {
   static const String ZtoAIcon = 'assets/icons/ztoa_icon.png';
   static const String AtoZIcon = 'assets/icons/atoz_icon.png';
   static const String link = 'assets/icons/link.svg';
+  static const String duplicate = 'assets/icons/duplicate.svg';
+  static const String spaceDelete = 'assets/icons/space_delete.svg';
 }
 //user_management.svg