added validation

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

@@ -11,15 +11,17 @@ class AssignTagModelsDialog extends StatefulWidget {
   final List<TagModel>? initialTags;
   final ValueChanged<List<TagModel>>? onTagsAssigned;
   final List<SelectedProduct> addedProducts;
+  final List<String>? allTags;
 
-  const AssignTagModelsDialog({
+  const AssignTagModelsDialog(
-    Key? key,
+      {Key? key,
       required this.products,
       required this.subspaces,
       required this.addedProducts,
       this.initialTags,
       this.onTagsAssigned,
-  }) : super(key: key);
+      this.allTags})
+      : super(key: key);
 
   @override
   AssignTagModelsDialogState createState() => AssignTagModelsDialogState();
@@ -29,12 +31,15 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
   late List<TagModel> tags;
   late List<SelectedProduct> selectedProducts;
   late List<String> locations;
+  late List<String> otherTags;
+  late List<TextEditingController> controllers;
+  Set<String> usedTags = {};
+  String? errorMessage;
+  bool isSaveEnabled = true;
 
   @override
   void initState() {
     super.initState();
-    print(widget.addedProducts);
-    print(widget.subspaces);
 
     // Initialize tags from widget.initialTags or create new ones if it's empty
     tags = widget.initialTags?.isNotEmpty == true
@@ -58,6 +63,39 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
         ? widget.subspaces!.map((subspace) => subspace.subspaceName).toList()
         : [];
     locations.add("None");
+
+    otherTags = widget.allTags != null ? widget.allTags! : [];
+
+    controllers = List.generate(
+      tags.length,
+      (index) => TextEditingController(text: tags[index].tag),
+    );
+
+    for (final tag in tags) {
+      if (tag.tag != null && tag.tag!.isNotEmpty) {
+        usedTags.add(tag.tag!);
+      }
+    }
+
+    _validateTags();
+  }
+
+  void _validateTags() {
+    // Disable save if any tag is empty
+    final hasEmptyTag =
+        tags.any((tag) => tag.tag == null || tag.tag!.trim().isEmpty);
+    setState(() {
+      isSaveEnabled = !hasEmptyTag;
+    });
+  }
+
+  @override
+  void dispose() {
+    // Dispose of controllers
+    for (final controller in controllers) {
+      controller.dispose();
+    }
+    super.dispose();
   }
 
   @override
@@ -66,23 +104,16 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
       title: const Text('Assign Tags'),
       backgroundColor: ColorsManager.whiteColors,
       content: SingleChildScrollView(
-        child: Container(
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Container(
               width: MediaQuery.of(context).size.width * 0.4,
               decoration: BoxDecoration(
-            border: Border.all(color: ColorsManager.dataHeaderGrey, width: 1),
+                border:
+                    Border.all(color: ColorsManager.dataHeaderGrey, width: 1),
                 borderRadius: BorderRadius.circular(20),
               ),
-          child: Theme(
-            data: Theme.of(context).copyWith(
-              dataTableTheme: DataTableThemeData(
-                headingRowColor:
-                    MaterialStateProperty.all(ColorsManager.dataHeaderGrey),
-                headingTextStyle: const TextStyle(
-                  color: ColorsManager.blackColor,
-                  fontWeight: FontWeight.bold,
-                ),
-              ),
-            ),
               child: DataTable(
                 border: TableBorder.all(
                   color: ColorsManager.dataHeaderGrey,
@@ -95,68 +126,98 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
                   DataColumn(label: Text('Tag')),
                   DataColumn(label: Text('Location')),
                 ],
-              rows: tags.asMap().entries.map((entry) {
+                rows: List.generate(tags.length, (index) {
-                final index = entry.key + 1;
+                  final tag = tags[index];
-                final tag = entry.value;
+                  final controller = controllers[index];
 
                   return DataRow(
                     cells: [
+                      DataCell(Center(child: Text(index.toString()))),
                       DataCell(
-                      Center(
+                          Center(child: Text(tag.product?.name ?? 'Unknown'))),
-                        child: Text(index.toString()),
-                      ),
-                    ),
                       DataCell(
-                      Center(
+                        Row(
-                        child: Text(tag.product?.catName ?? 'Unknown'),
+                          children: [
+                            Expanded(
+                              child: TextFormField(
+                                controller: controller,
+                                decoration: const InputDecoration(
+                                  hintText: 'Enter Tag',
+                                  border: InputBorder.none,
+                                  hintStyle: TextStyle(
+                                    color: Colors.grey,
+                                    fontSize: 14,
                                   ),
                                 ),
-                    DataCell(
+                                style: const TextStyle(
-                      Center(
+                                  color: Colors.black,
-                        child: DropdownButton<String>(
+                                  fontSize: 14,
-                          value: tag.tag!.isNotEmpty ? tag.tag : null,
+                                ),
                                 onChanged: (value) {
                                   setState(() {
-                              tag.tag = value ?? ''; // Update tag value
+                                    tag.tag = value.trim();
+                                    _validateTags();
                                   });
                                 },
-                          items: [
-                            const DropdownMenuItem(
-                              value: null,
-                              child: Text('None'),
                               ),
-                            ...List.generate(10, (index) {
+                            ),
-                              final tagName = 'Tag ${index + 1}';
+                            PopupMenuButton<String>(
-                              return DropdownMenuItem(
+                              icon: const Icon(Icons.arrow_drop_down,
-                                value: tagName,
+                                  color: Colors.black),
-                                child: Text(tagName),
+                              onSelected: (value) {
+                                setState(() {
+                                  if (tag.tag != null && tag.tag!.isNotEmpty) {
+                                    usedTags.remove(tag.tag!);
+                                  }
+                                  controller.text = value;
+                                  tag.tag = value;
+
+                                  if (tag.tag != null && tag.tag!.isNotEmpty) {
+                                    usedTags.add(tag.tag!);
+                                  }
+                                  _validateTags(); // Validate after selection
+                                });
+                              },
+                              color: Colors.white,
+                              itemBuilder: (context) {
+                                return widget.allTags!
+                                    .where((tagValue) =>
+                                        !usedTags.contains(tagValue))
+                                    .map((tagValue) {
+                                  return PopupMenuItem<String>(
+                                    value: tagValue,
+                                    child: Text(
+                                      tagValue,
+                                      style: const TextStyle(
+                                        color: Color(0xFF5D5D5D),
+                                        fontSize: 14,
+                                      ),
+                                    ),
                                   );
-                            }),
+                                }).toList();
-                          ],
+                              },
                             ),
+                          ],
                         ),
                       ),
                       DataCell(
                         Center(
                           child: DropdownButtonHideUnderline(
                             child: DropdownButton<String>(
-                             alignment: AlignmentDirectional.centerEnd,
+                              alignment: AlignmentDirectional.center,
                               value: locations.contains(tag.location)
                                   ? tag.location
-                                : null, // Validate value
+                                  : null,
                               onChanged: (value) {
                                 setState(() {
-                                tag.location =
+                                  tag.location = value ?? 'None';
-                                    value ?? 'None'; // Update location
                                 });
                               },
-                            dropdownColor: Colors.white,
+                              dropdownColor: ColorsManager.whiteColors,
-                            icon: const Icon(
+                              icon: const Icon(Icons.arrow_drop_down,
-                              Icons.arrow_drop_down,
+                                  color: Colors.black),
-                              color: Colors.black,
-                            ),
                               style: const TextStyle(
-                              fontSize: 16,
+                                fontSize: 10,
                                 fontWeight: FontWeight.w600,
                                 color: Colors.black,
                               ),
@@ -169,7 +230,7 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
                                           style: const TextStyle(
                                             fontSize: 14,
                                             fontWeight: FontWeight.w400,
-                                          color: Colors.grey,
+                                            color: Color(0xFF5D5D5D),
                                           ),
                                         ),
                                       ))
@@ -180,9 +241,23 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
                       ),
                     ],
                   );
-              }).toList(),
+                }),
               ),
             ),
+            if (errorMessage != null)
+              Container(
+                width: MediaQuery.of(context).size.width * 0.4,
+                padding: const EdgeInsets.only(top: 8.0, left: 12.0),
+                child: Text(
+                  errorMessage!,
+                  style: const TextStyle(
+                    color: Colors.red,
+                    fontSize: 14,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+              ),
+          ],
         ),
       ),
       actions: [
@@ -198,15 +273,19 @@ class AssignTagModelsDialogState extends State<AssignTagModelsDialog> {
               ),
             ),
             ElevatedButton(
-              onPressed: () {
+              onPressed: isSaveEnabled
+                  ? () {
                       Navigator.of(context).pop();
                       if (widget.onTagsAssigned != null) {
                         widget.onTagsAssigned!(tags);
                       }
-              },
+                    }
+                  : null, // Disable the button if validation fails
               child: const Text('Save'),
               style: ElevatedButton.styleFrom(
-                backgroundColor: ColorsManager.secondaryColor,
+                backgroundColor: isSaveEnabled
+                    ? ColorsManager.secondaryColor
+                    : Colors.grey, // Change button color when disabled
                 foregroundColor: ColorsManager.whiteColors,
               ),
             ),

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

@@ -61,7 +61,6 @@ class SpaceTemplateModel {
   }
 }
 
-
 class UpdateSubspaceTemplateModel {
   final String uuid;
   final Action action;
@@ -133,3 +132,28 @@ class UpdateTagModel {
     };
   }
 }
+
+extension SpaceTemplateExtensions on SpaceTemplateModel {
+  List<String> listAllTagValues() {
+    final List<String> tagValues = [];
+
+    if (tags != null) {
+      tagValues.addAll(
+          tags!.map((tag) => tag.tag ?? '').where((tag) => tag.isNotEmpty));
+    }
+
+    if (subspaceModels != null) {
+      for (final subspace in subspaceModels!) {
+        if (subspace.tags != null) {
+          tagValues.addAll(
+            subspace.tags!
+                .map((tag) => tag.tag ?? '')
+                .where((tag) => tag.isNotEmpty),
+          );
+        }
+      }
+    }
+
+    return tagValues;
+  }
+}

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

@@ -1,7 +1,5 @@
 import 'package:flutter/material.dart';
-import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:syncrow_web/pages/spaces_management/all_spaces/model/product_model.dart';
-import 'package:syncrow_web/pages/spaces_management/space_model/bloc/create_space_model_bloc.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/models/space_template_model.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/dialog/create_space_model_dialog.dart';
 import 'package:syncrow_web/pages/spaces_management/space_model/widgets/space_model_card_widget.dart';
@@ -16,6 +14,7 @@ class SpaceModelPage extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final allTagValues = getAllTagValues();
     return Scaffold(
       backgroundColor: ColorsManager.whiteColors,
       body: Padding(
@@ -24,11 +23,11 @@ class SpaceModelPage extends StatelessWidget {
           //clipBehavior: Clip.none,
           shrinkWrap: false,
           physics: const AlwaysScrollableScrollPhysics(),
-          gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
+          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
             crossAxisCount: 3,
             crossAxisSpacing: 13.0,
             mainAxisSpacing: 13.0,
-            childAspectRatio: 3.5,
+            childAspectRatio: calculateChildAspectRatio(context),
           ),
           itemCount: spaceModels.length + 1,
           itemBuilder: (context, index) {
@@ -38,7 +37,7 @@ class SpaceModelPage extends StatelessWidget {
                   showDialog(
                     context: context,
                     builder: (BuildContext context) {
-                      return CreateSpaceModelDialog(products: products);
+                      return CreateSpaceModelDialog(products: products,allTags: allTagValues,);
                     },
                   );
                 },
@@ -91,4 +90,31 @@ class SpaceModelPage extends StatelessWidget {
       ),
     );
   }
+
+  double calculateChildAspectRatio(BuildContext context) {
+    double screenWidth = MediaQuery.of(context).size.width;
+
+    // Adjust the aspect ratio based on the screen width
+    if (screenWidth > 1600) {
+      return 4.0; // For large screens
+    }
+    if (screenWidth > 1200) {
+      return 3.2; // For large screens
+    } else if (screenWidth > 800) {
+      return 3.0; // For medium screens
+    } else {
+      return 2.0; // For small screens
+    }
+  }
+
+  List<String> getAllTagValues() {
+    final List<String> allTags = [];
+
+    for (final spaceModel in spaceModels) {
+      if (spaceModel.tags != null) {
+        allTags.addAll(spaceModel.listAllTagValues());
+      }
+    }
+    return allTags;
+  }
 }

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

@@ -16,8 +16,9 @@ import '../../models/subspace_template_model.dart';
 
 class CreateSpaceModelDialog extends StatelessWidget {
   final List<ProductModel>? products;
+  final List<String>? allTags;
 
-  const CreateSpaceModelDialog({Key? key, this.products}) : super(key: key);
+  const CreateSpaceModelDialog({Key? key, this.products, this.allTags}) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
@@ -79,6 +80,7 @@ class CreateSpaceModelDialog extends StatelessWidget {
                           builder: (context) => AddDeviceTypeModelWidget(
                             products: products,
                             subspaces: subspaces,
+                            allTags: allTags,
                           ),
                         );
                         if (result == true) {

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

@@ -69,7 +69,8 @@ class SpaceModelCardWidget extends StatelessWidget {
                     spacing: 3.0,
                     runSpacing: 3.0,
                     children: [
-                      for (var subspace in model.subspaceModels!.take(3))
+                      for (var subspace in model.subspaceModels!
+                          .take(calculateTakeCount(context)))
                         SubspaceChipWidget(subspace: subspace.subspaceName),
                     ],
                   ),
@@ -126,4 +127,16 @@ class SpaceModelCardWidget extends StatelessWidget {
       ),
     );
   }
+
+  int calculateTakeCount(BuildContext context) {
+    double screenWidth = MediaQuery.of(context).size.width;
+    // Adjust the count based on the screen width
+    if (screenWidth > 1500) {
+      return 3; // For large screens
+    } else if (screenWidth > 1200) {
+      return 2;
+    } else {
+      return 1; // For smaller screens
+    }
+  }
 }

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

@@ -15,13 +15,15 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
   final ValueChanged<List<SelectedProduct>>? onProductsSelected;
   final List<SelectedProduct>? initialSelectedProducts;
   final List<SubspaceTemplateModel>? subspaces;
+  final List<String>? allTags;
 
   const AddDeviceTypeModelWidget(
       {super.key,
       this.products,
       this.initialSelectedProducts,
       this.onProductsSelected,
-      this.subspaces});
+      this.subspaces,
+      this.allTags});
 
   @override
   Widget build(BuildContext context) {
@@ -80,6 +82,7 @@ class AddDeviceTypeModelWidget extends StatelessWidget {
                             products: products,
                             subspaces: subspaces,
                             addedProducts: currentState,
+                            allTags: allTags,
                           ),
                         );
                       }