Switch to dedicated theme selector option

lib/app.dart

@@ -2,6 +2,7 @@ import 'dart:io';
 
 import 'package:adaptive_theme/adaptive_theme.dart';
 import 'package:background_fetch/background_fetch.dart';
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_easyloading/flutter_easyloading.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
@@ -43,7 +44,7 @@ class _EnteAppState extends State<EnteApp> with WidgetsBindingObserver {
 
   @override
   Widget build(BuildContext context) {
-    if (Platform.isAndroid) {
+    if (Platform.isAndroid || kDebugMode) {
       return AdaptiveTheme(
         light: lightThemeData,
         dark: darkThemeData,

lib/ui/settings/theme_switch_widget.dart

@@ -1,59 +1,68 @@
 import 'package:adaptive_theme/adaptive_theme.dart';
-import 'package:animated_toggle_switch/animated_toggle_switch.dart';
+import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
-import 'package:photos/ente_theme_data.dart';
-import 'package:photos/utils/toast_util.dart';
 
-class ThemeSwitchWidget extends StatelessWidget {
+class ThemeSwitchWidget extends StatefulWidget {
   const ThemeSwitchWidget({Key key}) : super(key: key);
 
+  @override
+  State<ThemeSwitchWidget> createState() => _ThemeSwitchWidgetState();
+}
+
+class _ThemeSwitchWidgetState extends State<ThemeSwitchWidget> {
+  AdaptiveThemeMode themeMode;
+  @override
+  void initState() {
+    super.initState();
+    AdaptiveTheme.getThemeMode().then(
+      (value) {
+        themeMode = value ?? AdaptiveThemeMode.system;
+        debugPrint('theme value $value');
+        if (mounted) {
+          setState(() => {});
+        }
+      },
+    );
+  }
+
   @override
   Widget build(BuildContext context) {
-    var selectedTheme = 0;
-    if (Theme.of(context).brightness == Brightness.dark) {
-      selectedTheme = 1;
-    }
     return GestureDetector(
-      onLongPress: () {
-        AdaptiveTheme.of(context).setSystem();
-        showShortToast(context, 'Following system theme');
+      onTap: () async {
+        await showCupertinoModalPopup(
+          context: context,
+          builder: (_) => CupertinoActionSheet(
+            title: Text(
+              "Theme",
+              style: Theme.of(context)
+                  .textTheme
+                  .headline4
+                  .copyWith(color: Colors.white),
+            ),
+            actions: [
+              for (var mode in AdaptiveThemeMode.values)
+                CupertinoActionSheetAction(
+                  child: Text(mode.modeName),
+                  onPressed: () async {
+                    AdaptiveTheme.of(context).setThemeMode(mode);
+                    themeMode = mode;
+                    Navigator.of(context, rootNavigator: true).pop();
+                    if (mounted) {
+                      setState(() => {});
+                    }
+                  },
+                ),
+            ],
+            cancelButton: CupertinoActionSheetAction(
+              child: const Text("Cancel"),
+              onPressed: () {
+                Navigator.of(context, rootNavigator: true).pop();
+              },
+            ),
+          ),
+        );
       },
-      child: AnimatedToggleSwitch<int>.rolling(
-        current: selectedTheme,
-        values: const [0, 1],
-        onChanged: (i) {
-          debugPrint("Changed to {i}, selectedTheme is {selectedTheme} ");
-          if (i == 0) {
-            AdaptiveTheme.of(context).setLight();
-          } else {
-            AdaptiveTheme.of(context).setDark();
-          }
-        },
-        iconBuilder: (i, size, foreground) {
-          final color = selectedTheme == i
-              ? Theme.of(context).colorScheme.themeSwitchActiveIconColor
-              : Theme.of(context).colorScheme.themeSwitchInactiveIconColor;
-          if (i == 0) {
-            return Icon(
-              Icons.light_mode,
-              color: color,
-            );
-          } else {
-            return Icon(
-              Icons.dark_mode,
-              color: color,
-            );
-          }
-        },
-        height: 36,
-        indicatorSize: const Size(36, 36),
-        indicatorColor: Theme.of(context).colorScheme.themeSwitchIndicatorColor,
-        borderColor: Theme.of(context)
-            .colorScheme
-            .themeSwitchInactiveIconColor
-            .withOpacity(0.1),
-        borderWidth: 1,
-      ),
+      child: Text(themeMode?.modeName ?? ">"),
     );
   }
 }

lib/ui/settings_page.dart

@@ -11,6 +11,7 @@ import 'package:photos/ui/settings/debug_section_widget.dart';
 import 'package:photos/ui/settings/details_section_widget.dart';
 import 'package:photos/ui/settings/info_section_widget.dart';
 import 'package:photos/ui/settings/security_section_widget.dart';
+import 'package:photos/ui/settings/settings_section_title.dart';
 import 'package:photos/ui/settings/social_section_widget.dart';
 import 'package:photos/ui/settings/support_section_widget.dart';
 import 'package:photos/ui/settings/theme_switch_widget.dart';
@@ -31,32 +32,22 @@ class SettingsPage extends StatelessWidget {
     final List<Widget> contents = [];
     contents.add(
       Container(
-        padding: const EdgeInsets.symmetric(horizontal: 2, vertical: 6),
-        child: Row(
-          mainAxisAlignment: MainAxisAlignment.spaceBetween,
-          crossAxisAlignment: CrossAxisAlignment.center,
-          children: [
-            // // Thanks to the [AnimatedBuilder], only the widget displaying the
-            // // current email is rebuilt when `emailNotifier` notifies its
-            // // listeners.
-            AnimatedBuilder(
-              // [AnimatedBuilder] accepts any [Listenable] subtype.
-              animation: emailNotifier,
-              builder: (BuildContext context, Widget child) {
-                return Text(
-                  emailNotifier.value,
-                  style: Theme.of(context)
-                      .textTheme
-                      .subtitle1
-                      .copyWith(overflow: TextOverflow.ellipsis),
-                );
-              },
-            ),
-
-            (Platform.isAndroid)
-                ? const ThemeSwitchWidget()
-                : const SizedBox.shrink(),
-          ],
+        padding: const EdgeInsets.symmetric(horizontal: 2, vertical: 4),
+        child: Align(
+          alignment: Alignment.centerLeft,
+          child: AnimatedBuilder(
+            // [AnimatedBuilder] accepts any [Listenable] subtype.
+            animation: emailNotifier,
+            builder: (BuildContext context, Widget child) {
+              return Text(
+                emailNotifier.value,
+                style: Theme.of(context)
+                    .textTheme
+                    .subtitle1
+                    .copyWith(overflow: TextOverflow.ellipsis),
+              );
+            },
+          ),
         ),
       ),
     );
@@ -78,6 +69,23 @@ class SettingsPage extends StatelessWidget {
     contents.addAll([
       const SecuritySectionWidget(),
       sectionDivider,
+    ]);
+
+    if (Platform.isAndroid || kDebugMode) {
+      contents.addAll([
+        Row(
+          mainAxisAlignment: MainAxisAlignment.spaceBetween,
+          crossAxisAlignment: CrossAxisAlignment.center,
+          children: const [
+            SettingsSectionTitle("Theme"),
+            ThemeSwitchWidget(),
+          ],
+        ),
+        sectionDivider,
+      ]);
+    }
+
+    contents.addAll([
       const SupportSectionWidget(),
       sectionDivider,
       const SocialSectionWidget(),