Create management portal in Flutter (#40)

Reviewed-on: #40

web/repertory/.cspell/words.txt

@@ -0,0 +1,4 @@
+cupertino
+cupertinoicons
+fromargb
+onetwothree

web/repertory/.gitignore

@@ -0,0 +1,47 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.build/
+.buildlog/
+.history
+.svn/
+.swiftpm/
+migrate_working_dir/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.pub-cache/
+.pub/
+/build/
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release
+.flutter-companion
+pubspec.lock

web/repertory/.metadata

@@ -0,0 +1,30 @@
+# This file tracks properties of this Flutter project.
+# Used by Flutter tool to assess capabilities and perform upgrades etc.
+#
+# This file should be version controlled and should not be manually edited.
+
+version:
+  revision: "35c388afb57ef061d06a39b537336c87e0e3d1b1"
+  channel: "stable"
+
+project_type: app
+
+# Tracks metadata for the flutter migrate command
+migration:
+  platforms:
+    - platform: root
+      create_revision: 35c388afb57ef061d06a39b537336c87e0e3d1b1
+      base_revision: 35c388afb57ef061d06a39b537336c87e0e3d1b1
+    - platform: web
+      create_revision: 35c388afb57ef061d06a39b537336c87e0e3d1b1
+      base_revision: 35c388afb57ef061d06a39b537336c87e0e3d1b1
+
+  # User provided section
+
+  # List of Local paths (relative to this file) that should be
+  # ignored by the migrate tool.
+  #
+  # Files that are not part of the templates will be ignored by default.
+  unmanaged_files:
+    - 'lib/main.dart'
+    - 'ios/Runner.xcodeproj/project.pbxproj'

web/repertory/README.md

@@ -0,0 +1,16 @@
+# repertory
+
+A new Flutter project.
+
+## Getting Started
+
+This project is a starting point for a Flutter application.
+
+A few resources to get you started if this is your first Flutter project:
+
+- [Lab: Write your first Flutter app](https://docs.flutter.dev/get-started/codelab)
+- [Cookbook: Useful Flutter samples](https://docs.flutter.dev/cookbook)
+
+For help getting started with Flutter development, view the
+[online documentation](https://docs.flutter.dev/), which offers tutorials,
+samples, guidance on mobile development, and a full API reference.

web/repertory/analysis_options.yaml

@@ -0,0 +1,28 @@
+# This file configures the analyzer, which statically analyzes Dart code to
+# check for errors, warnings, and lints.
+#
+# The issues identified by the analyzer are surfaced in the UI of Dart-enabled
+# IDEs (https://dart.dev/tools#ides-and-editors). The analyzer can also be
+# invoked from the command line by running `flutter analyze`.
+
+# The following line activates a set of recommended lints for Flutter apps,
+# packages, and plugins designed to encourage good coding practices.
+include: package:flutter_lints/flutter.yaml
+
+linter:
+  # The lint rules applied to this project can be customized in the
+  # section below to disable rules from the `package:flutter_lints/flutter.yaml`
+  # included above or to enable additional rules. A list of all available lints
+  # and their documentation is published at https://dart.dev/lints.
+  #
+  # Instead of disabling a lint rule for the entire project in the
+  # section below, it can also be suppressed for a single line of code
+  # or a specific dart file by using the `// ignore: name_of_lint` and
+  # `// ignore_for_file: name_of_lint` syntax on the line or in the file
+  # producing the lint.
+  rules:
+    # avoid_print: false  # Uncomment to disable the `avoid_print` rule
+    # prefer_single_quotes: true  # Uncomment to enable the `prefer_single_quotes` rule
+
+# Additional information about this file can be found at
+# https://dart.dev/guides/language/analysis-options

web/repertory/lib/constants.dart

@@ -0,0 +1 @@
+const String appTitle = "Repertory Management Portal";

web/repertory/lib/errors/duplicate_mount_exception.dart

@@ -0,0 +1,6 @@
+class DuplicateMountException implements Exception {
+  final String _name;
+  const DuplicateMountException({required name}) : _name = name, super();
+
+  String get name => _name;
+}

web/repertory/lib/helpers.dart

@@ -0,0 +1,18 @@
+String formatMountName(String type, String name) {
+  if (type == "remote") {
+    return name.replaceAll("_", ":");
+  }
+  return name;
+}
+
+String initialCaps(String txt) {
+  if (txt.isEmpty) {
+    return txt;
+  }
+
+  if (txt.length == 1) {
+    return txt[0].toUpperCase();
+  }
+
+  return txt[0].toUpperCase() + txt.substring(1).toLowerCase();
+}

web/repertory/lib/main.dart

@@ -0,0 +1,94 @@
+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/widgets/mount_list_widget.dart';
+import 'package:repertory/widgets/mount_settings.dart';
+
+void main() {
+  runApp(const MyApp());
+}
+
+class MyApp extends StatelessWidget {
+  const MyApp({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      title: constants.appTitle,
+      theme: ThemeData(
+        brightness: Brightness.light,
+        colorScheme: ColorScheme.fromSeed(
+          seedColor: Colors.deepOrange,
+          brightness: Brightness.light,
+        ),
+      ),
+      themeMode: ThemeMode.dark,
+      darkTheme: ThemeData(
+        useMaterial3: true,
+        brightness: Brightness.dark,
+        colorScheme: ColorScheme.fromSeed(
+          brightness: Brightness.dark,
+          onSurface: Colors.white70,
+          seedColor: Colors.deepOrange,
+          surface: Color.fromARGB(255, 32, 33, 36),
+          surfaceContainerLow: Color.fromARGB(255, 41, 42, 45),
+        ),
+      ),
+      initialRoute: '/',
+      routes: {'/': (context) => const MyHomePage(title: constants.appTitle)},
+      onGenerateRoute: (settings) {
+        if (settings.name != '/settings') {
+          return null;
+        }
+
+        final mount = settings.arguments as Mount;
+        return MaterialPageRoute(
+          builder: (context) {
+            return Scaffold(
+              appBar: AppBar(
+                backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+                title: Text(
+                  '${initialCaps(mount.type)} [${formatMountName(mount.type, mount.name)}] Settings',
+                ),
+              ),
+              body: MountSettingsWidget(mount: mount),
+            );
+          },
+        );
+      },
+    );
+  }
+}
+
+class MyHomePage extends StatefulWidget {
+  final String title;
+  const MyHomePage({super.key, required this.title});
+
+  @override
+  State<MyHomePage> createState() => _MyHomePageState();
+}
+
+class _MyHomePageState extends State<MyHomePage> {
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
+        leading: const Icon(Icons.storage),
+        title: Text(widget.title),
+      ),
+      body: ChangeNotifierProvider(
+        create: (context) => MountList(),
+        child: MountListWidget(),
+      ),
+      floatingActionButton: FloatingActionButton(
+        onPressed: () {},
+        tooltip: 'Add',
+        child: const Icon(Icons.add),
+      ),
+    );
+  }
+}

web/repertory/lib/models/mount.dart

@@ -0,0 +1,83 @@
+import 'dart:convert';
+
+import 'package:flutter/material.dart';
+import 'package:http/http.dart' as http;
+import 'package:repertory/types/mount_config.dart';
+
+class Mount with ChangeNotifier {
+  final MountConfig mountConfig;
+  Mount(this.mountConfig) {
+    refresh();
+  }
+
+  String get name => mountConfig.name;
+  String get path => mountConfig.path;
+  IconData get state => mountConfig.state;
+  String get type => mountConfig.type;
+
+  Future<void> _fetch() async {
+    final response = await http.get(
+      Uri.parse(
+        Uri.encodeFull('${Uri.base.origin}/api/v1/mount?name=$name&type=$type'),
+      ),
+    );
+
+    if (response.statusCode != 200) {
+      return;
+    }
+
+    mountConfig.updateSettings(jsonDecode(response.body));
+
+    notifyListeners();
+  }
+
+  Future<void> _fetchStatus() async {
+    final response = await http.get(
+      Uri.parse(
+        Uri.encodeFull(
+          '${Uri.base.origin}/api/v1/mount_status?name=$name&type=$type',
+        ),
+      ),
+    );
+
+    if (response.statusCode != 200) {
+      return;
+    }
+
+    mountConfig.updateStatus(jsonDecode(response.body));
+    notifyListeners();
+  }
+
+  Future<void> mount(bool unmount, {String? location}) async {
+    await http.post(
+      Uri.parse(
+        Uri.encodeFull(
+          '${Uri.base.origin}/api/v1/mount?unmount=$unmount&name=$name&type=$type&location=$location',
+        ),
+      ),
+    );
+
+    return refresh();
+  }
+
+  Future<void> refresh() async {
+    await _fetch();
+    return _fetchStatus();
+  }
+
+  Future<void> setValue(String key, String value) async {
+    await http.put(
+      Uri.parse(
+        Uri.encodeFull(
+          '${Uri.base.origin}/api/v1/set_value_by_name?name=$name&type=$type&key=$key&value=$value',
+        ),
+      ),
+    );
+
+    return refresh();
+  }
+
+  Future<String?> getMountLocation() async {
+    return "~/mnt/encrypt";
+  }
+}

web/repertory/lib/models/mount_list.dart

@@ -0,0 +1,67 @@
+import 'dart:convert';
+
+import 'package:collection/collection.dart';
+import 'package:flutter/foundation.dart';
+import 'package:http/http.dart' as http;
+import 'package:repertory/errors/duplicate_mount_exception.dart';
+import 'package:repertory/types/mount_config.dart';
+
+class MountList with ChangeNotifier {
+  MountList() {
+    _fetch();
+  }
+
+  List<MountConfig> _mountList = [];
+
+  UnmodifiableListView get items => UnmodifiableListView(_mountList);
+
+  Future<void> _fetch() async {
+    final response = await http.get(
+      Uri.parse('${Uri.base.origin}/api/v1/mount_list'),
+    );
+
+    if (response.statusCode == 200) {
+      List<MountConfig> nextList = [];
+
+      jsonDecode(response.body).forEach((key, value) {
+        nextList.addAll(
+          value.map((name) => MountConfig.fromJson(key, name)).toList(),
+        );
+      });
+      _sort(nextList);
+      _mountList = nextList;
+
+      notifyListeners();
+      return;
+    }
+  }
+
+  void _sort(list) {
+    list.sort((a, b) {
+      final res = a.type.compareTo(b.type);
+      if (res != 0) {
+        return res;
+      }
+
+      return a.name.compareTo(b.name);
+    });
+  }
+
+  void add(MountConfig config) {
+    var item = _mountList.firstWhereOrNull((cfg) => cfg.name == config.name);
+    if (item != null) {
+      throw DuplicateMountException(name: config.name);
+    }
+
+    _mountList.add(config);
+    _sort(_mountList);
+
+    notifyListeners();
+  }
+
+  void remove(String name) {
+    _mountList.removeWhere((item) => item.name == name);
+
+    notifyListeners();
+  }
+}

web/repertory/lib/types/mount_config.dart

@@ -0,0 +1,31 @@
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+
+class MountConfig {
+  final String _name;
+  String _path = "";
+  Map<String, dynamic> _settings = {};
+  IconData _state = Icons.toggle_off;
+  final String _type;
+  MountConfig({required name, required type}) : _name = name, _type = type;
+
+  String get name => _name;
+  String get path => _path;
+  UnmodifiableMapView<String, dynamic> get settings =>
+      UnmodifiableMapView<String, dynamic>(_settings);
+  IconData get state => _state;
+  String get type => _type;
+
+  factory MountConfig.fromJson(String type, String name) {
+    return MountConfig(name: name, type: type);
+  }
+
+  void updateSettings(Map<String, dynamic> settings) {
+    _settings = settings;
+  }
+
+  void updateStatus(Map<String, dynamic> status) {
+    _path = status["Location"] as String;
+    _state = status["Active"] as bool ? Icons.toggle_on : Icons.toggle_off;
+  }
+}

web/repertory/lib/widgets/mount_list_widget.dart

@@ -0,0 +1,31 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:repertory/models/mount.dart';
+import 'package:repertory/models/mount_list.dart';
+import 'package:repertory/widgets/mount_widget.dart';
+
+class MountListWidget extends StatefulWidget {
+  const MountListWidget({super.key});
+
+  @override
+  State<MountListWidget> createState() => _MountListWidgetState();
+}
+
+class _MountListWidgetState extends State<MountListWidget> {
+  @override
+  Widget build(BuildContext context) {
+    return Consumer<MountList>(
+      builder: (context, mountList, widget) {
+        return ListView.builder(
+          itemBuilder: (context, idx) {
+            return ChangeNotifierProvider(
+              create: (context) => Mount(mountList.items[idx]),
+              child: const MountWidget(),
+            );
+          },
+          itemCount: mountList.items.length,
+        );
+      },
+    );
+  }
+}

web/repertory/lib/widgets/mount_settings.dart

@@ -0,0 +1,568 @@
+import 'dart:convert';
+
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:repertory/models/mount.dart';
+import 'package:settings_ui/settings_ui.dart';
+
+class MountSettingsWidget extends StatefulWidget {
+  final Mount mount;
+  const MountSettingsWidget({super.key, required this.mount});
+
+  @override
+  State<MountSettingsWidget> createState() => _MountSettingsWidgetState();
+}
+
+class _MountSettingsWidgetState extends State<MountSettingsWidget> {
+  Map<String, dynamic> _settings = {};
+
+  void _addBooleanSetting(list, root, key, value) {
+    list.add(
+      SettingsTile.switchTile(
+        leading: Icon(Icons.quiz),
+        title: Text(key),
+        initialValue: (value as bool),
+        onPressed: (_) {
+          setState(() {
+            root[key] = !value;
+          });
+        },
+        onToggle: (bool nextValue) {
+          setState(() {
+            root[key] = nextValue;
+          });
+        },
+      ),
+    );
+  }
+
+  void _addIntSetting(list, root, key, value) {
+    list.add(
+      SettingsTile.navigation(
+        leading: Icon(Icons.onetwothree),
+        title: Text(key),
+        value: Text(value.toString()),
+        onPressed: (_) {
+          String updatedValue = value.toString();
+          showDialog(
+            context: context,
+            builder: (context) {
+              return AlertDialog(
+                actions: [
+                  TextButton(
+                    child: Text('Cancel'),
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                    },
+                  ),
+                  TextButton(
+                    child: Text('OK'),
+                    onPressed: () {
+                      setState(() {
+                        root[key] = int.parse(updatedValue);
+                      });
+                      Navigator.of(context).pop();
+                    },
+                  ),
+                ],
+                content: TextField(
+                  autofocus: true,
+                  controller: TextEditingController(text: updatedValue),
+                  inputFormatters: [FilteringTextInputFormatter.digitsOnly],
+                  keyboardType: TextInputType.number,
+                  onChanged: (nextValue) {
+                    updatedValue = nextValue;
+                  },
+                ),
+                title: Text(key),
+              );
+            },
+          );
+        },
+      ),
+    );
+  }
+
+  void _addIntListSetting(
+    list,
+    root,
+    key,
+    value,
+    List<String> valueList,
+    defaultValue,
+    icon,
+  ) {
+    list.add(
+      SettingsTile.navigation(
+        title: Text(key),
+        leading: Icon(icon),
+        value: DropdownButton<String>(
+          value: value.toString(),
+          onChanged: (newValue) {
+            setState(() {
+              root[key] = int.parse(newValue ?? defaultValue.toString());
+            });
+          },
+          items:
+              valueList.map<DropdownMenuItem<String>>((item) {
+                return DropdownMenuItem<String>(value: item, child: Text(item));
+              }).toList(),
+        ),
+      ),
+    );
+  }
+
+  void _addListSetting(list, root, key, value, List<String> valueList, icon) {
+    list.add(
+      SettingsTile.navigation(
+        title: Text(key),
+        leading: Icon(icon),
+        value: DropdownButton<String>(
+          value: value,
+          onChanged: (newValue) {
+            setState(() {
+              root[key] = newValue;
+            });
+          },
+          items:
+              valueList.map<DropdownMenuItem<String>>((item) {
+                return DropdownMenuItem<String>(value: item, child: Text(item));
+              }).toList(),
+        ),
+      ),
+    );
+  }
+
+  void _addPasswordSetting(list, root, key, value) {
+    list.add(
+      SettingsTile.navigation(
+        leading: Icon(Icons.password),
+        title: Text(key),
+        value: Text('*' * (value as String).length),
+      ),
+    );
+  }
+
+  void _addStringSetting(list, root, key, value, icon) {
+    list.add(
+      SettingsTile.navigation(
+        leading: Icon(icon),
+        title: Text(key),
+        value: Text(value),
+        onPressed: (_) {
+          String updatedValue = value;
+          showDialog(
+            context: context,
+            builder: (context) {
+              return AlertDialog(
+                actions: [
+                  TextButton(
+                    child: Text('Cancel'),
+                    onPressed: () {
+                      Navigator.of(context).pop();
+                    },
+                  ),
+                  TextButton(
+                    child: Text('OK'),
+                    onPressed: () {
+                      setState(() {
+                        root[key] = updatedValue;
+                      });
+                      Navigator.of(context).pop();
+                    },
+                  ),
+                ],
+                content: TextField(
+                  autofocus: true,
+                  controller: TextEditingController(text: updatedValue),
+                  onChanged: (value) {
+                    updatedValue = value;
+                  },
+                ),
+                title: Text(key),
+              );
+            },
+          );
+        },
+      ),
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    List<SettingsTile> commonSettings = [];
+    List<SettingsTile> encryptConfigSettings = [];
+    List<SettingsTile> hostConfigSettings = [];
+    List<SettingsTile> remoteConfigSettings = [];
+    List<SettingsTile> remoteMountSettings = [];
+    List<SettingsTile> s3ConfigSettings = [];
+    List<SettingsTile> siaConfigSettings = [];
+
+    _settings.forEach((key, value) {
+      if (key == "ApiAuth") {
+        _addPasswordSetting(commonSettings, _settings, key, value);
+      } else if (key == "ApiPort") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "ApiUser") {
+        _addStringSetting(commonSettings, _settings, key, value, Icons.person);
+      } else if (key == "DatabaseType") {
+        _addListSetting(commonSettings, _settings, key, value, [
+          "rocksdb",
+          "sqlite",
+        ], Icons.dataset);
+      } else if (key == "DownloadTimeoutSeconds") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "EnableDownloadTimeout") {
+        _addBooleanSetting(commonSettings, _settings, key, value);
+      } else if (key == "EnableDriveEvents") {
+        _addBooleanSetting(commonSettings, _settings, key, value);
+      } else if (key == "EventLevel") {
+        _addListSetting(commonSettings, _settings, key, value, [
+          "critical",
+          "error",
+          "warn",
+          "info",
+          "debug",
+          "trace",
+        ], Icons.event);
+      } else if (key == "EvictionDelayMinutes") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "EvictionUseAccessedTime") {
+        _addBooleanSetting(commonSettings, _settings, key, value);
+      } else if (key == "MaxCacheSizeBytes") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "MaxUploadCount") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "OnlineCheckRetrySeconds") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "PreferredDownloadType") {
+        _addListSetting(commonSettings, _settings, key, value, [
+          "default",
+          "direct",
+          "ring_buffer",
+        ], Icons.download);
+      } else if (key == "RetryReadCount") {
+        _addIntSetting(commonSettings, _settings, key, value);
+      } else if (key == "RingBufferFileSize") {
+        _addIntListSetting(
+          commonSettings,
+          _settings,
+          key,
+          value,
+          ["128", "256", "512", "1024", "2048"],
+          512,
+          Icons.animation,
+        );
+      } else if (key == "EncryptConfig") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "EncryptionToken") {
+            _addPasswordSetting(
+              encryptConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "Path") {
+            _addStringSetting(
+              encryptConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.folder,
+            );
+          }
+        });
+      } else if (key == "HostConfig") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "AgentString") {
+            _addStringSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.support_agent,
+            );
+          } else if (subKey == "ApiPassword") {
+            _addPasswordSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "ApiPort") {
+            _addIntSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "ApiUser") {
+            _addStringSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.person,
+            );
+          } else if (subKey == "HostNameOrIp") {
+            _addStringSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.computer,
+            );
+          } else if (subKey == "Path") {
+            _addStringSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.route,
+            );
+          } else if (subKey == "Protocol") {
+            _addListSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              ["http", "https"],
+              Icons.http,
+            );
+          } else if (subKey == "TimeoutMs") {
+            _addIntSetting(
+              hostConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          }
+        });
+      } else if (key == "RemoteConfig") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "ApiPort") {
+            _addIntSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "EncryptionToken") {
+            _addPasswordSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "HostNameOrIp") {
+            _addStringSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.computer,
+            );
+          } else if (subKey == "MaxConnections") {
+            _addIntSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "ReceiveTimeoutMs") {
+            _addIntSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "SendTimeoutMs") {
+            _addIntSetting(
+              remoteConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          }
+        });
+      } else if (key == "RemoteMount") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "Enable") {
+            List<SettingsTile> tempSettings = [];
+            _addBooleanSetting(tempSettings, _settings[key], subKey, subValue);
+            remoteMountSettings.insertAll(0, tempSettings);
+          } else if (subKey == "ApiPort") {
+            _addIntSetting(
+              remoteMountSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "ClientPoolSize") {
+            _addIntSetting(
+              remoteMountSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "EncryptionToken") {
+            _addPasswordSetting(
+              remoteMountSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          }
+        });
+      } else if (key == "S3Config") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "AccessKey") {
+            _addPasswordSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "Bucket") {
+            _addStringSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.folder,
+            );
+          } else if (subKey == "EncryptionToken") {
+            _addPasswordSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "Region") {
+            _addStringSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.map,
+            );
+          } else if (subKey == "SecretKey") {
+            _addPasswordSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "TimeoutMs") {
+            _addIntSetting(s3ConfigSettings, _settings[key], subKey, subValue);
+          } else if (subKey == "URL") {
+            _addStringSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.http,
+            );
+          } else if (subKey == "UsePathStyle") {
+            _addBooleanSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          } else if (subKey == "UseRegionInURL") {
+            _addBooleanSetting(
+              s3ConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+            );
+          }
+        });
+      } else if (key == "SiaConfig") {
+        value.forEach((subKey, subValue) {
+          if (subKey == "Bucket") {
+            _addStringSetting(
+              siaConfigSettings,
+              _settings[key],
+              subKey,
+              subValue,
+              Icons.folder,
+            );
+          }
+        });
+      }
+    });
+
+    return SettingsList(
+      shrinkWrap: false,
+      sections: [
+        if (encryptConfigSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('Encrypt Config'),
+            tiles: encryptConfigSettings,
+          ),
+        if (hostConfigSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('Host Config'),
+            tiles: hostConfigSettings,
+          ),
+        if (remoteConfigSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('Remote Config'),
+            tiles: remoteConfigSettings,
+          ),
+        if (s3ConfigSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('S3 Config'),
+            tiles: s3ConfigSettings,
+          ),
+        if (siaConfigSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('Sia Config'),
+            tiles: siaConfigSettings,
+          ),
+        if (remoteMountSettings.isNotEmpty)
+          SettingsSection(
+            title: const Text('Remote Mount'),
+            tiles:
+                _settings["RemoteMount"]["Enable"] as bool
+                    ? remoteMountSettings
+                    : [remoteMountSettings[0]],
+          ),
+        SettingsSection(title: const Text('Settings'), tiles: commonSettings),
+      ],
+    );
+  }
+
+  @override
+  void dispose() {
+    var settings = widget.mount.mountConfig.settings;
+    if (!DeepCollectionEquality().equals(_settings, settings)) {
+      _settings.forEach((key, value) {
+        if (!DeepCollectionEquality().equals(settings[key], value)) {
+          if (value is Map<String, dynamic>) {
+            value.forEach((subKey, subValue) {
+              if (!DeepCollectionEquality().equals(
+                settings[key][subKey],
+                subValue,
+              )) {
+                widget.mount.setValue('$key.$subKey', subValue.toString());
+              }
+            });
+          } else {
+            widget.mount.setValue(key, value.toString());
+          }
+        }
+      });
+    }
+    super.dispose();
+  }
+
+  @override
+  void initState() {
+    _settings = jsonDecode(jsonEncode(widget.mount.mountConfig.settings));
+    super.initState();
+  }
+}

