Fix re-selection of custom theme (#7470)
This commit is contained in:
parent
37b245d461
commit
4a79147402
2 changed files with 12 additions and 9 deletions
|
|
@ -17,13 +17,14 @@ type CustomThemeProps = {
|
|||
const CustomTheme = ({setTheme, displayTheme}: CustomThemeProps) => {
|
||||
const intl = useIntl();
|
||||
const theme = useTheme();
|
||||
|
||||
return (
|
||||
<>
|
||||
<SettingSeparator isGroupSeparator={true}/>
|
||||
<SettingOption
|
||||
action={setTheme}
|
||||
type='select'
|
||||
value={theme.type}
|
||||
value={'custom'}
|
||||
label={intl.formatMessage({id: 'settings_display.custom_theme', defaultMessage: 'Custom Theme'})}
|
||||
selected={theme.type?.toLowerCase() === displayTheme?.toLowerCase()}
|
||||
radioItemProps={radioItemProps}
|
||||
|
|
|
|||
|
|
@ -25,27 +25,29 @@ type DisplayThemeProps = {
|
|||
const DisplayTheme = ({allowedThemeKeys, componentId, currentTeamId, currentUserId}: DisplayThemeProps) => {
|
||||
const serverUrl = useServerUrl();
|
||||
const theme = useTheme();
|
||||
const initialTheme = useMemo(() => theme.type, [/* dependency array should remain empty */]);
|
||||
const initialTheme = useMemo(() => theme, [/* dependency array should remain empty */]);
|
||||
|
||||
const close = () => popTopScreen(componentId);
|
||||
|
||||
const setThemePreference = useCallback((newTheme?: string) => {
|
||||
const allowedTheme = allowedThemeKeys.find((tk) => tk === newTheme);
|
||||
const differentTheme = initialTheme?.toLowerCase() !== newTheme?.toLowerCase();
|
||||
const differentTheme = theme.type?.toLowerCase() !== newTheme?.toLowerCase();
|
||||
|
||||
if (!allowedTheme || !differentTheme) {
|
||||
if (!differentTheme) {
|
||||
close();
|
||||
return;
|
||||
}
|
||||
|
||||
const themeJson = Preferences.THEMES[allowedTheme as ThemeKey] || initialTheme;
|
||||
|
||||
const pref: PreferenceType = {
|
||||
category: Preferences.CATEGORIES.THEME,
|
||||
name: currentTeamId,
|
||||
user_id: currentUserId,
|
||||
value: JSON.stringify(Preferences.THEMES[allowedTheme as ThemeKey]),
|
||||
value: JSON.stringify(themeJson),
|
||||
};
|
||||
savePreference(serverUrl, [pref]);
|
||||
}, [allowedThemeKeys, currentTeamId, initialTheme, serverUrl]);
|
||||
}, [allowedThemeKeys, currentTeamId, theme.type, serverUrl]);
|
||||
|
||||
useAndroidHardwareBackHandler(componentId, setThemePreference);
|
||||
|
||||
|
|
@ -54,12 +56,12 @@ const DisplayTheme = ({allowedThemeKeys, componentId, currentTeamId, currentUser
|
|||
<ThemeTiles
|
||||
allowedThemeKeys={allowedThemeKeys}
|
||||
onThemeChange={setThemePreference}
|
||||
selectedTheme={initialTheme}
|
||||
selectedTheme={theme.type}
|
||||
/>
|
||||
{theme.type === 'custom' && (
|
||||
{initialTheme.type === 'custom' && (
|
||||
<CustomTheme
|
||||
setTheme={setThemePreference}
|
||||
displayTheme={initialTheme}
|
||||
displayTheme={initialTheme.type}
|
||||
/>
|
||||
)}
|
||||
</SettingContainer>
|
||||
|
|
|
|||
Loading…
Reference in a new issue