feat(web): Unified frontend code style

dbgpt/_private/config.py

@@ -332,17 +332,6 @@ def __init__(self) -> None:
             os.getenv("MULTI_INSTANCE", "False").lower() == "true"
         )
 
-        # file server configuration
-        # The host of the current file server, if None, get the host automatically
-        self.FILE_SERVER_HOST = os.getenv("FILE_SERVER_HOST")
-        self.FILE_SERVER_LOCAL_STORAGE_PATH = os.getenv(
-            "FILE_SERVER_LOCAL_STORAGE_PATH"
-        )
-        # multi-instance flag
-        self.WEBSERVER_MULTI_INSTANCE = (
-            os.getenv("MULTI_INSTANCE", "False").lower() == "true"
-        )
-
     @property
     def local_db_manager(self) -> "ConnectorManager":
         from dbgpt.datasource.manages import ConnectorManager

web/.eslintignore

@@ -0,0 +1,3 @@
+node_modules/
+build/
+dist/

web/.eslintrc.js

@@ -0,0 +1,57 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+    commonjs: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react/recommended',
+    'plugin:react-hooks/recommended',
+    'plugin:prettier/recommended',
+    'prettier',
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    ecmaFeatures: {
+      jsx: true,
+    },
+    ecmaVersion: 'latest',
+    sourceType: 'module',
+  },
+  plugins: ['@typescript-eslint', 'prettier'],
+  rules: {
+    'prettier/prettier': 'error',
+    'react/react-in-jsx-scope': 'off',
+    'react/prop-types': 'off',
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-unused-expressions': ['error', { allowShortCircuit: true, allowTernary: true }],
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      {
+        args: 'all',
+        argsIgnorePattern: '^_',
+        caughtErrors: 'all',
+        caughtErrorsIgnorePattern: '^_',
+        destructuredArrayIgnorePattern: '^_',
+        varsIgnorePattern: '^_',
+        ignoreRestSiblings: true,
+      },
+    ],
+    quotes: ['error', 'single', { allowTemplateLiterals: true, avoidEscape: true }],
+    semi: ['error', 'always'],
+  },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+    'import/resolver': {
+      typescript: {
+        alwaysTryTypes: true,
+        project: './tsconfig.json',
+      },
+    },
+  },
+};

web/.prettierignore

@@ -0,0 +1,3 @@
+node_modules/
+build/
+dist/

web/.prettierrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  printWidth: 120,
+  tabWidth: 2,
+  useTabs: false,
+  semi: true,
+  singleQuote: true,
+  jsxSingleQuote: true,
+  trailingComma: "all",
+  bracketSpacing: true,
+  jsxBracketSameLine: false,
+  arrowParens: "avoid",
+  plugins: [
+    require.resolve('prettier-plugin-organize-imports'),
+    require.resolve('prettier-plugin-packagejson'),
+  ]
+}

web/app/chat-context.tsx

@@ -1,11 +1,11 @@
-import { apiInterceptors, getDialogueList, getUsableModels, queryAdminList } from '@/client/api';
+import { apiInterceptors, getUsableModels, queryAdminList } from '@/client/api';
 import { ChatHistoryResponse, DialogueListResponse, IChatDialogueSchema } from '@/types/chat';
 import { UserInfoResponse } from '@/types/userinfo';
 import { getUserId } from '@/utils';
 import { STORAGE_THEME_KEY } from '@/utils/constants/index';
 import { useRequest } from 'ahooks';
 import { useSearchParams } from 'next/navigation';
-import { createContext, useEffect, useMemo, useState } from 'react';
+import { createContext, useEffect, useState } from 'react';
 
 type ThemeMode = 'dark' | 'light';
 
