refactor: deploy model

src/components/icon-font/index.tsx

@@ -2,7 +2,7 @@ import { createFromIconfontCN } from '@ant-design/icons';
 // import './iconfont/iconfont.js';
 
 const IconFont = createFromIconfontCN({
-  scriptUrl: '//at.alicdn.com/t/c/font_4613488_84hy7h371ty.js'
+  scriptUrl: '//at.alicdn.com/t/c/font_4613488_1ahssp5gmym.js'
 });
 
 export default IconFont;

src/pages/llmodels/components/advance-config.tsx

@@ -7,25 +7,25 @@ import SealSelect from '@/components/seal-form/seal-select';
 import TooltipList from '@/components/tooltip-list';
 import { PageAction } from '@/config';
 import { PageActionType } from '@/config/types';
-import useAppUtils from '@/hooks/use-app-utils';
 import { useIntl } from '@umijs/max';
 import { Collapse, Form, FormInstance, Typography } from 'antd';
 import _ from 'lodash';
 import React, { useCallback, useMemo } from 'react';
 import {
   backendLabelMap,
-  backendOptionsMap,
   backendParamsHolderTips,
   backendTipsList,
   getBackendParamsTips,
   modelCategories,
   modelSourceMap,
-  placementStrategyOptions
+  placementStrategyOptions,
+  ScheduleValueMap
 } from '../config';
+import BackendParameters, {
+  backendOptionsMap
+} from '../config/backend-parameters';
 import { useFormContext } from '../config/form-context';
-import mindieConfig from '../config/mindie-config';
 import { FormData } from '../config/types';
-import vllmConfig from '../config/vllm-config';
 import dataformStyles from '../style/data-form.less';
 import Performance from './performance';
 
