fix settings

web/repertory/lib/helpers.dart

@@ -7,7 +7,7 @@ import 'package:flutter/material.dart';
 import 'package:repertory/constants.dart' as constants;
 import 'package:repertory/models/auth.dart';
 import 'package:repertory/widgets/app_dropdown.dart';
-import 'package:settings_ui/settings_ui.dart';
+import 'package:flutter_settings_ui/flutter_settings_ui.dart';
 import 'package:sodium_libs/sodium_libs.dart' show SecureKey, StringX;
 
 Future doShowDialog(BuildContext context, Widget child) => showDialog(

web/repertory/lib/settings.dart

@@ -7,7 +7,7 @@ import 'package:repertory/constants.dart' as constants;
 import 'package:repertory/helpers.dart'
     show Validator, displayErrorMessage, doShowDialog;
 import 'package:repertory/widgets/app_dropdown.dart';
-import 'package:settings_ui/settings_ui.dart';
+import 'package:flutter_settings_ui/flutter_settings_ui.dart';
 
 void createBooleanSetting(
   BuildContext context,

web/repertory/lib/widgets/app_scaffold.dart

@@ -128,7 +128,6 @@ class AppScaffold extends StatelessWidget {
                           overflow: TextOverflow.ellipsis,
                           style: textTheme.headlineSmall?.copyWith(
                             fontWeight: FontWeight.w700,
-                            letterSpacing: 0.2,
                             color: scheme.onSurface,
                           ),
                         ),

web/repertory/lib/widgets/mount_settings.dart

@@ -1,6 +1,8 @@
 // mount_settings.dart
 
 import 'package:flutter/material.dart';
+import 'package:flutter_settings_ui/flutter_settings_ui.dart'
+    show SettingsTile, SettingsList, DevicePlatform;
 import 'package:provider/provider.dart';
 import 'package:repertory/constants.dart' as constants;
 import 'package:repertory/helpers.dart'
@@ -14,7 +16,7 @@ import 'package:repertory/models/auth.dart';
 import 'package:repertory/models/mount.dart';
 import 'package:repertory/models/mount_list.dart';
 import 'package:repertory/settings.dart';
-import 'package:settings_ui/settings_ui.dart';
+import 'package:repertory/widgets/settings/settings_section.dart';
 
 class MountSettingsWidget extends StatefulWidget {
   final bool isAdd;
@@ -38,8 +40,9 @@ class MountSettingsWidget extends StatefulWidget {
 class _MountSettingsWidgetState extends State<MountSettingsWidget> {
   @override
   Widget build(BuildContext context) {
-    final scheme = Theme.of(context).colorScheme;
+    final theme = Theme.of(context);
-    final theme = createSettingsTheme(scheme);
+    final scheme = theme.colorScheme;
+    final settingsTheme = createSettingsTheme(scheme);
 
     List<SettingsTile> commonSettings = [];
     List<SettingsTile> encryptConfigSettings = [];
@@ -384,58 +387,52 @@ class _MountSettingsWidgetState extends State<MountSettingsWidget> {
       }
     });
 
-    const sectionMargin = EdgeInsetsDirectional.symmetric(
+    final titleStyle = theme.textTheme.titleLarge?.copyWith(
-      vertical: constants.padding / 2,
+      fontWeight: FontWeight.w700,
+      color: scheme.onSurface,
     );
 
     return SettingsList(
       shrinkWrap: false,
-      platform: DevicePlatform.device,
+      platform: DevicePlatform.web,
-      lightTheme: theme,
+      lightTheme: settingsTheme,
-      darkTheme: theme,
+      darkTheme: settingsTheme,
       sections: [
         if (encryptConfigSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Encrypt Config', style: titleStyle),
-            title: const Text('Encrypt Config'),
             tiles: encryptConfigSettings,
           ),
         if (hostConfigSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Host Config', style: titleStyle),
-            title: const Text('Host Config'),
             tiles: hostConfigSettings,
           ),
         if (remoteConfigSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Remote Config', style: titleStyle),
-            title: const Text('Remote Config'),
             tiles: remoteConfigSettings,
           ),
         if (s3ConfigSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('S3 Config', style: titleStyle),
-            title: const Text('S3 Config'),
             tiles: s3ConfigSettings,
           ),
         if (siaConfigSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Sia Config', style: titleStyle),
-            title: const Text('Sia Config'),
             tiles: siaConfigSettings,
           ),
         if (remoteMountSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Remote Mount', style: titleStyle),
-            title: const Text('Remote Mount'),
             tiles: (widget.settings['RemoteMount']['Enable'] as bool)
                 ? remoteMountSettings
                 : [remoteMountSettings[0]],
           ),
         if (commonSettings.isNotEmpty)
           SettingsSection(
-            margin: sectionMargin,
+            title: Text('Settings', style: titleStyle),
-            title: const Text('Settings'),
             tiles: commonSettings,
           ),
       ],

web/repertory/lib/widgets/mount_widget.dart

@@ -31,7 +31,6 @@ class _MountWidgetState extends State<MountWidget>
 
     final titleStyle = textTheme.titleMedium?.copyWith(
       fontWeight: FontWeight.w700,
-      letterSpacing: 0.15,
       color: scheme.onSurface,
     );
     final subStyle = textTheme.bodyMedium?.copyWith(color: scheme.onSurface);

web/repertory/lib/widgets/settings/settings_section.dart

@@ -0,0 +1,48 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_settings_ui/src/sections/abstract_settings_section.dart';
+import 'package:flutter_settings_ui/src/sections/platforms/android_settings_section.dart';
+import 'package:flutter_settings_ui/src/sections/platforms/ios_settings_section.dart';
+import 'package:repertory/widgets/settings/web_settings_section.dart';
+import 'package:flutter_settings_ui/src/tiles/abstract_settings_tile.dart';
+import 'package:flutter_settings_ui/src/utils/platform_utils.dart';
+import 'package:flutter_settings_ui/src/utils/settings_theme.dart';
+
+class SettingsSection extends AbstractSettingsSection {
+  const SettingsSection({
+    required this.tiles,
+    this.margin,
+    this.title,
+    super.key,
+  });
+
+  final List<AbstractSettingsTile> tiles;
+  final EdgeInsetsDirectional? margin;
+  final Widget? title;
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = SettingsTheme.of(context);
+
+    switch (theme.platform) {
+      case DevicePlatform.android:
+      case DevicePlatform.fuchsia:
+      case DevicePlatform.linux:
+        return AndroidSettingsSection(
+          title: title,
+          tiles: tiles,
+          margin: margin,
+        );
+      case DevicePlatform.iOS:
+      case DevicePlatform.macOS:
+      case DevicePlatform.windows:
+        return IOSSettingsSection(title: title, tiles: tiles, margin: margin);
+      case DevicePlatform.web:
+        return WebSettingsSection(title: title, tiles: tiles, margin: margin);
+      case DevicePlatform.device:
+        throw Exception(
+          "You can't use the DevicePlatform.device in this context. "
+          'Incorrect platform: SettingsSection.build',
+        );
+    }
+  }
+}

web/repertory/lib/widgets/settings/web_settings_section.dart

@@ -0,0 +1,76 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_settings_ui/flutter_settings_ui.dart';
+
+// Container(
+//   height: 65 * scaleFactor,
+//   padding: EdgeInsetsDirectional.only(
+//     bottom: 5 * scaleFactor,
+//     start: 6,
+//     top: 40 * scaleFactor,
+//   ),
+//   child: title!,
+// ),
+
+class WebSettingsSection extends StatelessWidget {
+  const WebSettingsSection({
+    required this.tiles,
+    required this.margin,
+    required this.title,
+    super.key,
+  });
+
+  final List<AbstractSettingsTile> tiles;
+  final EdgeInsetsDirectional? margin;
+  final Widget? title;
+
+  @override
+  Widget build(BuildContext context) {
+    return buildSectionBody(context);
+  }
+
+  Widget buildSectionBody(BuildContext context) {
+    final theme = SettingsTheme.of(context);
+    final scaleFactor = MediaQuery.textScalerOf(context).scale(1);
+
+    return Padding(
+      padding: margin ?? EdgeInsets.zero,
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          if (title != null)
+            Padding(
+              padding: EdgeInsetsDirectional.only(
+                bottom: 5 * scaleFactor,
+                start: 6,
+                top: 20 * scaleFactor,
+              ),
+              child: title!,
+            ),
+          Card(
+            shape: RoundedRectangleBorder(
+              borderRadius: BorderRadius.circular(10),
+            ),
+            elevation: 4,
+            color: theme.themeData.settingsSectionBackground,
+            child: buildTileList(),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Widget buildTileList() {
+    return ListView.separated(
+      shrinkWrap: true,
+      itemCount: tiles.length,
+      padding: EdgeInsets.zero,
+      physics: const NeverScrollableScrollPhysics(),
+      itemBuilder: (BuildContext context, int index) {
+        return tiles[index];
+      },
+      separatorBuilder: (BuildContext context, int index) {
+        return const Divider(height: 0, thickness: 1);
+      },
+    );
+  }
+}

web/repertory/lib/widgets/ui_settings.dart

@@ -3,6 +3,8 @@
 import 'dart:convert' show jsonEncode;
 
 import 'package:flutter/material.dart';
+import 'package:flutter_settings_ui/flutter_settings_ui.dart'
+    show DevicePlatform, SettingsList, SettingsTile;
 import 'package:http/http.dart' as http;
 import 'package:provider/provider.dart';
 import 'package:repertory/constants.dart' as constants;
@@ -19,7 +21,7 @@ import 'package:repertory/helpers.dart'
 import 'package:repertory/models/auth.dart';
 import 'package:repertory/settings.dart';
 import 'package:repertory/utils/safe_set_state_mixin.dart';
-import 'package:settings_ui/settings_ui.dart';
+import 'package:repertory/widgets/settings/settings_section.dart';
 
 class UISettingsWidget extends StatefulWidget {
   final bool showAdvanced;
@@ -40,8 +42,9 @@ class _UISettingsWidgetState extends State<UISettingsWidget>
     with SafeSetState<UISettingsWidget> {
   @override
   Widget build(BuildContext context) {
-    final scheme = Theme.of(context).colorScheme;
+    final theme = Theme.of(context);
-    final theme = createSettingsTheme(scheme);
+    final scheme = theme.colorScheme;
+    final settingsTheme = createSettingsTheme(scheme);
 
     List<SettingsTile> commonSettings = [];
 
@@ -104,13 +107,21 @@ class _UISettingsWidgetState extends State<UISettingsWidget>
       }
     });
 
+    final titleStyle = theme.textTheme.titleLarge?.copyWith(
+      fontWeight: FontWeight.w700,
+      color: scheme.onSurface,
+    );
+
     return SettingsList(
       shrinkWrap: false,
-      platform: DevicePlatform.device,
+      platform: DevicePlatform.web,
-      lightTheme: theme,
+      lightTheme: settingsTheme,
-      darkTheme: theme,
+      darkTheme: settingsTheme,
       sections: [
-        SettingsSection(title: const Text('Settings'), tiles: commonSettings),
+        SettingsSection(
+          title: Text('Settings', style: titleStyle),
+          tiles: commonSettings,
+        ),
       ],
     );
   }

web/repertory/pubspec.yaml

@@ -37,7 +37,7 @@ dependencies:
   collection: ^1.19.1
   http: ^1.3.0
   provider: ^6.1.2
-  settings_ui: ^2.0.2
+  flutter_settings_ui: ^3.0.0
   sodium_libs: ^3.4.6+1
   convert: ^3.1.2