180 lines
4.4 KiB
JavaScript
180 lines
4.4 KiB
JavaScript
import Box from "@mui/material/Box";
|
|
import Stack from "@mui/material/Stack";
|
|
import InputLabel from "@mui/material/InputLabel";
|
|
import TextField from "@mui/material/TextField";
|
|
import MenuItem from "@mui/material/MenuItem";
|
|
import FormControl from "@mui/material/FormControl";
|
|
import Select from "@mui/material/Select";
|
|
import { useSetting, useSettingUpdate } from "../../hooks/Setting";
|
|
import { limitNumber } from "../../libs/utils";
|
|
import { useI18n } from "../../hooks/I18n";
|
|
import { UI_LANGS } from "../../config";
|
|
import { apiSyncAll } from "../../apis/data";
|
|
import { useCallback } from "react";
|
|
|
|
export default function Settings() {
|
|
const i18n = useI18n();
|
|
const setting = useSetting();
|
|
const updateSetting = useSettingUpdate();
|
|
|
|
const handleSyncBlur = useCallback(async () => {
|
|
try {
|
|
await apiSyncAll();
|
|
} catch (err) {
|
|
console.log("sync data", err);
|
|
}
|
|
}, []);
|
|
|
|
if (!setting) {
|
|
return;
|
|
}
|
|
|
|
const {
|
|
uiLang,
|
|
googleUrl,
|
|
fetchLimit,
|
|
openaiUrl,
|
|
openaiKey,
|
|
openaiModel,
|
|
openaiPrompt,
|
|
clearCache,
|
|
syncUrl,
|
|
syncKey,
|
|
} = setting;
|
|
|
|
return (
|
|
<Box>
|
|
<Stack spacing={3}>
|
|
<FormControl size="small">
|
|
<InputLabel>{i18n("ui_lang")}</InputLabel>
|
|
<Select
|
|
value={uiLang}
|
|
label={i18n("ui_lang")}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
uiLang: e.target.value,
|
|
});
|
|
}}
|
|
>
|
|
{UI_LANGS.map(([lang, name]) => (
|
|
<MenuItem value={lang}>{name}</MenuItem>
|
|
))}
|
|
</Select>
|
|
</FormControl>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("fetch_limit")}
|
|
type="number"
|
|
defaultValue={fetchLimit}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
fetchLimit: limitNumber(e.target.value, 1, 10),
|
|
});
|
|
}}
|
|
/>
|
|
|
|
<FormControl size="small">
|
|
<InputLabel>{i18n("clear_cache")}</InputLabel>
|
|
<Select
|
|
value={clearCache}
|
|
label={i18n("clear_cache")}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
clearCache: e.target.value,
|
|
});
|
|
}}
|
|
>
|
|
<MenuItem value={false}>{i18n("clear_cache_never")}</MenuItem>
|
|
<MenuItem value={true}>{i18n("clear_cache_restart")}</MenuItem>
|
|
</Select>
|
|
</FormControl>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("google_api")}
|
|
defaultValue={googleUrl}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
googleUrl: e.target.value,
|
|
});
|
|
}}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("openai_api")}
|
|
defaultValue={openaiUrl}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
openaiUrl: e.target.value,
|
|
});
|
|
}}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
type="password"
|
|
label={i18n("openai_key")}
|
|
defaultValue={openaiKey}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
openaiKey: e.target.value,
|
|
});
|
|
}}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("openai_model")}
|
|
defaultValue={openaiModel}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
openaiModel: e.target.value,
|
|
});
|
|
}}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("openai_prompt")}
|
|
defaultValue={openaiPrompt}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
openaiPrompt: e.target.value,
|
|
});
|
|
}}
|
|
multiline
|
|
minRows={2}
|
|
maxRows={10}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
label={i18n("data_sync_url")}
|
|
defaultValue={syncUrl}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
syncUrl: e.target.value,
|
|
});
|
|
}}
|
|
onBlur={handleSyncBlur}
|
|
/>
|
|
|
|
<TextField
|
|
size="small"
|
|
type="password"
|
|
label={i18n("data_sync_key")}
|
|
defaultValue={syncKey}
|
|
onChange={(e) => {
|
|
updateSetting({
|
|
syncKey: e.target.value,
|
|
});
|
|
}}
|
|
onBlur={handleSyncBlur}
|
|
/>
|
|
</Stack>
|
|
</Box>
|
|
);
|
|
}
|