diff --git a/js/views/app_view.js b/js/views/app_view.js index f271b2149..144cb3e2c 100644 --- a/js/views/app_view.js +++ b/js/views/app_view.js @@ -22,7 +22,7 @@ openInbox: 'openInbox', }, applyTheme() { - const theme = storage.get('theme-setting') || 'dark'; + const theme = storage.get('theme-setting') || 'light'; this.$el .removeClass('light-theme') .removeClass('dark-theme') diff --git a/ts/components/session/ActionsPanel.tsx b/ts/components/session/ActionsPanel.tsx index 661c1b345..6c4580254 100644 --- a/ts/components/session/ActionsPanel.tsx +++ b/ts/components/session/ActionsPanel.tsx @@ -57,10 +57,45 @@ export class ActionsPanel extends React.Component { }, 'refreshAvatarCallback' ); + + void this.showLightThemeDialogIfNeeded(); } ); } + public async showLightThemeDialogIfNeeded() { + const currentTheme = window.Events.getThemeSetting(); // defaults to light on new registration + if (currentTheme !== 'light') { + const message = 'Light Mode'; + const messageSub = + 'Feeling the dark side more? Just toggle the theme from the bottom-left moon icon.'; + const hasSeenLightMode = await getItemById('hasSeenLightModeDialog'); + + if (hasSeenLightMode?.value === true) { + // if hasSeen is set and true, we have nothing to do + return; + } + // force light them right now, then ask for permission + await window.Events.setThemeSetting('light'); + // FIXME add the SUN icon + window.confirmationDialog({ + message, + messageSub, + resolve: async () => { + const data = { + id: 'hasSeenLightModeDialog', + value: true, + }; + void createOrUpdateItem(data); + }, + okTheme: 'default primary', + hideCancel: true, + sessionIcon: SessionIconType.Sun, + iconSize: SessionIconSize.Max, + }); + } + } + public refreshAvatarCallback(conversation: any) { if (conversation.changed?.profileAvatar) { this.setState({ diff --git a/ts/components/session/RegistrationTabs.tsx b/ts/components/session/RegistrationTabs.tsx index 6faec374e..91c9cd3ce 100644 --- a/ts/components/session/RegistrationTabs.tsx +++ b/ts/components/session/RegistrationTabs.tsx @@ -12,6 +12,7 @@ import { SessionHtmlRenderer } from './SessionHTMLRenderer'; import { SessionIdEditable } from './SessionIdEditable'; import { SessionSpinner } from './SessionSpinner'; import { StringUtils, ToastUtils } from '../../session/utils'; +import { createOrUpdateItem } from '../../../js/modules/data'; enum SignInMode { Default, @@ -862,6 +863,12 @@ export class RegistrationTabs extends React.Component<{}, State> { language, trimName ); + // FIXME remove everything related to hasSeenLightModeDialog at some point in the future (27/08/2020) + const data = { + id: 'hasSeenLightModeDialog', + value: true, + }; + await createOrUpdateItem(data); trigger('openInbox'); } catch (e) { ToastUtils.push({