31 lines
838 B
TypeScript
31 lines
838 B
TypeScript
import React from 'react';
|
|
import { LuMoon, LuSun } from 'react-icons/lu';
|
|
import { useEvent } from '../hooks/useEvent';
|
|
import { Button } from 'antd';
|
|
import { useSettingsStore } from '../store/settings';
|
|
|
|
export const ColorSchemeSwitcher: React.FC = React.memo(() => {
|
|
const colorScheme = useSettingsStore((state) => state.colorScheme);
|
|
const handleSwitchColorScheme = useEvent(() => {
|
|
useSettingsStore.setState({
|
|
colorScheme: colorScheme === 'dark' ? 'light' : 'dark',
|
|
});
|
|
});
|
|
|
|
return (
|
|
<Button
|
|
icon={
|
|
colorScheme === 'dark' ? (
|
|
<LuMoon className="anticon" />
|
|
) : (
|
|
<LuSun className="anticon" />
|
|
)
|
|
}
|
|
shape="circle"
|
|
size="large"
|
|
onClick={handleSwitchColorScheme}
|
|
/>
|
|
);
|
|
});
|
|
ColorSchemeSwitcher.displayName = 'ColorSchemeSwitcher';
|