fix: build file warnings

config/theme.ts

@@ -25,6 +25,9 @@ export default {
     Select: {
       itemSelectedBg: 'rgba(0,0,0,0.06)'
     },
+    Message: {
+      contentPadding: '12px 16px'
+    },
     Slider: {
       handleSize: 8,
       handleSizeHover: 8,

package.json

@@ -31,6 +31,8 @@
     "lodash": "^4.17.21",
     "numeral": "^2.0.6",
     "query-string": "^9.0.0",
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0",
     "react-hotkeys-hook": "^4.5.0",
     "umi-presets-pro": "^2.0.3"
   },

src/access.ts

@@ -1,6 +1,4 @@
 export default (initialState: { currentUser?: Global.UserInfo }) => {
-  // 在这里按照初始化数据定义项目中的权限，统一管理
-  // 参考文档 https://umijs.org/docs/max/access
   const canSeeAdmin = !!(
     initialState &&
     initialState.currentUser &&

src/app.tsx

@@ -11,14 +11,10 @@ const loginPath = '/login';
 let currentUserInfo: any = {};
 
 // 运行时配置
-
-// 全局初始化数据配置，用于 Layout 用户信息和权限初始化
-// 更多信息见文档：https://umijs.org/docs/api/runtime-config#getinitialstate
 export async function getInitialState(): Promise<{
   fetchUserInfo: () => Promise<Global.UserInfo>;
   currentUser?: Global.UserInfo;
 }> {
-  // 如果不是登录页面，执行
   const { location } = history;
 
   const fetchUserInfo = async (): Promise<Global.UserInfo> => {
@@ -36,7 +32,6 @@ export async function getInitialState(): Promise<{
   const getAppVersionInfo = async () => {
     try {
       const data = await queryVersionInfo();
-      console.log('versioninfo=========', data);
       setAtomStorage(GPUStackVersionAtom, data);
     } catch (error) {
       console.error('queryVersionInfo error', error);

src/components/drop-down-buttons/index.tsx

@@ -25,7 +25,7 @@ const DropdownButtons: React.FC<DropdownButtonsProps> = ({
   };
 
   if (!items?.length) {
-    return null;
+    return <span></span>;
   }
 
   return (

src/global.less

@@ -430,6 +430,41 @@ body {
   border-radius: 16px;
 }
 
+.ant-message-notice-wrapper {
+  .ant-message-notice-error {
+    .ant-message-notice-content {
+      background-color: var(--ant-color-error-bg);
+      color: var(--ant-color-error);
+    }
+  }
+
+  .ant-message-notice-success {
+    .ant-message-notice-content {
+      background-color: var(--ant-color-success-bg);
+      color: var(--ant-color-success);
+    }
+  }
+
+  .ant-message-notice-content {
+    border-radius: var(--border-radius-base) !important;
+    line-height: 2;
+    max-width: 300px;
+    text-align: left;
+    word-break: break-word;
+    box-shadow: var(--ant-box-shadow-secondary) !important;
+    max-height: 140px;
+    overflow-y: auto;
+
+    .anticon {
+      padding-top: 5px;
+    }
+  }
+
+  .ant-message-custom-content {
+    align-items: flex-start !important;
+  }
+}
+
 .background {
   position: fixed;
   top: 0;

src/models/global.ts

@@ -1,5 +1,3 @@
-// 全局共享数据示例
-// import { DEFAULT_NAME } from '@/constants';
 import { useState } from 'react';
 
 const useGlobalState = () => {

src/pages/api-keys/components/add-apikey.tsx

@@ -184,7 +184,13 @@ const AddModal: React.FC<AddModalProps> = ({
             <SealInput.Input
               label={intl.formatMessage({ id: 'apikeys.form.apikey' })}
               value={apikeyValue}
-              addAfter={<CopyButton text={apikeyValue}></CopyButton>}
+              addAfter={
+                <CopyButton
+                  text={apikeyValue}
+                  shape="default"
+                  size="small"
+                ></CopyButton>
+              }
             ></SealInput.Input>
           </Form.Item>
         )}

src/pages/api-keys/index.tsx

@@ -20,7 +20,7 @@ import {
 } from 'antd';
 import dayjs from 'dayjs';
 import _ from 'lodash';
-import { useEffect, useState } from 'react';
+import { StrictMode, useEffect, useState } from 'react';
 import { deleteApisKey, queryApisKeysList } from './apis';
 import AddAPIKeyModal from './components/add-apikey';
 import { ListItem } from './config/types';
@@ -179,7 +179,7 @@ const Models: React.FC = () => {
   }, [queryParams]);
 
   return (
-    <>
+    <StrictMode>
       <PageContainer
         ghost
         header={{
@@ -308,7 +308,7 @@ const Models: React.FC = () => {
         onCancel={handleModalCancel}
         onOk={handleModalOk}
       ></AddAPIKeyModal>
-    </>
+    </StrictMode>
   );
 };
 

src/pages/dashboard/index.tsx

@@ -1,17 +1,19 @@
 import { PageContainer } from '@ant-design/pro-components';
 import { Spin } from 'antd';
-import { memo, useState } from 'react';
+import { StrictMode, memo, useState } from 'react';
 import DashboardInner from './components/dahboard-inner';
 
 const Dashboard: React.FC = () => {
   const [loading, setLoading] = useState(false);
 
   return (
+    <StrictMode>
       <PageContainer ghost extra={[]}>
         <Spin spinning={loading}>
           <DashboardInner setLoading={setLoading} />
         </Spin>
       </PageContainer>
+    </StrictMode>
   );
 };
 

src/pages/llmodels/index.tsx

@@ -4,7 +4,7 @@ import useSetChunkRequest, {
 } from '@/hooks/use-chunk-request';
 import useUpdateChunkedList from '@/hooks/use-update-chunk-list';
 import _ from 'lodash';
-import { useCallback, useEffect, useRef, useState } from 'react';
+import { StrictMode, useCallback, useEffect, useRef, useState } from 'react';
 import { MODELS_API, MODEL_INSTANCE_API, queryModelsList } from './apis';
 import TableList from './components/table-list';
 import { ListItem } from './config/types';
@@ -168,6 +168,7 @@ const Models: React.FC = () => {
   }, [queryParams]);
 
   return (
+    <StrictMode>
       <TableContext.Provider
         value={{
           allChildren: modelInstances
@@ -186,6 +187,7 @@ const Models: React.FC = () => {
           fetchData={fetchData}
         ></TableList>
       </TableContext.Provider>
+    </StrictMode>
   );
 };
 

src/pages/playground/index.tsx

@@ -1,7 +1,7 @@
 import { PageContainer } from '@ant-design/pro-components';
 import { useSearchParams } from '@umijs/max';
 import { Divider } from 'antd';
-import { useState } from 'react';
+import { StrictMode, useState } from 'react';
 import GroundLeft from './components/ground-left';
 import ParamsSettings from './components/params-settings';
 import './style/play-ground.less';
@@ -12,7 +12,7 @@ const Playground: React.FC = () => {
   const [params, setParams] = useState({});
 
   return (
-    <div>
+    <StrictMode>
       <PageContainer ghost extra={[]}>
         <div className="play-ground">
           <div className="chat">
@@ -27,7 +27,7 @@ const Playground: React.FC = () => {
           </div>
         </div>
       </PageContainer>
-    </div>
+    </StrictMode>
   );
 };
 

src/pages/profile/index.tsx

@@ -6,7 +6,6 @@ import { updatePassword } from '@/pages/login/apis';
 import { PageContainer } from '@ant-design/pro-components';
 import { useIntl } from '@umijs/max';
 import { Form, message } from 'antd';
-import { StrictMode } from 'react';
 
 interface ProfileProps {
   username?: string;
@@ -35,7 +34,6 @@ const Profile: React.FC = () => {
   };
 
   return (
-    <StrictMode>
     <PageContainer
       ghost
       header={{
@@ -127,7 +125,6 @@ const Profile: React.FC = () => {
         ></FormButtons>
       </Form>
     </PageContainer>
-    </StrictMode>
   );
 };
 

src/pages/resources/index.tsx

@@ -2,7 +2,7 @@ import { PageContainer } from '@ant-design/pro-components';
 import { useIntl } from '@umijs/max';
 import type { TabsProps } from 'antd';
 import { Tabs } from 'antd';
-import { useState } from 'react';
+import { StrictMode, useState } from 'react';
 import GPUs from './components/gpus';
 import Workers from './components/workers';
 
@@ -29,6 +29,7 @@ const Resources = () => {
   };
 
   return (
+    <StrictMode>
       <PageContainer
         ghost
         header={{
@@ -46,6 +47,7 @@ const Resources = () => {
           ></Tabs>
         </div>
       </PageContainer>
+    </StrictMode>
   );
 };
 

src/pages/users/index.tsx

@@ -18,7 +18,7 @@ import { useIntl } from '@umijs/max';
 import { Button, Input, Modal, Space, Table, message } from 'antd';
 import dayjs from 'dayjs';
 import _ from 'lodash';
-import { useEffect, useState } from 'react';
+import { StrictMode, useEffect, useState } from 'react';
 import { createUser, deleteUser, queryUsersList, updateUser } from './apis';
 import AddModal from './components/add-modal';
 import { FormData, ListItem } from './config/types';
@@ -201,7 +201,7 @@ const Users: React.FC = () => {
   }, [queryParams]);
 
   return (
-    <>
+    <StrictMode>
       <PageContainer
         ghost
         header={{
@@ -330,7 +330,7 @@ const Users: React.FC = () => {
         onCancel={handleModalCancel}
         onOk={handleModalOk}
       ></AddModal>
-    </>
+    </StrictMode>
   );
 };