Fix theme preference is not remembered (#176)

.github/workflows/macos.yml

@@ -9,12 +9,6 @@ on:
     paths-ignore:
       - 'catalog/**'
       - 'docs/**'
-  pull_request:
-    branches:
-      - master
-    paths-ignore:
-      - 'catalog/**'
-      - 'docs/**'
 
 jobs:
   build:

.github/workflows/windows.yml

@@ -9,12 +9,6 @@ on:
     paths-ignore:
       - 'catalog/**'
       - 'docs/**'
-  pull_request:
-    branches:
-      - master
-    paths-ignore:
-      - 'catalog/**'
-      - 'docs/**'
 
 jobs:
   build:

public/electron.js

@@ -58,6 +58,7 @@ if (!gotTheLock) {
       proxyPacScript,
       proxyRules,
       proxyType,
+      themeSource,
     } = getPreferences();
 
     // configure proxy for default session
@@ -73,6 +74,7 @@ if (!gotTheLock) {
       });
     }
 
+    nativeTheme.themeSource = themeSource;
 
     mainWindow.createAsync()
       .then(() => {

public/libs/preferences.js

@@ -1,6 +1,6 @@
 const path = require('path');
 const settings = require('electron-settings');
-const { app, ipcMain } = require('electron');
+const { app, nativeTheme, ipcMain } = require('electron');
 
 const sendToAllWindows = require('./send-to-all-windows');
 
@@ -51,6 +51,7 @@ const defaultPreferences = {
   spellcheck: true,
   spellcheckLanguages: ['en-US'],
   swipeToNavigate: true,
+  themeSource: 'system',
   titleBar: false,
   unreadCountBadge: true,
 };
@@ -75,6 +76,10 @@ const setPreference = (name, value) => {
   if (name.startsWith('pauseNotifications')) {
     ipcMain.emit('request-update-pause-notifications-info');
   }
+
+  if (name === 'themeSource') {
+    nativeTheme.themeSource = value;
+  }
 };
 
 const resetPreferences = () => {

public/listeners/index.js

@@ -425,14 +425,6 @@ const loadListeners = () => {
   ipcMain.on('get-should-use-dark-colors', (e) => {
     e.returnValue = nativeTheme.shouldUseDarkColors;
   });
-
-  ipcMain.on('get-theme-source', (e) => {
-    e.returnValue = nativeTheme.themeSource;
-  });
-
-  ipcMain.on('request-set-theme-source', (e, val) => {
-    nativeTheme.themeSource = val;
-  });
 };
 
 module.exports = loadListeners;

src/components/dialog-preferences/index.js

@@ -50,7 +50,6 @@ import {
   requestResetPreferences,
   requestSetPreference,
   requestSetSystemPreference,
-  requestSetThemeSource,
   requestShowAboutWindow,
   requestShowCodeInjectionWindow,
   requestShowCustomUserAgentWindow,
@@ -290,9 +289,9 @@ const Preferences = ({
                 </ListItem>
               )}
             >
-              <MenuItem dense onClick={() => requestSetThemeSource('system')}>System default</MenuItem>
-              <MenuItem dense onClick={() => requestSetThemeSource('light')}>Light</MenuItem>
-              <MenuItem dense onClick={() => requestSetThemeSource('dark')}>Dark</MenuItem>
+              <MenuItem dense onClick={() => requestSetPreference('themeSource', 'system')}>System default</MenuItem>
+              <MenuItem dense onClick={() => requestSetPreference('themeSource', 'light')}>Light</MenuItem>
+              <MenuItem dense onClick={() => requestSetPreference('themeSource', 'dark')}>Dark</MenuItem>
             </StatedMenu>
             <Divider />
             <ListItem>
@@ -966,6 +965,7 @@ const mapStateToProps = (state) => ({
   spellcheck: state.preferences.spellcheck,
   spellcheckLanguages: state.preferences.spellcheckLanguages,
   swipeToNavigate: state.preferences.swipeToNavigate,
+  themeSource: state.preferences.themeSource,
   titleBar: state.preferences.titleBar,
   unreadCountBadge: state.preferences.unreadCountBadge,
   updaterInfo: state.updater.info,

src/constants/actions.js

@@ -78,4 +78,3 @@ export const DIALOG_SPELLCHECK_LANGUAGES_UPDATE_FORM = 'DIALOG_SPELLCHECK_LANGUA
 
 // Theme
 export const UPDATE_SHOULD_USE_DARK_COLORS = 'UPDATE_SHOULD_USE_DARK_COLORS';
-export const UPDATE_THEME_SOURCE = 'UPDATE_THEME_SOURCE';

src/listeners/index.js

@@ -3,7 +3,6 @@ import { setSystemPreference } from '../state/system-preferences/actions';
 import { setWorkspace } from '../state/workspaces/actions';
 import {
   updateShouldUseDarkColors,
-  updateThemeSource,
   updateAddressBarInfo,
   updateCanGoBack,
   updateCanGoForward,
@@ -22,7 +21,6 @@ import {
 import { updateUpdater } from '../state/updater/actions';
 import {
   getShouldUseDarkColors,
-  getThemeSource,
   requestFindInPage,
 } from '../senders';
 
@@ -98,7 +96,6 @@ const loadListeners = (store) => {
   });
 
   ipcRenderer.on('native-theme-updated', () => {
-    store.dispatch(updateThemeSource(getThemeSource()));
     store.dispatch(updateShouldUseDarkColors(getShouldUseDarkColors()));
   });
 };

src/senders/index.js

@@ -65,5 +65,3 @@ export const requestValidateAuthIdentity = (windowId, username, password) => ipc
 
 // Native Theme
 export const getShouldUseDarkColors = () => ipcRenderer.sendSync('get-should-use-dark-colors');
-export const getThemeSource = () => ipcRenderer.sendSync('get-theme-source');
-export const requestSetThemeSource = (val) => ipcRenderer.send('request-set-theme-source', val);

src/state/general/actions.js

@@ -1,6 +1,5 @@
 import {
   UPDATE_SHOULD_USE_DARK_COLORS,
-  UPDATE_THEME_SOURCE,
   UPDATE_ADDRESS_BAR_INFO,
   UPDATE_CAN_GO_BACK,
   UPDATE_CAN_GO_FORWARD,
@@ -17,11 +16,6 @@ export const updateShouldUseDarkColors = (shouldUseDarkColors) => ({
   shouldUseDarkColors,
 });
 
-export const updateThemeSource = (themeSource) => ({
-  type: UPDATE_THEME_SOURCE,
-  themeSource,
-});
-
 export const updateCanGoBack = (canGoBack) => ({
   type: UPDATE_CAN_GO_BACK,
   canGoBack,

src/state/general/reducers.js

@@ -2,7 +2,6 @@ import { combineReducers } from 'redux';
 
 import {
   UPDATE_SHOULD_USE_DARK_COLORS,
-  UPDATE_THEME_SOURCE,
   UPDATE_CAN_GO_BACK,
   UPDATE_CAN_GO_FORWARD,
   UPDATE_DID_FAIL_LOAD,
@@ -15,7 +14,6 @@ import {
 } from '../../constants/actions';
 
 import {
-  getThemeSource,
   getShouldUseDarkColors,
 } from '../../senders';
 
@@ -91,13 +89,6 @@ const shouldUseDarkColors = (state = getShouldUseDarkColors(), action) => {
   }
 };
 
-const themeSource = (state = getThemeSource(), action) => {
-  switch (action.type) {
-    case UPDATE_THEME_SOURCE: return action.themeSource;
-    default: return state;
-  }
-};
-
 const didFailLoad = (state = false, action) => {
   switch (action.type) {
     case UPDATE_DID_FAIL_LOAD: return action.didFailLoad;
@@ -116,6 +107,5 @@ export default combineReducers({
   isFullScreen,
   isLoading,
   shouldUseDarkColors,
-  themeSource,
   title,
 });