fix(fe/theme): enable theme immediately if auto theme is enabled

ihexxa · Apr 19, 2022 · 3b42272 · 3b42272
1 parent 20b7cda
commit 3b42272
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 9 deletions.
diff --git a/src/client/web/src/components/root_frame.tsx b/src/client/web/src/components/root_frame.tsx
@@ -80,10 +80,14 @@ export class RootFrame extends React.Component<Props, State, {}> {
 
   render() {
     const bgStyle = this.makeBgStyle();
-    const theme =
+    const autoTheme =
+      updater().getCurrentTheme() === "light" ? "theme-default" : "theme-dark";
+    const fixedTheme =
       this.props.login.preferences.theme === "light"
         ? "theme-default"
         : "theme-dark";
+    const theme = this.props.ui.clientCfg.autoTheme ? autoTheme : fixedTheme;
+
     const fontSizeClass = "font-m";
 
     const displaying = this.props.ui.control.controls.get(controlName);

diff --git a/src/client/web/src/components/state_updater.ts b/src/client/web/src/components/state_updater.ts
@@ -789,20 +789,23 @@ export class Updater {
     this.props.login.preferences.theme = theme;
   };
 
-  autoSwitchTheme = () => {
-    if (!this.props.ui.clientCfg.autoTheme) {
-      return;
-    }
-
+  getCurrentTheme = () => {
     const date = new Date();
+
     if (
       (date.getHours() >= 18 && date.getHours() <= 23) ||
       (date.getHours() >= 0 && date.getHours() <= 6)
     ) {
-      this.setTheme("dark");
-    } else {
-      this.setTheme("light");
+      return "dark";
+    }
+    return "light";
+  };
+
+  autoSwitchTheme = () => {
+    if (!this.props.ui.clientCfg.autoTheme) {
+      return;
     }
+    this.setTheme(this.getCurrentTheme());
   };
 
   setControlOption = (controlName: string, option: string): boolean => {