fix: backend framework options

src/components/highlight-code/code-viewer-dark.tsx

@@ -1,4 +1,3 @@
-import { memo } from 'react';
 import CodeViewer from './code-viewer';
 import './styles/dark.less';
 
@@ -38,4 +37,4 @@ const DarkViewer: React.FC<CodeViewerProps> = (props) => {
   );
 };
 
-export default memo(DarkViewer);
+export default DarkViewer;

src/components/highlight-code/code-viewer-light.tsx

@@ -1,4 +1,3 @@
-import { memo } from 'react';
 import CodeViewer from './code-viewer';
 import './styles/light.less';
 
@@ -39,4 +38,4 @@ const LightViewer: React.FC<CodeViewerProps> = (props) => {
   );
 };
 
-export default memo(LightViewer);
+export default LightViewer;

src/components/highlight-code/code-viewer.tsx

@@ -1,6 +1,6 @@
 import classNames from 'classnames';
 import hljs from 'highlight.js';
-import { memo, useMemo } from 'react';
+import { useMemo } from 'react';
 import styled from 'styled-components';
 import CopyButton from '../copy-button';
 import { escapeHtml } from './utils';
@@ -155,4 +155,4 @@ const CodeViewer: React.FC<CodeViewerProps> = (props) => {
   );
 };
 
-export default memo(CodeViewer);
+export default CodeViewer;

src/components/logs-viewer/xterm-viewer.tsx

@@ -6,7 +6,6 @@ import classNames from 'classnames';
 import _ from 'lodash';
 import {
   forwardRef,
-  memo,
   useEffect,
   useImperativeHandle,
   useRef,
@@ -176,4 +175,4 @@ const LogsViewer: React.FC<LogsViewerProps> = forwardRef((props, ref) => {
   );
 });
 
-export default memo(LogsViewer);
+export default LogsViewer;

src/config/index.ts

@@ -49,7 +49,7 @@ export const WatchEventType = {
 };
 
 export const PasswordReg =
