refactor ui

web/repertory/lib/helpers.dart

@@ -10,6 +10,7 @@ import 'package:provider/provider.dart';
 import 'package:repertory/constants.dart' as constants;
 import 'package:repertory/models/auth.dart';
 import 'package:repertory/models/settings.dart';
+import 'package:repertory/widgets/app_dropdown.dart';
 import 'package:repertory/widgets/aurora_sweep.dart';
 import 'package:sodium_libs/sodium_libs.dart' show SecureKey, StringX;
 
@@ -414,16 +415,12 @@ Future<String?> editMountLocation(
                   controller: controller,
                   onChanged: (value) => setState(() => currentLocation = value),
                 )
-              : DropdownButton<String>(
+              : AppDropdownFormField<String>(
-                  hint: const Text("Select drive"),
+                  labelText: "Select drive",
+                  labelOf: (s) => s,
                   value: currentLocation,
                   onChanged: (value) => setState(() => currentLocation = value),
-                  items: available.map<DropdownMenuItem<String>>((item) {
+                  values: available.toList(),
-                    return DropdownMenuItem<String>(
-                      value: item,
-                      child: Text(item),
-                    );
-                  }).toList(),
                 ),
           title: const Text('Mount Location', textAlign: TextAlign.center),
         );
@@ -432,8 +429,10 @@ Future<String?> editMountLocation(
   );
 }
 
-Scaffold createCommonScaffold(Widget child, {Widget? floatingActionButton}) =>
+Scaffold createCommonScaffold(
-    Scaffold(
+  List<Widget> children, {
+  Widget? floatingActionButton,
+}) => Scaffold(
   body: SafeArea(
     child: Stack(
       children: [
@@ -458,21 +457,21 @@ Scaffold createCommonScaffold(Widget child, {Widget? floatingActionButton}) =>
             child: Container(color: Colors.black.withValues(alpha: 0.06)),
           ),
         ),
-            child,
+        ...children,
       ],
     ),
   ),
   floatingActionButton: floatingActionButton,
