Added tags selection modal

lib/screens/clients/add_client_modal.dart

@@ -1,7 +1,11 @@
 import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
 import 'package:uuid/uuid.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 
+import 'package:adguard_home_manager/screens/clients/tags_modal.dart';
+
+import 'package:adguard_home_manager/providers/servers_provider.dart';
 import 'package:adguard_home_manager/models/add_client.dart';
 
 class AddClientModal extends StatefulWidget {
@@ -21,6 +25,8 @@ class _AddClientModalState extends State<AddClientModal> {
 
   TextEditingController nameController = TextEditingController();
 
+  String? selectedTag;
+
   List<Map<dynamic, dynamic>> identifiersControllers = [
     {
       'id': 0,
@@ -50,6 +56,8 @@ class _AddClientModalState extends State<AddClientModal> {
     
   @override
   Widget build(BuildContext context) {
+    final serversProvider = Provider.of<ServersProvider>(context);
+
     void createClient() {
 
     }
@@ -94,6 +102,17 @@ class _AddClientModalState extends State<AddClientModal> {
       }
     }
 
+    void openTagsModal() {
+      showDialog(
+        context: context, 
+        builder: (context) => TagsModal(
+          selectedTag: selectedTag,
+          tags: serversProvider.clients.data!.supportedTags,
+          onConfirm: (selected) => setState(() => selectedTag = selected),
+        )
+      );
+    }
+
     Widget settignsTile({
       required String label,
       required bool? value,
@@ -192,7 +211,7 @@ class _AddClientModalState extends State<AddClientModal> {
                     Material(
                       color: Colors.transparent,
                       child: InkWell(
-                        onTap: () => {},
+                        onTap: openTagsModal,
                         child: Padding(
                           padding: const EdgeInsets.symmetric(
                             vertical: 10, horizontal: 20
@@ -215,7 +234,9 @@ class _AddClientModalState extends State<AddClientModal> {
                                   ),
                                   const SizedBox(height: 5),
                                   Text(
-                                    AppLocalizations.of(context)!.noTagsSelected,
+                                    selectedTag != null
+                                      ? selectedTag!
+                                      : AppLocalizations.of(context)!.noTagsSelected,
                                     style: const TextStyle(
                                       color: Colors.grey
                                     ),

lib/screens/clients/tags_modal.dart

@@ -0,0 +1,87 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+
+class TagsModal extends StatefulWidget {
+  final String? selectedTag;
+  final List<String> tags;
+  final void Function(String) onConfirm;
+
+  const TagsModal({
+    Key? key,
+    this.selectedTag,
+    required this.tags,
+    required this.onConfirm,
+  }) : super(key: key);
+
+  @override
+  State<TagsModal> createState() => _TagsModalState();
+}
+
+class _TagsModalState extends State<TagsModal> {
+  String? selectedTag;
+
+  @override
+  void initState() {
+    selectedTag = widget.selectedTag;
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return AlertDialog(
+      scrollable: true,
+      contentPadding: const EdgeInsets.symmetric(
+        horizontal: 0,
+        vertical: 20
+      ),
+      title: Column(
+        children: [
+          const Icon(Icons.label_rounded),
+          const SizedBox(height: 20),
+          Text(AppLocalizations.of(context)!.tags)
+        ],
+      ),
+      content: SizedBox(
+        width: double.minPositive,
+        height: MediaQuery.of(context).size.height*0.5,
+        child: ListView.builder(
+          shrinkWrap: true,
+          itemCount: widget.tags.length,
+          itemBuilder: (context, index) => RadioListTile(
+            title: Text(
+              widget.tags[index],
+              style: const TextStyle(
+                fontWeight: FontWeight.normal
+              ),
+            ),
+            value: widget.tags[index], 
+            groupValue: selectedTag, 
+            onChanged: (value) => setState(() => selectedTag = value)
+          )
+        ),
+      ),
+      actions: [
+        TextButton(
+          onPressed: () => Navigator.pop(context), 
+          child: Text(AppLocalizations.of(context)!.cancel)
+        ),
+        TextButton(
+          onPressed: selectedTag != null 
+            ? () {
+                widget.onConfirm(selectedTag!);
+                Navigator.pop(context);
+              }
+            : null, 
+          child: Text(
+            AppLocalizations.of(context)!.confirm,
+            style: TextStyle(
+              color: selectedTag != null 
+                ? Theme.of(context).primaryColor
+                : Colors.grey
+            ),
+          )
+        ),
+      ],
+    );
+  }
+}