-  /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*_+])[a-zA-Z\d!@#$%^&*_+]{6,12}$/;
+  /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*_+])[a-zA-Z\d!@#$%^&*_+]{6,32}$/;
 
 export const uppercaseReg = /(?=.*[A-Z])/;
 
@@ -61,7 +61,7 @@ export const specialCharacterReg = /(?=.*[\W_])/;
 
 export const noSpaceReg = /(?=\S+$)/;
 
-export const lengthReg = /^.{6,12}$/;
+export const lengthReg = /^.{6,32}$/;
 
 /**
  * Model name rules:

src/layouts/extraRender.tsx

@@ -10,30 +10,38 @@ import {
   DiscordOutlined,
   GithubOutlined,
   HomeOutlined,
-  InfoCircleOutlined,
   LogoutOutlined,
   ReadOutlined,
   SettingOutlined
 } from '@ant-design/icons';
 import { history, useIntl, useNavigate } from '@umijs/max';
-import { Avatar, Divider, Modal } from 'antd';
+import { Avatar, Button, Divider, Modal } from 'antd';
 import { useAtom } from 'jotai';
 import { useMemo } from 'react';
 import styled from 'styled-components';
 import { DEFAULT_ENTER_PAGE } from '../config/settings';
 
+const UpdateDot = styled.span`
+  margin-left: 5px;
+  display: flex;
+  width: 8px;
+  height: 8px;
+  border-radius: 4px;
+  background-color: var(--ant-orange-5);
+`;
+
 const NewLabel = styled.span`
   position: relative;
-  bottom: 3px;
+  top: -4px;
+  right: 4px;
+  padding: 2px 4px;
   display: flex;
   color: #fff;
-  width: 36px;
   height: 15px;
-  margin-left: 5px;
   justify-content: center;
   align-items: center;
   background-color: var(--ant-orange-5);
-  border-radius: 8px 8px 8px 0;
+  border-radius: 6px 6px 6px 0;
   transform: scale(0.9);
 
   .text {
@@ -187,11 +195,6 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
       icon: <ReadOutlined />,
       label: intl.formatMessage({ id: 'common.button.docs' }),
       url: externalLinks.documentation
-    },
-    {
-      key: 'version',
-      icon: <InfoCircleOutlined />,
-      label: intl.formatMessage({ id: 'common.button.version' })
     }
   ];
 
@@ -201,27 +204,14 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
       label: (
         <span className="flex flex-center">
           {item.icon}
-          {item.key === 'version' ? (
+          <a
-            <>
+            className="m-l-8 "
-              <a className="m-l-8">{item.label}</a>
+            href={item.url}
-              {showUpgrade && (
+            target="_blank"
-                <NewLabel>
+            rel="noreferrer"
-                  <span className="text">
+          >
-                    {intl.formatMessage({ id: 'common.text.new' })}
+            {item.label}
-                  </span>
+          </a>
-                </NewLabel>
-              )}
-            </>
-          ) : (
-            <a
-              className="m-l-8 "
-              href={item.url}
-              target="_blank"
-              rel="noreferrer"
-            >
-              {item.label}
-            </a>
-          )}
         </span>
       ),
       onClick() {
@@ -301,21 +291,37 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
   return (
     <Wrapper>
       {contextHolder}
+      <div
+        style={{
+          display: 'flex',
+          alignItems: 'center'
+        }}
+      >
+        <Button
+          type="text"
+          size="small"
+          onClick={showVersion}
+          style={{
+            color: 'var(--ant-color-text-tertiary)'
+          }}
+        >
+          {version.version}
+        </Button>
+        {showUpgrade && (
+          <NewLabel>
+            <span className="text">
+              {intl.formatMessage({ id: 'common.text.new' })}
+            </span>
+          </NewLabel>
+        )}
+      </div>
       <DropDownActions menu={{ ...helpMenu }} popupRender={helpPopupRender}>
         <IconWrapper>
-          <IconFont type="icon-help" className="font-size-20" />
+          <IconFont
-          {showUpgrade && (
+            type="icon-help"
-            <span
+            className="font-size-20"
-              className="m-l-5"
+            style={{ color: 'var(--ant-color-text-tertiary)' }}
-              style={{
+          />
-                display: 'flex',
-                width: 8,
-                height: 8,
-                borderRadius: 4,
-                backgroundColor: 'var(--ant-orange-5)'
-              }}
-            ></span>
-          )}
         </IconWrapper>
       </DropDownActions>
       <DropDownActions menu={{ ...userMenu }} popupRender={userPopupRender}>

src/pages/backends/forms/version-info.tsx

@@ -168,7 +168,7 @@ const VersionList: React.FC<{ versionConfigs: VersionListItem[] }> = ({
       <span>
         {option.label}
         {data.tips ? (
-          data.locale ? (
+          data.tipLocale ? (
             <span className="text-tertiary m-l-4">{` [${intl.formatMessage({ id: data.tips })}]`}</span>
           ) : (
             <span className="text-tertiary m-l-4">{` [${data.tips}]`}</span>

src/pages/cluster-management/hooks/use-cluster-list.ts

@@ -30,8 +30,8 @@ export default function useClusterList() {
       name: string;
     }[]
   >([]);
-  const [, setClusterListAtom] = useAtom(clusterListAtom);
+  const [clustersAtom, setClusterListAtom] = useAtom(clusterListAtom);
-  const [, setWorkerListAtom] = useAtom(workerListAtom);
+  const [workersAtom, setWorkerListAtom] = useAtom(workerListAtom);
 
   const fetchClusterList = async () => {
     try {
@@ -85,6 +85,8 @@ export default function useClusterList() {
   return {
     clusterList,
     workerList,
+    clustersAtom,
+    workersAtom,
     fetchAll,
     fetchWorkerList,
     fetchClusterList

src/pages/dashboard/components/active-table.tsx

@@ -4,7 +4,7 @@ import { modelCategoriesMap } from '@/pages/llmodels/config';
 import { convertFileSize } from '@/utils';
 import { useIntl } from '@umijs/max';
 import { Col, Row, Table } from 'antd';
-import { memo, useContext } from 'react';
+import { useContext } from 'react';
 import { DashboardContext } from '../config/dashboard-context';
 
 const NACategories = [
@@ -96,4 +96,4 @@ const ActiveTable = () => {
   );
 };
 
-export default memo(ActiveTable);
+export default ActiveTable;

src/pages/dashboard/components/over-view.tsx

@@ -74,4 +74,4 @@ const Overview: React.FC = () => {
   );
 };
 
-export default React.memo(Overview);
+export default Overview;

src/pages/dashboard/components/resource-utilization.tsx

@@ -2,7 +2,7 @@ import LineChart from '@/components/echarts/line-chart';
 import { useIntl } from '@umijs/max';
 import dayjs from 'dayjs';
 import _ from 'lodash';
-import { memo, useMemo } from 'react';
+import { useMemo } from 'react';
 
 const TypeKeyMap = {
   cpu: {
@@ -106,4 +106,4 @@ const UtilizationOvertime: React.FC<{
   );
 };
 
-export default memo(UtilizationOvertime);
+export default UtilizationOvertime;

src/pages/dashboard/index.tsx

@@ -12,9 +12,13 @@ import { DashboardProps } from './config/types';
 
 const Dashboard: React.FC = () => {
   const intl = useIntl();
-  const [loading, setLoading] = useState(false);
+  const [loadingStatus, setLoadingStatus] = useState({
+    loading: false,
+    loadend: false
+  });
   const [data, setData] = useState<DashboardProps>({} as DashboardProps);
-  const { fetchAll, clusterList, workerList } = useClusterList();
+  const { fetchAll, clusterList, workerList, clustersAtom, workersAtom } =
+    useClusterList();
 
   const { noResourceResult } = useNoResourceResult({
     loadend: true,
@@ -47,16 +51,22 @@ const Dashboard: React.FC = () => {
 
   const initData = useMemoizedFn(async () => {
     try {
-      setLoading(true);
+      setLoadingStatus({
+        loading: true,
+        loadend: false
+      });
       const { hasClusters, hasWorkers } = await fetchAll();
       if (!hasClusters || !hasWorkers) {
-        setLoading(false);
         return;
       }
       await fetchDashboardData();
-      setLoading(false);
     } catch (error) {
-      setLoading(false);
+      // ignore
+    } finally {
+      setLoadingStatus({
+        loading: false,
+        loadend: true
+      });
     }
   });
 
@@ -69,11 +79,11 @@ const Dashboard: React.FC = () => {
       value={{ ...data, fetchData: fetchDashboardData, clusterList }}
     >
       <PageBox>
-        <Spin spinning={loading} style={{ minHeight: 300 }}>
+        <Spin spinning={loadingStatus.loading} style={{ minHeight: 300 }}>
-          {(!clusterList.length || !workerList.length) && !loading ? (
+          {workersAtom.length > 0 && clustersAtom.length > 0 ? (
-            noResourceResult
-          ) : loading ? null : (
             <DashboardInner />
+          ) : loadingStatus.loading || !loadingStatus.loadend ? null : (
+            noResourceResult
           )}
         </Spin>
       </PageBox>

src/pages/playground/components/audio-input.tsx

@@ -372,4 +372,4 @@ const AudioInput: React.FC<AudioInputProps> = (props) => {
   );
 };
 
-export default React.memo(AudioInput);
+export default AudioInput;

src/pages/playground/components/file-list.tsx

@@ -48,4 +48,4 @@ const FileList: React.FC<FileListProps> = (props) => {
   );
 };
 
-export default React.memo(FileList);
+export default FileList;

src/pages/playground/components/model-parameters.tsx

@@ -4,7 +4,6 @@ import { Form } from 'antd';
 import _ from 'lodash';
 import React, {
   forwardRef,
-  memo,
   useCallback,
   useEffect,
   useId,
@@ -103,4 +102,4 @@ const ParamsSettings: React.FC<ParamsSettingsProps> = forwardRef(
   }
 );
 
-export default memo(ParamsSettings);
+export default ParamsSettings;

src/pages/playground/components/multiple-chat/active-models.tsx

@@ -39,4 +39,4 @@ const ActiveModels: React.FC<ActiveModelsProps> = (props) => {
   );
 };
 
-export default React.memo(ActiveModels);
+export default ActiveModels;

src/pages/playground/components/multiple-chat/content-item.tsx

@@ -244,4 +244,4 @@ const ContentItem: React.FC<MessageItemProps> = ({
   );
 };
 
-export default React.memo(ContentItem);
+export default ContentItem;

src/pages/playground/components/multiple-chat/message-content.tsx

@@ -54,4 +54,4 @@ const MessageContent: React.FC<MessageContentProps> = ({
   );
 };
 
-export default React.memo(MessageContent);
+export default MessageContent;

src/pages/playground/components/multiple-chat/model-item.tsx

@@ -366,4 +366,4 @@ const ModelItem: React.FC<ModelItemProps> = forwardRef((props, ref) => {
   );
 });
 
-export default React.memo(ModelItem);
+export default ModelItem;

src/pages/playground/components/multiple-chat/system-message.tsx

@@ -144,4 +144,4 @@ const SystemMessage: React.FC<SystemMessageProps> = (props) => {
   );
 };
 
-export default React.memo(SystemMessage);
+export default SystemMessage;

src/pages/playground/components/rerank-message.tsx

@@ -81,4 +81,4 @@ const RerankMessage: React.FC<RerankMessageProps> = ({ header, dataList }) => {
   );
 };
 
-export default React.memo(RerankMessage);
+export default RerankMessage;

src/pages/playground/components/upload-file.tsx

@@ -117,4 +117,4 @@ const UploadImg: React.FC<UploadImgProps> = ({
   );
 };
 
-export default React.memo(UploadImg);
+export default UploadImg;

src/pages/playground/index.tsx

@@ -161,7 +161,7 @@ const Playground: React.FC = () => {
             <Divider
               key="divider"
               type="vertical"
-              style={{ height: 24, marginInline: 16 }}
+              style={{ height: 16, marginInline: 16 }}
             />
           )}
         </div>,