web/repertory/lib/widgets/mount_widget.dart

@@ -0,0 +1,112 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:repertory/helpers.dart';
+import 'package:repertory/models/mount.dart';
+
+class MountWidget extends StatefulWidget {
+  const MountWidget({super.key});
+
+  @override
+  State<MountWidget> createState() => _MountWidgetState();
+}
+
+class _MountWidgetState extends State<MountWidget> {
+  Timer? _timer;
+  bool _enabled = true;
+
+  @override
+  Widget build(BuildContext context) {
+    return Card(
+      child: Consumer<Mount>(
+        builder: (context, mount, widget) {
+          final textColor = Theme.of(context).colorScheme.onSurface;
+          final subTextColor =
+              Theme.of(context).brightness == Brightness.dark
+                  ? Colors.white38
+                  : Colors.black87;
+
+          final isActive = mount.state == Icons.toggle_on;
+          final nameText = SelectableText(
+            formatMountName(mount.type, mount.name),
+            style: TextStyle(color: subTextColor),
+          );
+
+          return ListTile(
+            isThreeLine: true,
+            leading: IconButton(
+              icon: Icon(Icons.settings, color: textColor),
+              onPressed: () {
+                Navigator.pushNamed(context, '/settings', arguments: mount);
+              },
+            ),
+            subtitle: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                nameText,
+                SelectableText(
+                  mount.path,
+                  style: TextStyle(color: subTextColor),
+                ),
+              ],
+            ),
+            title: SelectableText(
+              initialCaps(mount.type),
+              style: TextStyle(color: textColor, fontWeight: FontWeight.bold),
+            ),
+            trailing: IconButton(
+              icon: Icon(
+                mount.state,
+                color:
+                    isActive ? Color.fromARGB(255, 163, 96, 76) : subTextColor,
+              ),
+              onPressed:
+                  _enabled
+                      ? () async {
+                        setState(() {
+                          _enabled = false;
+                        });
+
+                        String? location = mount.path;
+                        if (!isActive && mount.path.isEmpty) {
+                          location = await mount.getMountLocation();
+                          if (location == null) {}
+                        }
+
+                        mount
+                            .mount(isActive, location: location)
+                            .then((_) {
+                              setState(() {
+                                _enabled = true;
+                              });
+                            })
+                            .catchError((_) {
+                              setState(() {
+                                _enabled = true;
+                              });
+                            });
+                      }
+                      : null,
+            ),
+          );
+        },
+      ),
+    );
+  }
+
+  @override
+  void dispose() {
+    _timer?.cancel();
+    _timer = null;
+    super.dispose();
+  }
+
+  @override
+  void initState() {
+    super.initState();
+    _timer = Timer.periodic(const Duration(seconds: 5), (_) {
+      Provider.of<Mount>(context, listen: false).refresh();
+    });
+  }
+}