@@ -52,7 +52,6 @@ const placementStrategyTips = [
 
 const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
   const { form, isGGUF, gpuOptions, source, backendOptions, action } = props;
-  const { getRuleMessage } = useAppUtils();
   const intl = useIntl();
   const wokerSelector = Form.useWatch('worker_selector', form);
   const EnviromentVars = Form.useWatch('env', form);
@@ -67,13 +66,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
   const { onValuesChange } = useFormContext();
 
   const paramsConfig = useMemo(() => {
-    if (backend === backendOptionsMap.vllm) {
-      return vllmConfig;
-    }
-    if (backend === backendOptionsMap.ascendMindie) {
-      return mindieConfig;
-    }
-    return [];
+    return _.get(BackendParameters, backend, []);
   }, [backend]);
 
   const backendParamsTips = useMemo(() => {
@@ -137,7 +130,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
   };
 
   const handleScheduleTypeChange = (value: string) => {
-    if (value === 'auto') {
+    if (value === ScheduleValueMap.Auto) {
       onValuesChange?.({}, form.getFieldsValue());
     }
   };
@@ -202,7 +195,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             }
           ></SealSelect>
         </Form.Item>
-        {scheduleType === 'auto' && (
+        {scheduleType === ScheduleValueMap.Auto && (
           <>
             <Form.Item<FormData> name="placement_strategy">
               <SealSelect
@@ -221,7 +214,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
                 ({ getFieldValue }) => ({
                   validator(rule, value) {
                     if (
-                      getFieldValue('scheduleType') === 'auto' &&
+                      getFieldValue('scheduleType') === ScheduleValueMap.Auto &&
                       _.keys(value).length > 0
                     ) {
                       if (_.some(_.keys(value), (k: string) => !value[k])) {
@@ -263,35 +256,6 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
             </Form.Item>
           </>
         )}
-        {/* {scheduleType === 'manual' && (
-          <>
-            <Form.Item
-              name={['gpu_selector', 'gpu_ids']}
-              rules={[
-                {
-                  required: true,
-                  message: getRuleMessage('select', 'models.form.gpuselector')
-                }
-              ]}
-            >
-              <SealCascader
-                required
-                showSearch
-                expandTrigger="hover"
-                multiple={backend !== backendOptionsMap.voxBox}
-                popupClassName="cascader-popup-wrapper gpu-selector"
-                maxTagCount={1}
-                label={intl.formatMessage({ id: 'models.form.gpuselector' })}
-                options={gpuOptions}
-                showCheckedStrategy="SHOW_CHILD"
-                value={form.getFieldValue(['gpu_selector', 'gpu_ids'])}
-                optionNode={GPUCard}
-                getPopupContainer={(triggerNode) => triggerNode.parentNode}
-                onChange={handleGpuSelectorChange}
-              ></SealCascader>
-            </Form.Item>
-          </>
-        )} */}
 
         <Form.Item name="backend_version">
           <SealInput.Input
@@ -402,7 +366,7 @@ const AdvanceConfig: React.FC<AdvanceConfigProps> = (props) => {
           ></LabelSelector>
         </Form.Item>
 
-        {scheduleType === 'auto' &&
+        {scheduleType === ScheduleValueMap.Auto &&
           [backendOptionsMap.vllm, backendOptionsMap.ascendMindie].includes(
             backend
           ) && (

src/pages/llmodels/components/data-form.tsx

@@ -6,7 +6,8 @@ import { useIntl } from '@umijs/max';
 import { Form } from 'antd';
 import _ from 'lodash';
 import React, { forwardRef, useImperativeHandle } from 'react';
-import { backendOptionsMap, excludeFields, sourceOptions } from '../config';
+import { excludeFields, ScheduleValueMap, sourceOptions } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { FormInnerContext } from '../config/form-context';
 import { FormData, SourceType } from '../config/types';
 import CatalogFrom from '../forms/catalog';
@@ -193,7 +194,7 @@ const DataForm: React.FC<DataFormProps> = forwardRef((props, ref) => {
           source: props.source,
           placement_strategy: 'spread',
           cpu_offloading: true,
-          scheduleType: 'auto',
+          scheduleType: ScheduleValueMap.Auto,
           categories: null,
           restart_on_error: true,
           distributed_inference_across_workers: true,

src/pages/llmodels/components/deploy-builtin-modal.tsx

@@ -10,11 +10,11 @@ import React, { useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 import { queryCatalogItemSpec } from '../apis';
 import {
-  backendOptionsMap,
   defaultFormValues,
   modelCategoriesMap,
   sourceOptions
 } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { FormContext } from '../config/form-context';
 import { CatalogSpec, FormData, ListItem, SourceType } from '../config/types';
 import { useCheckCompatibility } from '../hooks';
@@ -321,6 +321,7 @@ const AddModal: React.FC<AddModalProps> = (props) => {
     } else {
       setIsGGUF(false);
     }
+
     const sizeList = handleSetSizeOptions({
       backend: backend
     });

src/pages/llmodels/components/deploy-modal.tsx

@@ -9,11 +9,11 @@ import _ from 'lodash';
 import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
 import {
-  backendOptionsMap,
   defaultFormValues,
   getSourceRepoConfigValue,
   modelSourceMap
 } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { FormContext } from '../config/form-context';
 import { FormData, SourceType } from '../config/types';
 import {

src/pages/llmodels/components/instance-item.tsx

@@ -26,12 +26,8 @@ import _ from 'lodash';
 import React, { useCallback, useEffect, useMemo } from 'react';
 import styled from 'styled-components';
 import { MODEL_INSTANCE_API } from '../apis';
-import {
-  InstanceStatusMap,
-  InstanceStatusMapValue,
-  backendOptionsMap,
-  status
-} from '../config';
+import { InstanceStatusMap, InstanceStatusMapValue, status } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import {
   DistributedServerItem,
   DistributedServers,

src/pages/llmodels/components/performance.tsx

@@ -5,7 +5,8 @@ import useAppUtils from '@/hooks/use-app-utils';
 import { useIntl } from '@umijs/max';
 import { Form } from 'antd';
 import React from 'react';
-import { backendOptionsMap } from '../config';
+import { scheduleList, ScheduleValueMap } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { useFormContext, useFormInnerContext } from '../config/form-context';
 import GPUCard from './gpu-card';
 
@@ -34,7 +35,7 @@ const Performance: React.FC = () => {
   const form = Form.useFormInstance();
 
   const handleScheduleTypeChange = (value: string) => {
-    if (value === 'auto') {
+    if (value === ScheduleValueMap.Auto) {
       onValuesChange?.({}, form.getFieldsValue());
     }
   };
@@ -52,29 +53,11 @@ const Performance: React.FC = () => {
           onChange={handleScheduleTypeChange}
           label={intl.formatMessage({ id: 'models.form.scheduletype' })}
           description={<TooltipList list={scheduleTypeTips}></TooltipList>}
-          options={[
-            {
-              label: intl.formatMessage({
-                id: 'models.form.scheduletype.auto'
-              }),
-              value: 'auto'
-            },
-            {
-              label: intl.formatMessage({
-                id: 'models.form.scheduletype.manual'
-              }),
-              value: 'manual'
-            },
-            {
-              label: intl.formatMessage({
-                id: 'models.form.scheduletype.gpuType'
-              }),
-              value: 'specific_gpu_type'
-            }
-          ]}
+          options={scheduleList}
         ></SealSelect>
       </Form.Item>
-      {form.getFieldValue('scheduleType') === 'specific_gpu_type' && (
+      {form.getFieldValue('scheduleType') ===
+        ScheduleValueMap.SpecificGPUType && (
         <>
           <Form.Item name={['gpu_selector', 'gpu_type']}>
             <SealSelect
@@ -128,7 +111,7 @@ const Performance: React.FC = () => {
           </Form.Item>
         </>
       )}
-      {form.getFieldValue('scheduleType') === 'manual' &&
+      {form.getFieldValue('scheduleType') === ScheduleValueMap.Manual &&
         !form.getFieldValue('fix_gpu_type') && (
           <>
             <Form.Item

src/pages/llmodels/components/scaling.tsx

@@ -49,12 +49,6 @@ const Scaling: React.FC = () => {
   const { getRuleMessage } = useAppUtils();
   const form = Form.useFormInstance();
 
-  const handleScheduleTypeChange = (value: string) => {
-    if (value === 'auto') {
-      onValuesChange?.({}, form.getFieldsValue());
-    }
-  };
-
   const handleOnQuantizationChange = (val: any) => {
     onQuantizationChange?.(val);
   };

src/pages/llmodels/components/table-list.tsx

@@ -38,11 +38,11 @@ import {
 } from '../apis';
 import {
   InstanceRealtimeLogStatus,
-  backendOptionsMap,
   modelCategories,
   modelCategoriesMap,
   modelSourceMap
 } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import {
   ButtonList,
   categoryToPathMap,

src/pages/llmodels/components/update-modal.tsx

@@ -9,13 +9,14 @@ import { Button, Form, Modal } from 'antd';
 import _ from 'lodash';
 import React, { useEffect, useMemo, useRef } from 'react';
 import {
-  backendOptionsMap,
   updateExcludeFields as excludeFields,
   getSourceRepoConfigValue,
   modelSourceMap,
+  ScheduleValueMap,
   sourceOptions,
   updateIgnoreFields
 } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { FormContext, FormInnerContext } from '../config/form-context';
 import { FormData, ListItem } from '../config/types';
 import HuggingFaceForm from '../forms/hugging-face';
@@ -94,7 +95,7 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
     console.log('handleOnValuesChange:', formdata);
 
     let alldata = {};
-    if (formdata.scheduleType === 'manual') {
+    if (formdata.scheduleType === ScheduleValueMap.Manual) {
       alldata = {
         ..._.omit(formdata, ['worker_selector']),
         env: formdata.env || originFormData.current?.env || null,
@@ -202,7 +203,9 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
       ..._.omit(formdata, ['scheduleType']),
       categories: formdata.categories ? [formdata.categories] : [],
       worker_selector:
-        formdata.scheduleType === 'manual' ? null : formdata.worker_selector,
+        formdata.scheduleType === ScheduleValueMap.Manual
+          ? null
+          : formdata.worker_selector,
       ...(isVoxBox
         ? {
             distributed_inference_across_workers: false,

src/pages/llmodels/config/backend-parameters/index.ts

@@ -0,0 +1,40 @@
+import llamaParameters from './llama-parameters';
+import mindieParameters from './mindie-parameters';
+import vllmParameters from './vllm-parameters';
+
+export const backendOptionsMap = {
+  llamaBox: 'llama-box',
+  vllm: 'vllm',
+  voxBox: 'vox-box',
+  ascendMindie: 'ascend-mindie',
+  custom: 'custom'
+};
+
+export interface BackendParameter {
+  label: string;
+  value: string;
+  options?: Array<string | number>;
+}
+
+const generateBackendParameters = (options: BackendParameter[]) => {
+  return options.map((option) => {
+    return {
+      label: option.label,
+      value: option.value,
+      opts: option.options?.map((opt) => {
+        return {
+          label: opt,
+          value: opt
+        };
+      })
+    };
+  });
+};
+
+export default {
+  [backendOptionsMap.llamaBox]: generateBackendParameters(llamaParameters),
+  [backendOptionsMap.vllm]: generateBackendParameters(vllmParameters),
+  [backendOptionsMap.ascendMindie]: generateBackendParameters(mindieParameters),
+  [backendOptionsMap.voxBox]: [],
+  [backendOptionsMap.custom]: []
+};

src/pages/llmodels/config/backend-parameters/llama-parameters.ts

@@ -1,4 +1,6 @@
-const options = [
+import { BackendParameter } from './index';
+
+const options: BackendParameter[] = [
   {
     label: '--verbose',
     value: '--verbose'
@@ -611,17 +613,4 @@ const options = [
   }
 ];
 
-const resultList = options.map((option) => {
-  return {
-    label: option.label,
-    value: option.value,
-    opts: option.options?.map((opt) => {
-      return {
-        label: opt,
-        value: opt
-      };
-    })
-  };
-});
-
-export default resultList;
+export default options;

src/pages/llmodels/config/backend-parameters/mindie-parameters.ts

@@ -1,4 +1,6 @@
-const options = [
+import { BackendParameter } from './index';
+
+const options: BackendParameter[] = [
   {
     label: '--log-level',
     value: '--log-level',
@@ -194,17 +196,4 @@ const options = [
   }
 ];
 
-const resultList = options.map((option) => {
-  return {
-    label: option.label,
-    value: option.value,
-    opts: option.options?.map((opt) => {
-      return {
-        label: `${opt}`,
-        value: opt
-      };
-    })
-  };
-});
-
-export default resultList;
+export default options;

src/pages/llmodels/config/backend-parameters/vllm-parameters.ts

@@ -1,4 +1,6 @@
-const options = [
+import { BackendParameter } from './index';
+
+const options: BackendParameter[] = [
   {
     label: '--uvicorn-log-level',
     value: '--uvicorn-log-level',
@@ -774,17 +776,4 @@ const options = [
   }
 ];
 
-const resultList = options.map((option) => {
-  return {
-    label: option.label,
-    value: option.value,
-    opts: option.options.map((opt) => {
-      return {
-        label: opt,
-        value: opt
-      };
-    })
-  };
-});
-
-export default resultList;
+export default options;

src/pages/llmodels/config/index.ts

@@ -1,6 +1,7 @@
 import { StatusMaps } from '@/config';
 import { EditOutlined } from '@ant-design/icons';
 import _ from 'lodash';
+import { backendOptionsMap } from './backend-parameters';
 
 export const backendTipsList = [
   {
@@ -41,18 +42,12 @@ export const localPathTipsList = [
   }
 ];
 
-export const backendOptionsMap = {
-  llamaBox: 'llama-box',
-  vllm: 'vllm',
-  voxBox: 'vox-box',
-  ascendMindie: 'ascend-mindie'
-};
-
 export const backendLabelMap = {
   [backendOptionsMap.llamaBox]: 'llama-box',
   [backendOptionsMap.vllm]: 'vLLM',
   [backendOptionsMap.voxBox]: 'vox-box',
-  [backendOptionsMap.ascendMindie]: 'Ascend MindIE'
+  [backendOptionsMap.ascendMindie]: 'Ascend MindIE',
+  [backendOptionsMap.custom]: 'Custom'
 };
 
 export const backendParamsHolderTips = {
@@ -135,11 +130,6 @@ export const sourceOptions = [
     value: modelSourceMap.huggingface_value,
     key: 'huggingface'
   },
-  {
-    label: 'Ollama Library',
-    value: modelSourceMap.ollama_library_value,
-    key: 'ollama_library'
-  },
   {
     label: 'ModelScope',
     value: modelSourceMap.modelscope_value,
@@ -198,6 +188,30 @@ export const status: any = {
   [InstanceStatusMap.Unreachable]: StatusMaps.error
 };
 
+export const ScheduleValueMap = {
+  Auto: 'auto',
+  Manual: 'manual',
+  SpecificGPUType: 'specific_gpu_type'
+};
+
+export const scheduleList = [
+  {
+    label: 'models.form.scheduletype.auto',
+    locale: true,
+    value: ScheduleValueMap.Auto
+  },
+  {
+    label: 'models.form.scheduletype.manual',
+    value: ScheduleValueMap.Manual,
+    locale: true
+  }
+  // {
+  //   label: 'models.form.scheduletype.gpuType',
+  //   value: ScheduleValueMap.SpecificGPUType,
+  //   locale: true
+  // }
+];
+
 export const ActionList = [
   {
     label: 'common.button.edit',
@@ -414,7 +428,7 @@ export const defaultFormValues = {
   description: '',
   categories: null,
   env: {},
-  scheduleType: 'auto',
+  scheduleType: ScheduleValueMap.Auto,
   placement_strategy: 'spread',
   gpu_ids: null,
   gpu_selector: {},

src/pages/llmodels/forms/local-path.tsx

@@ -5,11 +5,8 @@ import { useIntl } from '@umijs/max';
 import { Form } from 'antd';
 import _ from 'lodash';
 import React, { useRef } from 'react';
-import {
-  backendOptionsMap,
-  localPathTipsList,
-  modelSourceMap
-} from '../config';
+import { localPathTipsList, modelSourceMap } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { useFormContext, useFormInnerContext } from '../config/form-context';
 import { FormData } from '../config/types';
 import { checkOnlyAscendNPU } from '../hooks';

src/pages/llmodels/hooks/index.ts

@@ -9,12 +9,12 @@ import _ from 'lodash';
 import { useEffect, useRef, useState } from 'react';
 import { evaluationsModelSpec } from '../apis';
 import {
-  backendOptionsMap,
   getSourceRepoConfigValue,
   modelSourceMap,
   modelTaskMap
 } from '../config';
 import { handleRecognizeAudioModel } from '../config/audio-catalog';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { EvaluateResult, FormData } from '../config/types';
 
 export type MessageStatus = {

src/pages/llmodels/hooks/use-form-initial-values.ts

@@ -11,7 +11,8 @@ import { useAtom } from 'jotai';
 import _ from 'lodash';
 import { useState } from 'react';
 import { queryGPUList } from '../apis';
-import { backendOptionsMap, setSourceRepoConfigValue } from '../config';
+import { ScheduleValueMap, setSourceRepoConfigValue } from '../config';
+import { backendOptionsMap } from '../config/backend-parameters';
 import { GPUListItem, ListItem } from '../config/types';
 
 type EmptyObject = Record<never, never>;
@@ -248,7 +249,9 @@ export default function useFormInitialValues() {
     const formData = {
       ...result.values,
       categories: data?.categories?.length ? data.categories[0] : null,
-      scheduleType: data?.gpu_selector ? 'manual' : 'auto',
+      scheduleType: data?.gpu_selector
+        ? ScheduleValueMap.Manual
+        : ScheduleValueMap.Auto,
       gpu_selector: data?.gpu_selector?.gpu_ids?.length
         ? {
             gpu_ids: generateGPUSelector(data, gpuOptions)

src/pages/resources/components/model-files.tsx

@@ -7,8 +7,9 @@ import useBodyScroll from '@/hooks/use-body-scroll';
 import useTableFetch from '@/hooks/use-table-fetch';
 import { createModel } from '@/pages/llmodels/apis';
 import DeployModal from '@/pages/llmodels/components/deploy-modal';
-import { backendOptionsMap, modelSourceMap } from '@/pages/llmodels/config';
+import { modelSourceMap } from '@/pages/llmodels/config';
 import { identifyModelTask } from '@/pages/llmodels/config/audio-catalog';
+import { backendOptionsMap } from '@/pages/llmodels/config/backend-parameters';
 import {
   modalConfig,
   onLineSourceOptions