fix: fix bugs with theme berry (#931)

* fix: home page & logo style issue

* improve: Enhanced user experience by improving the channel selection box

* fix: key cannot be activated after expiration

README.md

@@ -414,6 +414,9 @@ https://openai.justsong.cn
 8. 升级之前数据库需要做变更吗？
    + 一般情况下不需要，系统将在初始化的时候自动调整。
    + 如果需要的话，我会在更新日志中说明，并给出脚本。
+9. 手动修改数据库后报错：`数据库一致性已被破坏，请联系管理员`？
+   + 这是检测到 ability 表里有些记录的通道 id 是不存在的，这大概率是因为你删了 channel 表里的记录但是没有同步在 ability 表里清理无效的通道。
+   + 对于每一个通道，其所支持的模型都需要有一个专门的 ability 表的记录，表示该通道支持该模型。
 
 ## 相关项目
 * [FastGPT](https://github.com/labring/FastGPT): 基于 LLM 大语言模型的知识库问答系统

common/constants.go

@@ -101,6 +101,10 @@ var RelayTimeout = GetOrDefault("RELAY_TIMEOUT", 0) // unit is second
 var GeminiSafetySetting = GetOrDefaultString("GEMINI_SAFETY_SETTING", "BLOCK_NONE")
 
 var Theme = GetOrDefaultString("THEME", "default")
+var ValidThemes = map[string]bool{
+	"default": true,
+	"berry":   true,
+}
 
 const (
 	RequestIdKey = "X-Oneapi-Request-Id"

controller/option.go

@@ -42,6 +42,14 @@ func UpdateOption(c *gin.Context) {
 		return
 	}
 	switch option.Key {
+	case "Theme":
+		if !common.ValidThemes[option.Value] {
+			c.JSON(http.StatusOK, gin.H{
+				"success": false,
+				"message": "无效的主题",
+			})
+			return
+		}
 	case "GitHubOAuthEnabled":
 		if option.Value == "true" && common.GitHubClientId == "" {
 			c.JSON(http.StatusOK, gin.H{

main.go

@@ -20,7 +20,7 @@ var buildFS embed.FS
 
 func main() {
 	common.SetupLogger()
-	common.SysLog(fmt.Sprintf("One API %s started with theme %s", common.Version, common.Theme))
+	common.SysLog(fmt.Sprintf("One API %s started", common.Version))
 	if os.Getenv("GIN_MODE") != "debug" {
 		gin.SetMode(gin.ReleaseMode)
 	}
@@ -47,6 +47,7 @@ func main() {
 
 	// Initialize options
 	model.InitOptionMap()
+	common.SysLog(fmt.Sprintf("using theme %s", common.Theme))
 	if common.RedisEnabled {
 		// for compatibility with old versions
 		common.MemoryCacheEnabled = true

web/README.md

@@ -8,7 +8,9 @@
 
 1. 在 `web` 文件夹下新建一个文件夹，文件夹名为主题名。
 2. 把你的主题文件放到这个文件夹下。
-3. 修改 `package.json` 文件，把 `build` 命令改为：`"build": "react-scripts build && mv -f build ../build/default"`，其中 `default` 为你的主题名。
+3. 修改你的 `package.json` 文件，把 `build` 命令改为：`"build": "react-scripts build && mv -f build ../build/default"`，其中 `default` 为你的主题名。
+4. 修改 `common/constants.go` 中的 `ValidThemes`，把你的主题名称注册进去。
+5. 修改 `web/THEMES` 文件，这里也需要同步修改。
 
 ## 主题列表
 

web/berry/src/layout/MinimalLayout/index.js

@@ -26,7 +26,7 @@ const MinimalLayout = () => {
           <Header />
         </Toolbar>
       </AppBar>
-      <Box sx={{ flex: '1 1 auto', overflow: 'auto' }} paddingTop={'64px'}>
+      <Box sx={{ flex: '1 1 auto', overflow: 'auto' }} marginTop={'80px'}>
         <Outlet />
       </Box>
       <Box sx={{ flex: 'none' }}>

web/berry/src/menu-items/panel.js

@@ -87,7 +87,7 @@ const panel = {
       url: '/panel/profile',
       icon: icons.IconUserScan,
       breadcrumbs: false,
-      isAdmin: true
+      isAdmin: false
     },
     {
       id: 'setting',

web/berry/src/ui-component/Logo.js

@@ -15,7 +15,7 @@ import { useSelector } from 'react-redux';
 const Logo = () => {
   const siteInfo = useSelector((state) => state.siteInfo);
 
-  return <img src={siteInfo.logo || logo} alt={siteInfo.system_name} width="80" />;
+  return <img src={siteInfo.logo || logo} alt={siteInfo.system_name} height="50" />;
 };
 
 export default Logo;

web/berry/src/utils/api.js

@@ -14,7 +14,7 @@ API.interceptors.response.use(
     if (error.response?.status === 401) {
       localStorage.removeItem('user');
       store.dispatch({ type: LOGIN, payload: null });
-      window.location.href = config.basename + '/login';
+      window.location.href = config.basename + 'login';
     }
 
     if (error.response?.data?.message) {

web/berry/src/views/Authentication/AuthForms/AuthLogin.js

@@ -92,7 +92,7 @@ const LoginForm = ({ ...others }) => {
                   <Box sx={{ mr: { xs: 1, sm: 2, width: 20 }, display: 'flex', alignItems: 'center' }}>
                     <img src={Github} alt="github" width={25} height={25} style={{ marginRight: matchDownSM ? 8 : 16 }} />
                   </Box>
-                  使用 Github 登录
+                  使用 GitHub 登录
                 </Button>
               </AnimateButton>
             </Grid>
@@ -115,7 +115,7 @@ const LoginForm = ({ ...others }) => {
                   <Box sx={{ mr: { xs: 1, sm: 2, width: 20 }, display: 'flex', alignItems: 'center' }}>
                     <img src={Wechat} alt="Wechat" width={25} height={25} style={{ marginRight: matchDownSM ? 8 : 16 }} />
                   </Box>
-                  使用 Wechat 登录
+                  使用微信登录
                 </Button>
               </AnimateButton>
               <WechatModal open={openWechat} handleClose={handleWechatClose} wechatLogin={wechatLogin} qrCode={siteInfo.wechat_qrcode} />

web/berry/src/views/Channel/component/EditModal.js

@@ -21,12 +21,18 @@ import {
   Container,
   Autocomplete,
   FormHelperText,
+  Checkbox
 } from "@mui/material";
 
 import { Formik } from "formik";
 import * as Yup from "yup";
 import { defaultConfig, typeConfig } from "../type/Config"; //typeConfig
 import { createFilterOptions } from "@mui/material/Autocomplete";
+import CheckBoxOutlineBlankIcon from '@mui/icons-material/CheckBoxOutlineBlank';
+import CheckBoxIcon from '@mui/icons-material/CheckBox';
+
+const icon = <CheckBoxOutlineBlankIcon fontSize="small" />;
+const checkedIcon = <CheckBoxIcon fontSize="small" />;
 
 const filter = createFilterOptions();
 const validationSchema = Yup.object().shape({
@@ -38,12 +44,10 @@ const validationSchema = Yup.object().shape({
     then: Yup.string().required("密钥 不能为空"),
   }),
   other: Yup.string(),
-  proxy: Yup.string(),
-  test_model: Yup.string(),
   models: Yup.array().min(1, "模型 不能为空"),
   groups: Yup.array().min(1, "用户组 不能为空"),
   base_url: Yup.string().when("type", {
-    is: (value) => [3, 24, 8].includes(value),
+    is: (value) => [3, 8].includes(value),
     then: Yup.string().required("渠道API地址 不能为空"), // base_url 是必需的
     otherwise: Yup.string(), // 在其他情况下，base_url 可以是任意字符串
   }),
@@ -146,8 +150,23 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
   const fetchModels = async () => {
     try {
       let res = await API.get(`/api/channel/models`);
+      const { data } = res.data;
+      data.forEach(item => {
+        if (!item.owned_by) {
+          item.owned_by = "未知";
+        }
+      });
+      // 先对data排序
+      data.sort((a, b) => {
+        const ownedByComparison = a.owned_by.localeCompare(b.owned_by);
+        if (ownedByComparison === 0) {
+          return a.id.localeCompare(b.id);
+        }
+        return ownedByComparison;
+      });
+
       setModelOptions(
-        res.data.data.map((model) => {
+         data.map((model) => {
           return {
             id: model.id,
             group: model.owned_by,
@@ -239,6 +258,7 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
           2
         );
       }
+      data.base_url = data.base_url ?? '';
       data.is_edit = true;
       initChannel(data.type);
       setInitialInput(data);
@@ -250,12 +270,16 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
   useEffect(() => {
     fetchGroups().then();
     fetchModels().then();
+  }, []);
+
+  useEffect(() => {
     if (channelId) {
       loadChannel().then();
     } else {
       initChannel(1);
       setInitialInput({ ...defaultConfig.input, is_edit: false });
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [channelId]);
 
   return (
@@ -491,7 +515,8 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
                     handleChange(event);
                   }}
                   onBlur={handleBlur}
-                  filterSelectedOptions
+                  // filterSelectedOptions
+                  disableCloseOnSelect
                   renderInput={(params) => (
                     <TextField
                       {...params}
@@ -524,6 +549,12 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
                     }
                     return filtered;
                   }}
+                  renderOption={(props, option, { selected }) => (
+                    <li {...props}>
+                      <Checkbox icon={icon} checkedIcon={checkedIcon} style={{ marginRight: 8 }} checked={selected} />
+                      {option.id}
+                    </li>
+                  )}
                 />
                 {errors.models ? (
                   <FormHelperText error id="helper-tex-channel-models-label">
@@ -623,71 +654,6 @@ const EditModal = ({ open, channelId, onCancel, onOk }) => {
                   </FormHelperText>
                 )}
               </FormControl>
-              <FormControl
-                fullWidth
-                error={Boolean(touched.proxy && errors.proxy)}
-                sx={{ ...theme.typography.otherInput }}
-              >
-                <InputLabel htmlFor="channel-proxy-label">
-                  {inputLabel.proxy}
-                </InputLabel>
-                <OutlinedInput
-                  id="channel-proxy-label"
-                  label={inputLabel.proxy}
-                  type="text"
-                  value={values.proxy}
-                  name="proxy"
-                  onBlur={handleBlur}
-                  onChange={handleChange}
-                  inputProps={{}}
-                  aria-describedby="helper-text-channel-proxy-label"
-                />
-                {touched.proxy && errors.proxy ? (
-                  <FormHelperText error id="helper-tex-channel-proxy-label">
-                    {errors.proxy}
-                  </FormHelperText>
-                ) : (
-                  <FormHelperText id="helper-tex-channel-proxy-label">
-                    {" "}
-                    {inputPrompt.proxy}{" "}
-                  </FormHelperText>
-                )}
-              </FormControl>
-              {inputPrompt.test_model && (
-                <FormControl
-                  fullWidth
-                  error={Boolean(touched.test_model && errors.test_model)}
-                  sx={{ ...theme.typography.otherInput }}
-                >
-                  <InputLabel htmlFor="channel-test_model-label">
-                    {inputLabel.test_model}
-                  </InputLabel>
-                  <OutlinedInput
-                    id="channel-test_model-label"
-                    label={inputLabel.test_model}
-                    type="text"
-                    value={values.test_model}
-                    name="test_model"
-                    onBlur={handleBlur}
-                    onChange={handleChange}
-                    inputProps={{}}
-                    aria-describedby="helper-text-channel-test_model-label"
-                  />
-                  {touched.test_model && errors.test_model ? (
-                    <FormHelperText
-                      error
-                      id="helper-tex-channel-test_model-label"
-                    >
-                      {errors.test_model}
-                    </FormHelperText>
-                  ) : (
-                    <FormHelperText id="helper-tex-channel-test_model-label">
-                      {" "}
-                      {inputPrompt.test_model}{" "}
-                    </FormHelperText>
-                  )}
-                </FormControl>
-              )}
               <DialogActions>
                 <Button onClick={onCancel}>取消</Button>
                 <Button

web/berry/src/views/Token/component/TableRow.js

@@ -192,7 +192,7 @@ export default function TokensTableRow({ item, manageToken, handleOpenModal, set
               id={`switch-${item.id}`}
               checked={statusSwitch === 1}
               onChange={handleStatus}
-              disabled={statusSwitch !== 1 && statusSwitch !== 2}
+              // disabled={statusSwitch !== 1 && statusSwitch !== 2}
             />
           </Tooltip>
         </TableCell>