Fix override behaviour of system vs defined themes

Fixes https://github.com/vector-im/riot-web/issues/11509
pull/21833/head
Travis Ralston 2019-11-26 09:52:03 -07:00
parent 46846fcfd0
commit 4cec7c41b1
3 changed files with 22 additions and 5 deletions

View File

@ -364,7 +364,7 @@
"Automatically replace plain text Emoji": "Automatically replace plain text Emoji",
"Mirror local video feed": "Mirror local video feed",
"Enable Community Filter Panel": "Enable Community Filter Panel",
"Match system dark mode setting": "Match system dark mode setting",
"Match system theme": "Match system theme",
"Allow Peer-to-Peer for 1:1 calls": "Allow Peer-to-Peer for 1:1 calls",
"Send analytics data": "Send analytics data",
"Never send encrypted messages to unverified devices from this device": "Never send encrypted messages to unverified devices from this device",

View File

@ -284,7 +284,7 @@ export const SETTINGS = {
"use_system_theme": {
supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS,
default: true,
displayName: _td("Match system dark mode setting"),
displayName: _td("Match system theme"),
},
"webRtcAllowPeerToPeer": {
supportedLevels: LEVELS_DEVICE_ONLY_SETTINGS_WITH_CONFIG,

View File

@ -20,7 +20,7 @@ import {_t} from "./languageHandler";
export const DEFAULT_THEME = "light";
import Tinter from "./Tinter";
import dis from "./dispatcher";
import SettingsStore from "./settings/SettingsStore";
import SettingsStore, {SettingLevel} from "./settings/SettingsStore";
export class ThemeWatcher {
static _instance = null;
@ -60,14 +60,14 @@ export class ThemeWatcher {
_onChange = () => {
this.recheck();
}
};
_onAction = (payload) => {
if (payload.action === 'recheck_theme') {
// XXX forceTheme
this.recheck(payload.forceTheme);
}
}
};
// XXX: forceTheme param aded here as local echo appears to be unreliable
// https://github.com/vector-im/riot-web/issues/11443
@ -80,6 +80,23 @@ export class ThemeWatcher {
}
getEffectiveTheme() {
// If the user has specifically enabled the system matching option (excluding default),
// then use that over anything else. We pick the lowest possible level for the setting
// to ensure the ordering otherwise works.
const systemThemeExplicit = SettingsStore.getValueAt(SettingLevel.DEVICE, "use_system_theme", null, false, true);
if (systemThemeExplicit) {
if (this._preferDark.matches) return 'dark';
if (this._preferLight.matches) return 'light';
}
// If the user has specifically enabled the theme (without the system matching option being
// enabled specifically and excluding the default), use that theme. We pick the lowest possible
// level for the setting to ensure the ordering otherwise works.
const themeExplicit = SettingsStore.getValueAt(SettingLevel.DEVICE, "theme", null, false, true);
if (themeExplicit) return themeExplicit;
// If the user hasn't really made a preference in either direction, assume the defaults of the
// settings and use those.
if (SettingsStore.getValue('use_system_theme')) {
if (this._preferDark.matches) return 'dark';
if (this._preferLight.matches) return 'light';