@@ -109,7 +109,7 @@ const ChatContextProvider = ({ children }: { children: React.ReactElement }) =>
       return res ?? [];
     },
     {
-      onSuccess: (data) => {
+      onSuccess: data => {
         setAdminList(data);
       },
       manual: true,
@@ -120,15 +120,15 @@ const ChatContextProvider = ({ children }: { children: React.ReactElement }) =>
     if (getUserId()) {
       queryAdminListRun();
     }
-  // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [queryAdminListRun, getUserId()]);
 
   useEffect(() => {
     setMode(getDefaultTheme());
     try {
       const dialogInfo = JSON.parse(localStorage.getItem('cur_dialog_info') || '');
       setCurrentDialogInfo(dialogInfo);
-    } catch (error) {
+    } catch {
       setCurrentDialogInfo({
         chat_scene: '',
         app_code: '',

web/app/i18n.ts

@@ -1,8 +1,7 @@
-import { Domain } from '@mui/icons-material';
-import i18n from 'i18next';
-import { initReactI18next } from 'react-i18next';
 import en from '@/locales/en';
 import zh from '@/locales/zh';
+import i18n from 'i18next';
+import { initReactI18next } from 'react-i18next';
 
 export type I18nKeys = keyof typeof en;
 interface Resources {

web/client/api/app/index.ts

@@ -32,7 +32,10 @@ export const updateApp = (data: CreateAppParams) => {
  *  应用列表
  */
 export const getAppList = (data: Record<string, any>) => {
-  return POST<Record<string, any>, AppListResponse>(`/api/v1/app/list?page=${data.page || 1}&page_size=${data.page_size || 12}`, data);
+  return POST<Record<string, any>, AppListResponse>(
+    `/api/v1/app/list?page=${data.page || 1}&page_size=${data.page_size || 12}`,
+    data,
+  );
 };
 /**
  *  获取创建应用agents
@@ -52,9 +55,7 @@ export const getAppStrategy = () => {
  *  获取资源参数
  */
 export const getResource = (data: Record<string, string>) => {
-  return GET<Record<string, string>, Record<string, any>[]>(
-    `/api/v1/app/resources/list?type=${data.type}`
-  );
+  return GET<Record<string, string>, Record<string, any>[]>(`/api/v1/app/resources/list?type=${data.type}`);
 };
 /**
  *  创建native_app应用
@@ -80,12 +81,6 @@ export const getAppAdmins = (appCode: string) => {
 /**
  * 更新应用权限
  */
-export const updateAppAdmins = (data: {
-  app_code: string;
-  admins: string[];
-}) => {
-  return POST<{ app_code: string; admins: string[] }, null>(
-    `/api/v1/app/admins/update`,
-    data
-  );
+export const updateAppAdmins = (data: { app_code: string; admins: string[] }) => {
+  return POST<{ app_code: string; admins: string[] }, null>(`/api/v1/app/admins/update`, data);
 };

web/client/api/chat/index.ts

@@ -36,5 +36,8 @@ export const cancelFeedback = (data: CancelFeedbackAddParams) => {
  * 终止话题
  */
 export const stopTopic = (data: StopTopicParams) => {
-  return POST<StopTopicParams, null>(`/api/v1/chat/topic/terminate?conv_id=${data.conv_id}&round_index=${data.round_index}`, data);
+  return POST<StopTopicParams, null>(
+    `/api/v1/chat/topic/terminate?conv_id=${data.conv_id}&round_index=${data.round_index}`,
+    data,
+  );
 };

web/client/api/evaluate/index.ts

@@ -1,16 +1,16 @@
-import { getUserId } from '@/utils';
-import { GET, POST, DELETE } from '../index';
 import type {
-  getDataSetsRequest,
-  getEvaluationsRequest,
+  createEvaluationsRequest,
   delDataSetRequest,
   delEvaluationRequest,
-  uploadDataSetsRequest,
-  createEvaluationsRequest,
+  downloadEvaluationRequest,
+  getDataSetsRequest,
+  getEvaluationsRequest,
   getMetricsRequest,
   updateDataSetRequest,
-  downloadEvaluationRequest,
+  uploadDataSetsRequest,
 } from '@/types/evaluate';
+import { getUserId } from '@/utils';
+import { DELETE, GET, POST } from '../index';
 
 export const getTestAuth = () => {
   return GET(`/api/v1/evaluate/test_auth`);
@@ -100,11 +100,15 @@ export const getMetrics = (data: getMetricsRequest) => {
   });
 };
 export const showEvaluation = (data: Partial<createEvaluationsRequest>) => {
-  return GET<Partial<createEvaluationsRequest>, Record<string, any>[]>(`/api/v1/evaluate/evaluation/detail/show`, data, {
-    headers: {
-      'user-id': userId,
+  return GET<Partial<createEvaluationsRequest>, Record<string, any>[]>(
+    `/api/v1/evaluate/evaluation/detail/show`,
+    data,
+    {
+      headers: {
+        'user-id': userId,
+      },
     },
-  });
+  );
 };
 export const getStorageTypes = () => {
   return GET<undefined, Record<string, any>>(`/api/v1/evaluate/storage/types`, undefined, {

web/client/api/flow/index.ts

@@ -1,11 +1,11 @@
 import {
   IFlow,
+  IFlowExportParams,
+  IFlowImportParams,
   IFlowNode,
+  IFlowRefreshParams,
   IFlowResponse,
   IFlowUpdateParam,
-  IFlowRefreshParams,
-  IFlowExportParams,
-  IFlowImportParams,
   IUploadFileRequestParams,
   IUploadFileResponse,
 } from '@/types/flow';
@@ -16,7 +16,7 @@ export const addFlow = (data: IFlowUpdateParam) => {
   return POST<IFlowUpdateParam, IFlow>('/api/v2/serve/awel/flows', data);
 };
 
-export const getFlows = (page?: number, page_size?: number) => {
+export const getFlows = ({ page, page_size }: { page?: number; page_size?: number }) => {
   return GET<any, IFlowResponse>('/api/v2/serve/awel/flows', {
     page,
     page_size,
@@ -40,32 +40,23 @@ export const getFlowNodes = () => {
 };
 
 export const refreshFlowNodeById = (data: IFlowRefreshParams) => {
-  return POST<IFlowRefreshParams, IFlowNode>(
-    '/api/v2/serve/awel/nodes/refresh',
-    data
-  );
+  return POST<IFlowRefreshParams, IFlowNode>('/api/v2/serve/awel/nodes/refresh', data);
 };
 
 export const debugFlow = (data: any) => {
   return POST<any, IFlowNode>('/api/v2/serve/awel/flow/debug', data);
 };
 
 export const exportFlow = (data: IFlowExportParams) => {
-  return GET<IFlowExportParams, any>(
-    `/api/v2/serve/awel/flow/export/${data.uid}`,
-    data
-  );
+  return GET<IFlowExportParams, any>(`/api/v2/serve/awel/flow/export/${data.uid}`, data);
 };
 
 export const importFlow = (data: IFlowImportParams) => {
   return POST<IFlowImportParams, any>('/api/v2/serve/awel/flow/import', data);
 };
 
 export const uploadFile = (data: IUploadFileRequestParams) => {
-  return POST<IUploadFileRequestParams, Array<IUploadFileResponse>>(
-    '/api/v2/serve/file/files/dbgpt',
-    data
-  );
+  return POST<IUploadFileRequestParams, Array<IUploadFileResponse>>('/api/v2/serve/file/files/dbgpt', data);
 };
 
 export const downloadFile = (fileId: string) => {

web/client/api/index.ts

@@ -1,6 +1,6 @@
 import { getUserId } from '@/utils';
 import { HEADER_USER_ID_KEY } from '@/utils/constants/index';
-import axios, { AxiosRequestConfig, AxiosError, AxiosResponse } from 'axios';
+import axios, { AxiosError, AxiosRequestConfig, AxiosResponse } from 'axios';
 
 export type ResponseType<T = any> = {
   data: T;
@@ -38,41 +38,53 @@ const LONG_TIME_API: string[] = [
   '/personal/agent/upload',
 ];
 
-ins.interceptors.request.use((request) => {
-  const isLongTimeApi = LONG_TIME_API.some((item) => request.url && request.url.indexOf(item) >= 0);
+ins.interceptors.request.use(request => {
+  const isLongTimeApi = LONG_TIME_API.some(item => request.url && request.url.indexOf(item) >= 0);
   if (!request.timeout) {
     request.timeout = isLongTimeApi ? 60000 : 100000;
   }
   request.headers.set(HEADER_USER_ID_KEY, getUserId());
   return request;
 });
 
-export const GET = <Params = any, Response = any, D = any>(url: string, params?: Params, config?: AxiosRequestConfig<D>) => {
+export const GET = <Params = any, Response = any, D = any>(
+  url: string,
+  params?: Params,
+  config?: AxiosRequestConfig<D>,
+) => {
   return ins.get<Params, ApiResponse<Response>>(url, { params, ...config });
 };
 
 export const POST = <Data = any, Response = any, D = any>(url: string, data?: Data, config?: AxiosRequestConfig<D>) => {
   return ins.post<Data, ApiResponse<Response>>(url, data, config);
 };
 
-export const PATCH = <Data = any, Response = any, D = any>(url: string, data?: Data, config?: AxiosRequestConfig<D>) => {
+export const PATCH = <Data = any, Response = any, D = any>(
+  url: string,
+  data?: Data,
+  config?: AxiosRequestConfig<D>,
+) => {
   return ins.patch<Data, ApiResponse<Response>>(url, data, config);
 };
 
 export const PUT = <Data = any, Response = any, D = any>(url: string, data?: Data, config?: AxiosRequestConfig<D>) => {
   return ins.put<Data, ApiResponse<Response>>(url, data, config);
 };
 
-export const DELETE = <Params = any, Response = any, D = any>(url: string, params?: Params, config?: AxiosRequestConfig<D>) => {
+export const DELETE = <Params = any, Response = any, D = any>(
+  url: string,
+  params?: Params,
+  config?: AxiosRequestConfig<D>,
+) => {
   return ins.delete<Params, ApiResponse<Response>>(url, { params, ...config });
 };
 
-export * from './tools';
-export * from './request';
+export * from './app';
 export * from './chat';
+export * from './evaluate';
 export * from './flow';
-export * from './app';
 export * from './knowledge';
-export * from './user';
 export * from './prompt';
-export * from './evaluate';
+export * from './request';
+export * from './tools';
+export * from './user';