oxen-io/session-desktop
1
0
Fork 0
mirror of https://github.com/oxen-io/session-desktop.git synced 2023-12-14 02:12:57 +01:00
Code Issues Projects Releases Wiki Activity

feat: consolidated theme switching code

Browse source
This commit is contained in:
William Grant 2022-10-11 11:00:31 +11:00
parent d0bd983ee3
commit 177e2df768
6 changed files with 37 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
stylesheets/_session_left_pane.scss
View file

@ -12,7 +12,8 @@ $session-compose-margin: 20px;
&-list-item {
background: var(--conversation-tab-background-color);
transition: var(--default-duration);
// TODO Theming, make everything have the default duration for transitioning colors
// transition: var(--default-duration);
&:hover {
background: var(--conversation-tab-background-hover-color);

2
ts/components/AboutView.tsx
View file

@ -1,6 +1,6 @@
import React, { useEffect } from 'react';
import styled from 'styled-components';
import { switchThemeTo } from '../session/utils/Theme';
import { switchThemeTo } from '../themes/switchTheme';
import { SessionTheme } from '../themes/SessionTheme';
const StyledContent = styled.div`

2
ts/components/DebugLogView.tsx
View file

@ -1,6 +1,6 @@
import React, { useEffect, useState } from 'react';
import styled from 'styled-components';
import { switchThemeTo } from '../session/utils/Theme';
import { switchThemeTo } from '../themes/switchTheme';
import { SessionTheme } from '../themes/SessionTheme';
import { fetch } from '../util/logging';
import { SessionButton, SessionButtonType } from './basic/SessionButton';

2
ts/components/SessionPasswordPrompt.tsx
View file

@ -5,7 +5,7 @@ import autoBind from 'auto-bind';
import { SessionButton, SessionButtonColor, SessionButtonType } from './basic/SessionButton';
import { SessionSpinner } from './basic/SessionSpinner';
import { SessionTheme } from '../themes/SessionTheme';
import { switchThemeTo } from '../session/utils/Theme';
import { switchThemeTo } from '../themes/switchTheme';
import styled from 'styled-components';
import { ToastUtils } from '../session/utils';
import { isString } from 'lodash';

45
ts/session/utils/Theme.tsx
View file

@ -1,45 +0,0 @@
import { Dispatch } from 'redux';
import { applyTheme } from '../../state/ducks/theme';
import { ThemeStateType } from '../../themes/constants/colors';
import { switchHtmlToDarkTheme, switchHtmlToLightTheme } from '../../themes/SessionTheme';
import { switchTheme } from '../../themes/switchTheme';
export async function switchThemeTo(
theme: ThemeStateType,
dispatch: Dispatch | null,
mainWindow: boolean = true
) {
if (mainWindow) {
await window.setTheme(theme);
}
let newTheme: ThemeStateType | null = null;
switch (theme) {
case 'classic-dark':
switchHtmlToDarkTheme();
newTheme = 'classic-dark';
break;
case 'classic-light':
switchHtmlToLightTheme();
newTheme = 'classic-light';
break;
case 'ocean-dark':
switchHtmlToDarkTheme();
newTheme = 'ocean-dark';
break;
case 'ocean-light':
switchHtmlToLightTheme();
newTheme = 'ocean-light';
break;
default:
window.log.warn('Unsupported theme: ', theme);
}
if (newTheme) {
switchTheme(newTheme, mainWindow);
if (dispatch) {
dispatch?.(applyTheme(newTheme));
}
}
}

40
ts/themes/switchTheme.tsx
View file

@ -1,23 +1,47 @@
import { Dispatch } from 'redux';
import { applyTheme } from '../state/ducks/theme';
import { classicDark, classicLight, oceanDark, oceanLight } from '.';
import { ThemeStateType } from './constants/colors';
import { switchHtmlToDarkTheme, switchHtmlToLightTheme } from './SessionTheme';
import { loadThemeColors } from './variableColors';
export async function switchTheme(theme: ThemeStateType) {
export async function switchThemeTo(
theme: ThemeStateType,
dispatch: Dispatch | null,
mainWindow: boolean = true
) {
if (mainWindow) {
await window.setTheme(theme);
}
let newTheme: ThemeStateType | null = null;
switch (theme) {
case 'classic-light':
loadThemeColors(classicLight);
break;
case 'classic-dark':
switchHtmlToDarkTheme();
loadThemeColors(classicDark);
newTheme = 'classic-dark';
break;
case 'ocean-light':
loadThemeColors(oceanLight);
case 'classic-light':
switchHtmlToLightTheme();
loadThemeColors(classicLight);
newTheme = 'classic-light';
break;
case 'ocean-dark':
switchHtmlToDarkTheme();
loadThemeColors(oceanDark);
newTheme = 'ocean-dark';
break;
case 'ocean-light':
switchHtmlToLightTheme();
loadThemeColors(oceanLight);
newTheme = 'ocean-light';
break;
default:
window.log.warn('Unsupported theme:', theme);
break;
window.log.warn('Unsupported theme: ', theme);
}
if (dispatch && newTheme) {
dispatch(applyTheme(newTheme));
}
}