argo-cd

1
import {services, ViewPreferences} from '../../../shared/services';
2
import * as React from 'react';
3
import {ToggleButton} from '../../../shared/components/toggle-button';
4

5
// DarkModeToggleButton is a component that renders a toggle button that toggles dark mode.
6
export const DarkModeToggleButton = ({prefs}: {prefs: ViewPreferences}) => (
7
    <ToggleButton
8
        title='Dark Mode'
9
        onToggle={() => {
10
            const inverted = prefs.appDetails.darkMode;
11
            services.viewPreferences.updatePreferences({
12
                ...prefs,
13
                appDetails: {...prefs.appDetails, darkMode: !inverted}
14
            });
15
        }}
16
        toggled={prefs.appDetails.darkMode}
17
        icon='moon'
18
    />
19
);
20