Merge pull request #292 from jandiasnow-work/bugfix

fix: change isRecomended to isRecommended
kubeagi · Mar 29, 2024 · dc827a5 · dc827a5
2 parents 87ae2e0 + 70830f6
commit dc827a5
Show file tree

Hide file tree

Showing 7 changed files with 67 additions and 35 deletions.
diff --git a/src/pages/ModelAppDetail/Body/ConfigPlugins/index.tsx b/src/pages/ModelAppDetail/Body/ConfigPlugins/index.tsx
@@ -17,6 +17,17 @@ const apiKeyComponent = ({ names, updateValue }) => (
     label="API Key"
     labelCol={{ span: 4 }}
     name={[...(names || []), 'apiKey']}
+    required
+    rules={[
+      {
+        validator: (_, value, callback) => {
+          if (!value) {
+            return callback('请输入API Key');
+          }
+          return callback();
+        },
+      },
+    ]}
     style={{ marginBottom: 0 }}
     wrapperCol={{ span: 10 }}
   >
@@ -39,6 +50,7 @@ export const PLUGINS_MAP = [
     color: '#A16BF1',
     description: '从 Bing 搜索信息和网页',
     formComponent: apiKeyComponent,
+    validatorFields: ['apiKey'],
   },
   {
     id: 'Weather Query API',
@@ -48,6 +60,7 @@ export const PLUGINS_MAP = [
     description:
       '此插件用于查询当前和未来的天气状况。若用户输入城市名称或地区名称，该插件将回复该地区的天气情况',
     formComponent: apiKeyComponent,
+    validatorFields: ['apiKey'],
   },
   {
     id: 'Web Scraper',
@@ -74,8 +87,8 @@ const PanelSelect = props => {
     'linear-gradient( 137deg, #FEAD4C 0%, #F07C18 100%)',
     'linear-gradient( 137deg, #0ACAAE 0%, #04BE97 100%)',
   ];
-  const { tools, items, setTools, forceUpdate } = props;
-  const [activeKey, setActiveKey] = useState(items.map(item => item.id));
+  const { tools, items, setTools, forceUpdate, form } = props;
+  const [activeKey, setActiveKey] = useState([]);
   return (
     <div>
       {items.map((item, i) => {
@@ -154,12 +167,20 @@ const PanelSelect = props => {
                         ) : (
                           <Button
                             onClick={() => {
-                              setTools(
-                                tools.map(tool => ({
-                                  ...tool,
-                                  used: tool.name === item.id ? true : tool.used,
-                                }))
-                              );
+                              const validatorFields = item.validatorFields || [];
+                              form
+                                .validateFields(
+                                  validatorFields.map(key => ['tools', i, 'params', key]),
+                                  { force: true }
+                                )
+                                .then(() => {
+                                  setTools(
+                                    tools.map(tool => ({
+                                      ...tool,
+                                      used: tool.name === item.id ? true : tool.used,
+                                    }))
+                                  );
+                                });
                             }}
                             type="primary"
                           >

diff --git a/src/pages/ModelAppDetail/Body/index.less b/src/pages/ModelAppDetail/Body/index.less
@@ -82,6 +82,18 @@
     .tenx-ui-materials-collapse-content-box {
       padding: 20px 20px 20px 80px !important;
     }
+    .tenx-ui-materials-collapse-expand-icon {
+      position: absolute;
+
+      display: flex;
+      align-items: center;
+      justify-content: flex-end;
+
+      width: 792px;
+      height: 50px;
+
+      text-align: right;
+    }
   }
   .modalCollapseIcon {
     width: 40px;

diff --git a/src/pages/ModelAppDetail/Header/Edit/index.tsx b/src/pages/ModelAppDetail/Header/Edit/index.tsx
@@ -70,7 +70,7 @@ const Edit: React.FC<EditProps> = props => {
                 icon: imageUrl,
                 name: data?.name,
                 namespace: data?.namespace,
-                isRecomended: data?.metadata?.isRecomended,
+                isRecommended: data?.metadata?.isRecommended,
                 isPublic: data?.metadata?.isPublic,
               },
             });

diff --git a/src/pages/ModelAppDetail/Header/MetaData/index.tsx b/src/pages/ModelAppDetail/Header/MetaData/index.tsx
@@ -4,7 +4,6 @@ import React from 'react';
 
 import I18N from '@/utils/kiwiI18N';
 
-import utils from '../../../../utils/__utils';
 import styles from '../index.less';
 
 export interface RowData {
@@ -42,15 +41,10 @@ const Publish: React.FC<PublishProps> = props => {
           {
             key: 'name',
             span: 1,
-            label: '智能体名称',
+            label: '智能体分类',
             children: (
-              <Typography.Text
-                disabled={false}
-                ellipsis={{ tooltip: utils.getFullName(data) || '-' }}
-                strong={false}
-                style={{ maxWidth: 200 }}
-              >
-                {utils.getFullName(data)}
+              <Typography.Text disabled={false} strong={false} style={{ maxWidth: 200 }}>
+                {data?.annotations?.['arcadia.kubeagi.k8s.com.cn/app-category']}
               </Typography.Text>
             ),
           },

diff --git a/src/pages/ModelAppDetail/Header/Publish/index.tsx b/src/pages/ModelAppDetail/Header/Publish/index.tsx
@@ -92,6 +92,7 @@ export interface RowData {
     description?: string;
     icon?: string;
     category: string[];
+    isRecommended?: boolean;
   };
 }
 interface PublishProps {
@@ -126,7 +127,7 @@ const Publish: React.FC<PublishProps> = props => {
                 icon: data?.metadata?.icon,
                 isPublic: !data?.metadata?.isPublic,
                 category: data?.metadata?.annotations?.['arcadia.kubeagi.k8s.com.cn/app-category'],
-                isRecomended: data?.metadata?.isRecomended,
+                isRecommended: data?.metadata?.isRecommended,
               },
             });
             setOpen(false);

diff --git a/src/pages/ModelAppDetail/Header/index.less b/src/pages/ModelAppDetail/Header/index.less
@@ -32,3 +32,7 @@
     color: @font-color-3;
   }
 }
+.icon {
+  margin-right: 4px;
+  color: @font-color-3;
+}
diff --git a/src/pages/ModelAppDetail/Header/index.tsx b/src/pages/ModelAppDetail/Header/index.tsx
@@ -1,4 +1,4 @@
-import { StarFilled, StarOutlined } from '@ant-design/icons';
+import { ClockCircleOutlined, StarFilled, StarOutlined, UserOutlined } from '@ant-design/icons';
 import { AntdIconInfoCircleOutlined } from '@tenx-ui/icon-materials';
 import {
   Col,
@@ -71,8 +71,8 @@ const Header: React.FC<HeaderProps> = props => {
   };
 
   const recommendedDom = () => {
-    const isRecomended = data?.metadata?.isRecomended;
-    const handleRecomend = async () => {
+    const isRecommended = data?.metadata?.isRecommended;
+    const handleRecommend = async () => {
       try {
         await utils.bff.updateApplication({
           input: {
@@ -83,29 +83,29 @@ const Header: React.FC<HeaderProps> = props => {
             icon: data?.metadata?.icon,
             isPublic: data?.metadata?.isPublic,
             category: data?.metadata?.annotations?.['arcadia.kubeagi.k8s.com.cn/app-category'],
-            isRecomended: !isRecomended,
+            isRecommended: !isRecommended,
           },
         });
         refresh && refresh();
         notification.success({
-          message: isRecomended ? '取消推荐成功' : '推荐成功',
+          message: isRecommended ? '取消推荐成功' : '推荐成功',
         });
       } catch (error) {
         notification.warnings({
-          message: isRecomended ? '取消推荐失败' : '推荐失败',
+          message: isRecommended ? '取消推荐失败' : '推荐失败',
           errors: error?.response?.errors,
         });
       }
     };
     return (
       <span className={styles.recommended}>
-        {isRecomended ? (
+        {isRecommended ? (
           <Tooltip title="取消推荐">
-            <StarFilled className={styles.recommendedIcon} onClick={handleRecomend} />
+            <StarFilled className={styles.recommendedIcon} onClick={handleRecommend} />
           </Tooltip>
         ) : (
           <Tooltip title="推荐">
-            <StarOutlined className={styles.noRecommendedIcon} onClick={handleRecomend} />
+            <StarOutlined className={styles.noRecommendedIcon} onClick={handleRecommend} />
           </Tooltip>
         )}
       </span>
@@ -163,7 +163,6 @@ const Header: React.FC<HeaderProps> = props => {
                   </Typography.Title>
                 </Col>
                 <Col span={24}>
-                  <Typography.Text>状态：</Typography.Text>
                   <Typography.Text>
                     <Status
                       __component_name="Status"
@@ -192,17 +191,17 @@ const Header: React.FC<HeaderProps> = props => {
                   </Typography.Text>
 
                   <Divider dashed={false} mode="default" type="vertical" />
-                  <Typography.Text ellipsis={true} strong={false}>
-                    {I18N.ModelApp.chuangJianZhe}
-                  </Typography.Text>
+                  <Tooltip title="创建者">
+                    <UserOutlined className={styles.icon} />
+                  </Tooltip>
                   <Typography.Text ellipsis={true} strong={false}>
                     {data?.metadata?.creator || '-'}
                   </Typography.Text>
 
                   <Divider dashed={false} mode="default" type="vertical" />
-                  <Typography.Text disabled={false} ellipsis={true} strong={false}>
-                    更新时间：
-                  </Typography.Text>
+                  <Tooltip title="更新时间">
+                    <ClockCircleOutlined className={styles.icon} />
+                  </Tooltip>
                   <Typography.Time
                     format=""
                     relativeTime={false}
@@ -232,6 +231,7 @@ const Header: React.FC<HeaderProps> = props => {
                   {
                     key: 'edit',
                     label: I18N.ModelApp.bianJi,
+                    disabled: data?.metadata?.isPublic,
                   },
                   {
                     key: 'metadata',