web/repertory/pubspec.yaml

@@ -0,0 +1,93 @@
+name: repertory
+description: "Repertory Management Portal"
+# The following line prevents the package from being accidentally published to
+# pub.dev using `flutter pub publish`. This is preferred for private packages.
+publish_to: 'none' # Remove this line if you wish to publish to pub.dev
+
+# The following defines the version and build number for your application.
+# A version number is three numbers separated by dots, like 1.2.43
+# followed by an optional build number separated by a +.
+# Both the version and the builder number may be overridden in flutter
+# build by specifying --build-name and --build-number, respectively.
+# In Android, build-name is used as versionName while build-number used as versionCode.
+# Read more about Android versioning at https://developer.android.com/studio/publish/versioning
+# In iOS, build-name is used as CFBundleShortVersionString while build-number is used as CFBundleVersion.
+# Read more about iOS versioning at
+# https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
+# In Windows, build-name is used as the major, minor, and patch parts
+# of the product and file versions while build-number is used as the build suffix.
+version: 1.0.0+1
+
+environment:
+  sdk: ^3.7.0
+
+# Dependencies specify other packages that your package needs in order to work.
+# To automatically upgrade your package dependencies to the latest versions
+# consider running `flutter pub upgrade --major-versions`. Alternatively,
+# dependencies can be manually updated by changing the version numbers below to
+# the latest version available on pub.dev. To see which dependencies have newer
+# versions available, run `flutter pub outdated`.
+dependencies:
+  flutter:
+    sdk: flutter
+
+  # The following adds the Cupertino Icons font to your application.
+  # Use with the CupertinoIcons class for iOS style icons.
+  cupertino_icons: ^1.0.8
+  collection: ^1.19.1
+  http: ^1.3.0
+  provider: ^6.1.2
+  settings_ui: ^2.0.2
+
+dev_dependencies:
+  flutter_test:
+    sdk: flutter
+
+  # The "flutter_lints" package below contains a set of recommended lints to
+  # encourage good coding practices. The lint set provided by the package is
+  # activated in the `analysis_options.yaml` file located at the root of your
+  # package. See that file for information about deactivating specific lint
+  # rules and activating additional ones.
+  flutter_lints: ^5.0.0
+
+# For information on the generic Dart part of this file, see the
+# following page: https://dart.dev/tools/pub/pubspec
+
+# The following section is specific to Flutter packages.
+flutter:
+
+  # The following line ensures that the Material Icons font is
+  # included with your application, so that you can use the icons in
+  # the material Icons class.
+  uses-material-design: true
+
+  # To add assets to your application, add an assets section, like this:
+  # assets:
+  #   - images/a_dot_burr.jpeg
+  #   - images/a_dot_ham.jpeg
+
+  # An image asset can refer to one or more resolution-specific "variants", see
+  # https://flutter.dev/to/resolution-aware-images
+
+  # For details regarding adding assets from package dependencies, see
+  # https://flutter.dev/to/asset-from-package
+
+  # To add custom fonts to your application, add a fonts section here,
+  # in this "flutter" section. Each entry in this list should have a
+  # "family" key with the font family name, and a "fonts" key with a
+  # list giving the asset and other descriptors for the font. For
+  # example:
+  # fonts:
+  #   - family: Schyler
+  #     fonts:
+  #       - asset: fonts/Schyler-Regular.ttf
+  #       - asset: fonts/Schyler-Italic.ttf
+  #         style: italic
+  #   - family: Trajan Pro
+  #     fonts:
+  #       - asset: fonts/TrajanPro.ttf
+  #       - asset: fonts/TrajanPro_Bold.ttf
+  #         weight: 700
+  #
+  # For details regarding fonts from package dependencies,
+  # see https://flutter.dev/to/font-from-package