-    );
+);
 
 InputDecoration createCommonDecoration(
   ColorScheme colorScheme,
-  String label,
+  String label, {
-  IconData icon, {
+  IconData? icon,
   bool filled = true,
 }) => InputDecoration(
   labelText: label,
-  prefixIcon: Icon(icon),
+  prefixIcon: icon == null ? null : Icon(icon),
   filled: filled,
   fillColor: colorScheme.primary.withValues(alpha: constants.primaryAlpha),
   border: OutlineInputBorder(

web/repertory/lib/screens/add_mount_screen.dart

@@ -10,6 +10,7 @@ import 'package:repertory/models/auth.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/app_dropdown.dart';
 import 'package:repertory/widgets/mount_settings.dart';
 
 class AddMountScreen extends StatefulWidget {
@@ -44,7 +45,7 @@ class _AddMountScreenState extends State<AddMountScreen> {
     final scheme = Theme.of(context).colorScheme;
     final textTheme = Theme.of(context).textTheme;
 
-    return createCommonScaffold(
+    return createCommonScaffold([
       Padding(
         padding: const EdgeInsets.all(constants.padding),
         child: Column(
@@ -128,41 +129,21 @@ class _AddMountScreenState extends State<AddMountScreen> {
               ],
             ),
             const SizedBox(height: constants.padding),
-            UnconstrainedBox(
+            AppDropdownFormField<String>(
-              alignment: Alignment.centerLeft,
+              labelText: 'Provider Type',
-              child: IntrinsicWidth(
+              prefixIcon: Icons.extension,
-                stepWidth: 250.0,
+              values: constants.providerTypeList,
-                child: DropdownButtonFormField<String>(
+              value: _mountType.isEmpty ? null : _mountType,
-                  initialValue: _mountType.isEmpty ? null : _mountType,
+              labelOf: (s) => s,
-                  isExpanded: false,
-                  decoration: createCommonDecoration(
-                    scheme,
-                    "Provider Type",
-                    Icons.storage,
-                  ),
-                  dropdownColor: scheme.primary.withValues(alpha: 0.8),
-                  style: textTheme.bodyMedium?.copyWith(
-                    color: scheme.onSurface.withValues(alpha: 0.96),
-                  ),
-                  items: constants.providerTypeList.map((item) {
-                    return DropdownMenuItem<String>(
-                      value: item,
-                      child: Text(
-                        item,
-                        style: textTheme.bodyMedium?.copyWith(
-                          color: scheme.onSurface.withValues(alpha: 0.96),
-                        ),
-                      ),
-                    );
-                  }).toList(),
               onChanged: (mountType) {
                 _handleChange(
                   Provider.of<Auth>(context, listen: false),
                   mountType ?? '',
                 );
               },
-                ),
+              constrainToIntrinsic: true,
-              ),
+              widthMultiplier: 2.0,
+              isExpanded: false,
             ),
             if (_mountType.isNotEmpty && _mountType != 'Remote') ...[
               const SizedBox(height: constants.padding),
@@ -180,7 +161,7 @@ class _AddMountScreenState extends State<AddMountScreen> {
                 decoration: createCommonDecoration(
                   scheme,
                   'Configuration Name',
-                  Icons.drive_file_rename_outline,
+                  icon: Icons.drive_file_rename_outline,
                 ).copyWith(hintText: 'Enter a unique name'),
               ),
             ],
@@ -324,7 +305,7 @@ class _AddMountScreenState extends State<AddMountScreen> {
           ],
         ),
       ),
-    );
+    ]);
   }
 
   void _handleChange(Auth auth, String mountType) {

web/repertory/lib/screens/auth_screen.dart

@@ -233,7 +233,7 @@ class _AuthScreenState extends State<AuthScreen> {
                                     decoration: createCommonDecoration(
                                       scheme,
                                       'Username',
-                                      Icons.person,
+                                      icon: Icons.person,
                                     ),
                                     validator: (v) {
                                       if (v == null || v.trim().isEmpty) {
@@ -255,7 +255,7 @@ class _AuthScreenState extends State<AuthScreen> {
                                         createCommonDecoration(
                                           scheme,
                                           'Password',
-                                          Icons.lock,
+                                          icon: Icons.lock,
                                         ).copyWith(
                                           suffixIcon: IconButton(
                                             tooltip: _obscure

web/repertory/lib/screens/edit_mount_screen.dart

@@ -27,7 +27,7 @@ class _EditMountScreenState extends State<EditMountScreen> {
     final scheme = Theme.of(context).colorScheme;
     final textTheme = Theme.of(context).textTheme;
 
-    return createCommonScaffold(
+    return createCommonScaffold([
       Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
@@ -215,7 +215,7 @@ class _EditMountScreenState extends State<EditMountScreen> {
           const SizedBox(height: constants.padding),
         ],
       ),
-    );
+    ]);
   }
 
   @override

web/repertory/lib/screens/edit_settings_screen.dart

@@ -25,7 +25,7 @@ class _EditSettingsScreenState extends State<EditSettingsScreen> {
     final scheme = Theme.of(context).colorScheme;
     final textTheme = Theme.of(context).textTheme;
 
-    return createCommonScaffold(
+    return createCommonScaffold([
       Column(
         crossAxisAlignment: CrossAxisAlignment.stretch,
         children: [
@@ -174,7 +174,7 @@ class _EditSettingsScreenState extends State<EditSettingsScreen> {
           const SizedBox(height: constants.padding),
         ],
       ),
-    );
+    ]);
   }
 
   Future<Map<String, dynamic>> _grabSettings() async {

web/repertory/lib/screens/home_screen.dart

@@ -24,12 +24,15 @@ class _HomeScreeState extends State<HomeScreen> {
     final textTheme = Theme.of(context).textTheme;
 
     return createCommonScaffold(
+      [
         Column(
           crossAxisAlignment: CrossAxisAlignment.stretch,
           children: [
             const SizedBox(height: constants.padding),
             Padding(
-            padding: const EdgeInsets.symmetric(horizontal: constants.padding),
+              padding: const EdgeInsets.symmetric(
+                horizontal: constants.padding,
+              ),
               child: Row(
                 children: [
                   SizedBox(
@@ -77,7 +80,9 @@ class _HomeScreeState extends State<HomeScreen> {
                             constants.borderRadius,
                           ),
                           border: Border.all(
-                          color: scheme.outlineVariant.withValues(alpha: 0.08),
+                            color: scheme.outlineVariant.withValues(
+                              alpha: 0.08,
+                            ),
                             width: 1,
                           ),
                         ),
@@ -94,9 +99,12 @@ class _HomeScreeState extends State<HomeScreen> {
                                   ),
                                   color: settings.autoStart
                                       ? scheme.primary
-                                    : scheme.onSurface.withValues(alpha: 0.70),
+                                      : scheme.onSurface.withValues(
-                                onPressed: () =>
+                                          alpha: 0.70,
-                                    settings.setAutoStart(!settings.autoStart),
+                                        ),
+                                  onPressed: () => settings.setAutoStart(
+                                    !settings.autoStart,
+                                  ),
                                 );
                               },
                             ),
@@ -137,6 +145,7 @@ class _HomeScreeState extends State<HomeScreen> {
             ),
           ],
         ),
+      ],
       floatingActionButton: Padding(
         padding: const EdgeInsets.all(constants.padding),
         child: Hero(