Create management portal in Flutter #39

web/repertory/lib/main.dart

@@ -1,15 +1,19 @@
+import 'package:collection/collection.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:repertory/constants.dart' as constants;
 import 'package:repertory/helpers.dart';
 import 'package:repertory/models/mount.dart';
 import 'package:repertory/models/mount_list.dart';
+import 'package:repertory/types/mount_config.dart';
 import 'package:repertory/widgets/add_mount_widget.dart';
 import 'package:repertory/widgets/mount_list_widget.dart';
 import 'package:repertory/widgets/mount_settings.dart';
 
 void main() {
-  runApp(const MyApp());
+  runApp(
+    ChangeNotifierProvider(create: (_) => MountList(), child: const MyApp()),
+  );
 }
 
 class MyApp extends StatelessWidget {
@@ -85,10 +89,7 @@ class _MyHomePageState extends State<MyHomePage> {
         leading: const Icon(Icons.storage),
         title: Text(widget.title),
       ),
-      body: ChangeNotifierProvider(
-        create: (context) => MountList(),
-        child: MountListWidget(),
-      ),
+      body: MountListWidget(),
       floatingActionButton: FloatingActionButton(
         onPressed:
             _allowAdd
@@ -102,19 +103,18 @@ class _MyHomePageState extends State<MyHomePage> {
                           builder: (_, mountList, __) {
                             return AddMountWidget(
                               allowEncrypt:
-                                  !mountList.items.contains(
-                                    (item) => item.type == "encrypt",
-                                  ),
-                              mountName: _mountName,
+                                  mountList.items.firstWhereOrNull(
+                                    (MountConfig item) =>
+                                        item.type.toLowerCase() == "encrypt",
+                                  ) ==
+                                  null,
                               mountType: _mountType,
-                              onNameChanged:
-                                  (mountName) => setState(
-                                    () => _mountName = mountName ?? "",
-                                  ),
-                              onTypeChanged:
-                                  (mountType) => setState(
-                                    () => _mountType = mountType ?? "S3",
-                                  ),
+                              onNameChanged: (mountName) {
+                                _mountName = mountName ?? "";
+                              },
+                              onTypeChanged: (mountType) {
+                                _mountType = mountType ?? "S3";
+                              },
                             );
                           },
                         ),
@@ -122,10 +122,8 @@ class _MyHomePageState extends State<MyHomePage> {
                           TextButton(
                             child: const Text('Cancel'),
                             onPressed: () {
-                              setState(() {
-                                _mountType = "S3";
-                                _mountName = "";
-                              });
+                              _mountType = "S3";
+                              _mountName = "";
                               Navigator.of(context).pop();
                             },
                           ),
@@ -137,10 +135,10 @@ class _MyHomePageState extends State<MyHomePage> {
                               Provider.of<MountList>(context, listen: false)
                                   .add(_mountType, _mountName)
                                   .then((_) {
+                                    _mountType = "S3";
+                                    _mountName = "";
                                     setState(() {
                                       _allowAdd = true;
-                                      _mountType = "S3";
-                                      _mountName = "";
                                     });
                                   })
                                   .catchError((_) {

web/repertory/lib/models/mount_list.dart

@@ -13,7 +13,8 @@ class MountList with ChangeNotifier {
 
   List<MountConfig> _mountList = [];
 
-  UnmodifiableListView get items => UnmodifiableListView(_mountList);
+  UnmodifiableListView<MountConfig> get items =>
+      UnmodifiableListView<MountConfig>(_mountList);
 
   Future<void> _fetch() async {
     final response = await http.get(

web/repertory/lib/widgets/add_mount_widget.dart

@@ -1,8 +1,7 @@
 import 'package:flutter/material.dart';
 
-class AddMountWidget extends StatelessWidget {
+class AddMountWidget extends StatefulWidget {
   final bool allowEncrypt;
-  final String mountName;
   final String mountType;
   final void Function(String? newName) onNameChanged;
   final void Function(String? newType) onTypeChanged;
@@ -12,7 +11,6 @@ class AddMountWidget extends StatelessWidget {
   AddMountWidget({
     super.key,
     required this.allowEncrypt,
-    required this.mountName,
     required this.mountType,
     required this.onNameChanged,
     required this.onTypeChanged,
@@ -22,23 +20,73 @@ class AddMountWidget extends StatelessWidget {
     }
   }
 
+  @override
+  State<AddMountWidget> createState() => _AddMountWidgetState();
+}
+
+class _AddMountWidgetState extends State<AddMountWidget> {
+  String? _mountType;
+
+  @override
+  void initState() {
+    _mountType = widget.mountType;
+    super.initState();
+  }
+
   @override
   Widget build(BuildContext context) {
     return Column(
       mainAxisSize: MainAxisSize.min,
+      mainAxisAlignment: MainAxisAlignment.start,
+      crossAxisAlignment: CrossAxisAlignment.start,
       children: [
-        // DropdownButton<String>(
-        //   value: mountType,
-        //   onChanged: onTypeChanged,
-        //   items:
-        //       _items.map<DropdownMenuItem<String>>((item) {
-        //         return DropdownMenuItem<String>(value: item, child: Text(item));
-        //       }).toList(),
-        // ),
-        TextField(
-          decoration: InputDecoration(labelText: 'Name'),
-          onChanged: onNameChanged,
+        Column(
+          mainAxisAlignment: MainAxisAlignment.start,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: [
+            Text(
+              'Provider Type',
+              textAlign: TextAlign.left,
+              style: TextStyle(
+                color: Theme.of(context).colorScheme.onSurface,
+                fontWeight: FontWeight.bold,
+              ),
+            ),
+            const SizedBox(width: 10),
+            DropdownButton<String>(
+              value: _mountType,
+              onChanged: (value) {
+                setState(() {
+                  _mountType = value;
+                });
+                widget.onTypeChanged(value);
+              },
+              items:
+                  widget._items.map<DropdownMenuItem<String>>((item) {
+                    return DropdownMenuItem<String>(
+                      value: item,
+                      child: Text(item),
+                    );
+                  }).toList(),
+            ),
+          ],
         ),
+        const SizedBox(height: 10),
+        if (_mountType?.toLowerCase() != 'encrypt')
+          Text(
+            'Configuration Name',
+            textAlign: TextAlign.left,
+            style: TextStyle(
+              color: Theme.of(context).colorScheme.onSurface,
+              fontWeight: FontWeight.bold,
+            ),
+          ),
+        if (_mountType?.toLowerCase() != 'encrypt')
+          TextField(
+            autofocus: true,
+            decoration: InputDecoration(),
+            onChanged: widget.onNameChanged,
+          ),
       ],
     );
   }