web/repertory/test/widget_test.dart

@@ -0,0 +1,30 @@
+// This is a basic Flutter widget test.
+//
+// To perform an interaction with a widget in your test, use the WidgetTester
+// utility in the flutter_test package. For example, you can send tap and scroll
+// gestures. You can also use WidgetTester to find child widgets in the widget
+// tree, read text, and verify that the values of widget properties are correct.
+
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+import 'package:repertory/main.dart';
+
+void main() {
+  testWidgets('Counter increments smoke test', (WidgetTester tester) async {
+    // Build our app and trigger a frame.
+    await tester.pumpWidget(const MyApp());
+
+    // Verify that our counter starts at 0.
+    expect(find.text('0'), findsOneWidget);
+    expect(find.text('1'), findsNothing);
+
+    // Tap the '+' icon and trigger a frame.
+    await tester.tap(find.byIcon(Icons.add));
+    await tester.pump();
+
+    // Verify that our counter has incremented.
+    expect(find.text('0'), findsNothing);
+    expect(find.text('1'), findsOneWidget);
+  });
+}

web/repertory/web/index.html

@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <!--
+    If you are serving your web app in a path other than the root, change the
+    href value below to reflect the base path you are serving from.
+
+    The path provided below has to start and end with a slash "/" in order for
+    it to work correctly.
+
+    For more details:
+    * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
+
+    This is a placeholder for base href that will be replaced by the value of
+    the `--base-href` argument provided to `flutter build`.
+  -->
+  <base href="$FLUTTER_BASE_HREF">
+
+  <meta charset="UTF-8">
+  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
+  <meta name="description" content="A new Flutter project.">
+
+  <!-- iOS meta tags & icons -->
+  <meta name="mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+  <meta name="apple-mobile-web-app-title" content="repertory">
+  <link rel="apple-touch-icon" href="icons/Icon-192.png">
+
+  <!-- Favicon -->
+  <link rel="icon" type="image/png" href="favicon.png"/>
+
+  <title>repertory</title>
+  <link rel="manifest" href="manifest.json">
+</head>
+<body>
+  <script src="flutter_bootstrap.js" async></script>
+</body>
+</html>

web/repertory/web/manifest.json

@@ -0,0 +1,35 @@
+{
+    "name": "repertory",
+    "short_name": "repertory",
+    "start_url": ".",
+    "display": "standalone",
+    "background_color": "#0175C2",
+    "theme_color": "#0175C2",
+    "description": "A new Flutter project.",
+    "orientation": "portrait-primary",
+    "prefer_related_applications": false,
+    "icons": [
+        {
+            "src": "icons/Icon-192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        },
+        {
+            "src": "icons/Icon-maskable-192.png",
+            "sizes": "192x192",
+            "type": "image/png",
+            "purpose": "maskable"
+        },
+        {
+            "src": "icons/Icon-maskable-512.png",
+            "sizes": "512x512",
+            "type": "image/png",
+            "purpose": "maskable"
+        }
+    ]
+}