theme: Track theme through global settings

Signed-off-by: Zixuan James Li <[email protected]>

Author: PIG208

lib/widgets/app.dart

@@ -212,41 +212,48 @@ class _ZulipAppState extends State<ZulipApp> with WidgetsBindingObserver {
 
   @override
   Widget build(BuildContext context) {
-    final themeData = zulipThemeData(context);
     return GlobalStoreWidget(
-      child: MaterialApp(
-        onGenerateTitle: (BuildContext context) {
-          return ZulipLocalizations.of(context).zulipAppTitle;
-        },
-        localizationsDelegates: ZulipLocalizations.localizationsDelegates,
-        supportedLocales: ZulipLocalizations.supportedLocales,
-        theme: themeData,
-
-        navigatorKey: ZulipApp.navigatorKey,
-        navigatorObservers: [
-          if (widget.navigatorObservers != null)
-            ...widget.navigatorObservers!,
-          _PreventEmptyStack(),
-        ],
-        builder: (BuildContext context, Widget? child) {
-          if (!ZulipApp.ready.value) {
-            SchedulerBinding.instance.addPostFrameCallback(
-              (_) => widget._declareReady());
-          }
-          GlobalLocalizations.zulipLocalizations = ZulipLocalizations.of(context);
-          return child!;
-        },
-
-        // We use onGenerateInitialRoutes for the real work of specifying the
-        // initial nav state.  To do that we need [MaterialApp] to decide to
-        // build a [Navigator]... which means specifying either `home`, `routes`,
-        // `onGenerateRoute`, or `onUnknownRoute`.  Make it `onGenerateRoute`.
-        // It never actually gets called, though: `onGenerateInitialRoutes`
-        // handles startup, and then we always push whole routes with methods
-        // like [Navigator.push], never mere names as with [Navigator.pushNamed].
-        onGenerateRoute: (_) => null,
-
-        onGenerateInitialRoutes: _handleGenerateInitialRoutes));
+      child: Builder(
+        builder: (context) {
+          return MaterialApp(
+            onGenerateTitle: (BuildContext context) {
+              return ZulipLocalizations.of(context).zulipAppTitle;
+            },
+            localizationsDelegates: ZulipLocalizations.localizationsDelegates,
+            supportedLocales: ZulipLocalizations.supportedLocales,
+            // The context has to be taken from the [Builder] because
+            // [zulipThemeData] requires access to [GlobalStoreWidget] in the tree.
+            // TODO: any way to remove the [Builder], like how we pulled out
+            //   [_handleGenerateInitialRoutes]?
+            theme: zulipThemeData(context),
+
+            navigatorKey: ZulipApp.navigatorKey,
+            navigatorObservers: [
+              if (widget.navigatorObservers != null)
+                ...widget.navigatorObservers!,
+              _PreventEmptyStack(),
+            ],
+            builder: (BuildContext context, Widget? child) {
+              if (!ZulipApp.ready.value) {
+                SchedulerBinding.instance.addPostFrameCallback(
+                  (_) => widget._declareReady());
+              }
+              GlobalLocalizations.zulipLocalizations = ZulipLocalizations.of(context);
+              return child!;
+            },
+
+            // We use onGenerateInitialRoutes for the real work of specifying the
+            // initial nav state.  To do that we need [MaterialApp] to decide to
+            // build a [Navigator]... which means specifying either `home`, `routes`,
+            // `onGenerateRoute`, or `onUnknownRoute`.  Make it `onGenerateRoute`.
+            // It never actually gets called, though: `onGenerateInitialRoutes`
+            // handles startup, and then we always push whole routes with methods
+            // like [Navigator.push], never mere names as with [Navigator.pushNamed].
+            onGenerateRoute: (_) => null,
+
+            onGenerateInitialRoutes: _handleGenerateInitialRoutes);
+        }
+      ));
   }
 }
 

lib/widgets/theme.dart

@@ -1,17 +1,28 @@
 import 'package:flutter/material.dart';
 
 import '../api/model/model.dart';
+import '../model/settings.dart';
 import 'compose_box.dart';
 import 'content.dart';
 import 'emoji_reaction.dart';
 import 'message_list.dart';
 import 'channel_colors.dart';
+import 'store.dart';
 import 'text.dart';
 
 ThemeData zulipThemeData(BuildContext context) {
   final DesignVariables designVariables;
   final List<ThemeExtension> themeExtensions;
-  Brightness brightness = MediaQuery.platformBrightnessOf(context);
+  final globalSettings = GlobalStoreWidget.of(context).globalSettings;
+  Brightness brightness;
+  switch (globalSettings.themeSetting) {
+    case ThemeSetting.unset:
+      brightness = MediaQuery.platformBrightnessOf(context);
+    case ThemeSetting.light:
+      brightness = Brightness.light;
+    case ThemeSetting.dark:
+      brightness = Brightness.dark;
+  }
 
   // This applies Material 3's color system to produce a palette of
   // appropriately matching and contrasting colors for use in a UI.

test/flutter_checks.dart

@@ -61,6 +61,10 @@ extension ValueListenableChecks<T> on Subject<ValueListenable<T>> {
   Subject<T> get value => has((c) => c.value, 'value');
 }
 
+extension ThemeDataChecks on Subject<ThemeData> {
+  Subject<Brightness> get brightness => has((x) => x.brightness, 'brightness');
+}
+
 extension TextChecks on Subject<Text> {
   Subject<String?> get data => has((t) => t.data, 'data');
   Subject<TextStyle?> get style => has((t) => t.style, 'style');

test/widgets/theme_test.dart

@@ -1,7 +1,10 @@
 import 'package:checks/checks.dart';
+import 'package:drift/drift.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart';
 import 'package:flutter_test/flutter_test.dart';
+import 'package:zulip/model/database.dart';
+import 'package:zulip/model/settings.dart';
 import 'package:zulip/widgets/channel_colors.dart';
 import 'package:zulip/widgets/text.dart';
 import 'package:zulip/widgets/theme.dart';
@@ -97,6 +100,27 @@ void main() {
         check(() => a.lerp(b, 0.5)).returnsNormally();
       });
     });
+
+    testWidgets('follow globalSettings.themeSetting if not unset', (tester) async {
+      addTearDown(testBinding.reset);
+
+      tester.platformDispatcher.platformBrightnessTestValue = Brightness.light;
+      addTearDown(tester.platformDispatcher.clearPlatformBrightnessTestValue);
+
+      await tester.pumpWidget(const TestZulipApp(child: Placeholder()));
+      await tester.pump();
+
+      final element = tester.element(find.byType(Placeholder));
+      check(zulipThemeData(element)).brightness.equals(Brightness.light);
+
+      await testBinding.globalStore.updateGlobalSettings(
+        const GlobalSettingsCompanion(themeSetting: Value(ThemeSetting.dark)));
+      check(zulipThemeData(element)).brightness.equals(Brightness.dark);
+
+      await testBinding.globalStore.updateGlobalSettings(
+        const GlobalSettingsCompanion(themeSetting: Value(ThemeSetting.unset)));
+      check(zulipThemeData(element)).brightness.equals(Brightness.light);
+    });
   });
 
   group('colorSwatchFor', () {