opensource/sqlchat
1
0
Fork 0
mirror of https://github.com/sqlchat/sqlchat.git synced 2025-09-28 02:24:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: implement Popover kit component

Browse Source
This commit is contained in:
steven
2023-04-12 17:00:21 +08:00
parent ce7ed9e821
commit 63ece9d969
9 changed files with 102 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/ThemeSelector.tsx
View File

@ -1,3 +1,4 @@
import { useTranslation } from "react-i18next";
import { useSettingStore } from "@/store";
import { Theme } from "@/types";
import Select from "./kit/Select";
@ -7,30 +8,31 @@ interface ThemeItem {
label: string;
}
const themeItemList: ThemeItem[] = [
{
value: "system",
label: "System",
},
{
value: "light",
label: "Light",
},
{
value: "dark",
label: "Dark",
},
];
const ThemeSelector = () => {
const { t } = useTranslation();
const settingStore = useSettingStore();
const theme = settingStore.setting.theme;
const themeItemList: ThemeItem[] = [
{
value: "system",
label: t("setting.theme.system"),
},
{
value: "light",
label: t("setting.theme.light"),
},
{
value: "dark",
label: t("setting.theme.dark"),
},
];
const handleThemeChange = (theme: Theme) => {
settingStore.setTheme(theme);
};
return <Select className="w-28" value={theme} itemList={themeItemList} onValueChange={handleThemeChange} />;
return <Select className="w-40" value={theme} itemList={themeItemList} onValueChange={handleThemeChange} />;
};
export default ThemeSelector;