mirror of
https://github.com/shlinkio/shlink-web-client.git
synced 2024-12-24 01:48:18 +03:00
27 lines
788 B
TypeScript
27 lines
788 B
TypeScript
|
import { FC } from 'react';
|
||
|
import { SimpleCard } from '../utils/SimpleCard';
|
||
|
import ToggleSwitch from '../utils/ToggleSwitch';
|
||
|
import { changeThemeInMarkup, Theme } from '../utils/theme';
|
||
|
import { Settings, UiSettings } from './reducers/settings';
|
||
|
|
||
|
interface UserInterfaceProps {
|
||
|
settings: Settings;
|
||
|
setUiSettings: (settings: UiSettings) => void;
|
||
|
}
|
||
|
|
||
|
export const UserInterface: FC<UserInterfaceProps> = ({ settings: { ui }, setUiSettings }) => (
|
||
|
<SimpleCard title="User interface">
|
||
|
<ToggleSwitch
|
||
|
checked={ui?.theme === 'dark'}
|
||
|
onChange={(useDarkTheme) => {
|
||
|
const theme: Theme = useDarkTheme ? 'dark' : 'light';
|
||
|
|
||
|
setUiSettings({ theme });
|
||
|
changeThemeInMarkup(theme);
|
||
|
}}
|
||
|
>
|
||
|
Use dark theme
|
||
|
</ToggleSwitch>
|
||
|
</SimpleCard>
|
||
|
);
|