From a23f9881eeef696d2099f5b38c94971b3ed7a9eb Mon Sep 17 00:00:00 2001 From: jialin Date: Thu, 3 Apr 2025 20:38:56 +0800 Subject: [PATCH] fix: some fields value are null after select model --- src/components/alert-info/block.less | 7 +- src/locales/en-US/models.ts | 2 +- src/locales/en-US/resources.ts | 2 +- src/locales/ja-JP/models.ts | 2 +- src/locales/ja-JP/resources.ts | 2 +- src/locales/ru-RU/models.ts | 7 +- src/locales/ru-RU/resources.ts | 2 +- src/locales/zh-CN/models.ts | 2 +- src/locales/zh-CN/resources.ts | 2 +- src/pages/llmodels/components/data-form.tsx | 65 +------------------ .../llmodels/components/deploy-modal.tsx | 18 +++-- src/pages/llmodels/forms/local-path.tsx | 9 +-- src/pages/llmodels/hooks/index.ts | 52 ++++++++++++++- 13 files changed, 78 insertions(+), 94 deletions(-) diff --git a/src/components/alert-info/block.less b/src/components/alert-info/block.less index 042ecb86..1f6dbaa5 100644 --- a/src/components/alert-info/block.less +++ b/src/components/alert-info/block.less @@ -30,15 +30,10 @@ &.success { border: 1px solid var(--color-progress-green); color: var(--color-progress-green); - - .title-text { - color: var(--color-progress-green); - } + background: var(--ant-green-1); .content.success { - color: var(--color-progress-green); font-weight: var(--font-weight-normal); - opacity: 0.85; } } diff --git a/src/locales/en-US/models.ts b/src/locales/en-US/models.ts index a632879c..65ea2741 100644 --- a/src/locales/en-US/models.ts +++ b/src/locales/en-US/models.ts @@ -127,7 +127,7 @@ export default { 'models.form.restart.onerror.tips': 'When an error occurs, it will automatically attempt to restart.', 'models.form.check.params': 'Checking configuration...', - 'models.form.check.passed': 'Check Compatibility Passed', + 'models.form.check.passed': 'Compatibility Check Passed', 'models.form.check.claims': 'The model requires approximately {vram} VRAM and {ram} RAM.' }; diff --git a/src/locales/en-US/resources.ts b/src/locales/en-US/resources.ts index 7792902e..0c165407 100644 --- a/src/locales/en-US/resources.ts +++ b/src/locales/en-US/resources.ts @@ -64,7 +64,7 @@ export default { 'resources.modelfiles.selecttarget': 'Select Target', 'resources.modelfiles.form.localdir': 'Local Directory', 'resources.modelfiles.form.localdir.tips': - 'The default storage directory is /var/lib/gpustack/cache or the directory specified with --data-dir.', + 'The default storage directory is /var/lib/gpustack/cache or the directory specified with --cache-dir.', 'resources.modelfiles.retry.download': 'Retry Download', 'resources.modelfiles.storagePath.holder': 'Waiting for the download to complete...', diff --git a/src/locales/ja-JP/models.ts b/src/locales/ja-JP/models.ts index 57ac9117..dd38ee2c 100644 --- a/src/locales/ja-JP/models.ts +++ b/src/locales/ja-JP/models.ts @@ -124,7 +124,7 @@ export default { 'models.form.restart.onerror.tips': 'When an error occurs, it will automatically attempt to restart.', 'models.form.check.params': 'Checking configuration...', - 'models.form.check.passed': 'Check Compatibility Passed', + 'models.form.check.passed': 'Compatibility Check Passed', 'models.form.check.claims': 'The model requires approximately {vram} VRAM and {ram} RAM.' }; diff --git a/src/locales/ja-JP/resources.ts b/src/locales/ja-JP/resources.ts index 6c36a16f..87df6ae2 100644 --- a/src/locales/ja-JP/resources.ts +++ b/src/locales/ja-JP/resources.ts @@ -65,7 +65,7 @@ export default { 'resources.modelfiles.selecttarget': 'Select Target', 'resources.modelfiles.form.localdir': 'Local Directory', 'resources.modelfiles.form.localdir.tips': - 'The default storage directory is /var/lib/gpustack/cache or the directory specified with --data-dir.', + 'The default storage directory is /var/lib/gpustack/cache or the directory specified with --cache-dir.', 'resources.modelfiles.retry.download': 'Retry Download', 'resources.modelfiles.storagePath.holder': 'Waiting for download to complete...', diff --git a/src/locales/ru-RU/models.ts b/src/locales/ru-RU/models.ts index 02059ecf..5aa191e3 100644 --- a/src/locales/ru-RU/models.ts +++ b/src/locales/ru-RU/models.ts @@ -127,11 +127,10 @@ export default { 'models.form.restart.onerror.tips': 'При возникновении ошибки система автоматически попытается перезапуститься.', 'models.form.check.params': 'Проверка конфигурации...', - 'models.form.check.passed': 'Проверка совместимости: успешно пройдена', - 'models.form.check.claims': - 'Модель требует примерно {vram} VRAM и {ram} RAM.' + 'models.form.check.passed': 'Compatibility Check Passed', + 'models.form.check.claims': 'Модель требует примерно {vram} VRAM и {ram} RAM.' }; // ========== To-Do: Translate Keys (Remove After Translation) ========== - +// 1. 'models.form.check.passed' // ========== End of To-Do List ========== diff --git a/src/locales/ru-RU/resources.ts b/src/locales/ru-RU/resources.ts index b68b89df..c0a69153 100644 --- a/src/locales/ru-RU/resources.ts +++ b/src/locales/ru-RU/resources.ts @@ -64,7 +64,7 @@ export default { 'resources.modelfiles.selecttarget': 'Выбрать назначение', 'resources.modelfiles.form.localdir': 'Локальный каталог', 'resources.modelfiles.form.localdir.tips': - 'Каталог по умолчанию --data-dir.', + 'Каталог по умолчанию --cache-dir.', 'resources.modelfiles.retry.download': 'Повторить загрузку', 'resources.modelfiles.storagePath.holder': 'Ожидание завершения загрузки...', 'resources.filter.worker': 'Фильтровать по узлу', diff --git a/src/locales/zh-CN/models.ts b/src/locales/zh-CN/models.ts index 1515374b..3189c071 100644 --- a/src/locales/zh-CN/models.ts +++ b/src/locales/zh-CN/models.ts @@ -122,5 +122,5 @@ export default { 'models.form.restart.onerror.tips': '当发生错误时，将自动尝试恢复', 'models.form.check.params': '正在校验配置...', 'models.form.check.passed': '兼容性检查通过', - 'models.form.check.claims': '该模型大约需要 {vram} 显存和 {ram} 内存.' + 'models.form.check.claims': '该模型大约需要 {vram} 显存和 {ram} 内存。' }; diff --git a/src/locales/zh-CN/resources.ts b/src/locales/zh-CN/resources.ts index 8fd977ac..8e2814fa 100644 --- a/src/locales/zh-CN/resources.ts +++ b/src/locales/zh-CN/resources.ts @@ -63,7 +63,7 @@ export default { 'resources.modelfiles.selecttarget': '选择目标位置', 'resources.modelfiles.form.localdir': '本地目录', 'resources.modelfiles.form.localdir.tips': - '默认存储目录为 /var/lib/gpustack/cache，或使用 --data-dir 指定的目录', + '默认存储目录为 /var/lib/gpustack/cache，或使用 --cache-dir 指定的目录', 'resources.modelfiles.retry.download': '重新下载', 'resources.modelfiles.storagePath.holder': '等待下载完成...', 'resources.filter.worker': '按 worker 筛选', diff --git a/src/pages/llmodels/components/data-form.tsx b/src/pages/llmodels/components/data-form.tsx index 8ec80884..f0e4d8aa 100644 --- a/src/pages/llmodels/components/data-form.tsx +++ b/src/pages/llmodels/components/data-form.tsx @@ -7,18 +7,14 @@ import useAppUtils from '@/hooks/use-app-utils'; import { useIntl } from '@umijs/max'; import { Form } from 'antd'; import _ from 'lodash'; -import React, { forwardRef, useImperativeHandle, useState } from 'react'; +import React, { forwardRef, useImperativeHandle } from 'react'; import { - HuggingFaceTaskMap, - ModelscopeTaskMap, backendOptionsMap, backendTipsList, excludeFields, modelSourceMap, - modelTaskMap, sourceOptions } from '../config'; -import { identifyModelTask } from '../config/audio-catalog'; import { FormInnerContext } from '../config/form-context'; import { FormData, SourceType } from '../config/types'; import CatalogFrom from '../forms/catalog'; @@ -70,68 +66,11 @@ const DataForm: React.FC = forwardRef((props, ref) => { const { getRuleMessage } = useAppUtils(); const [form] = Form.useForm(); const intl = useIntl(); - const [modelTask, setModelTask] = useState>({ - type: '', - value: '', - text2speech: false, - speech2text: false - }); const handleSumit = () => { form.submit(); }; - const handleRecognizeAudioModel = (selectModel: any) => { - const modelTaskType = identifyModelTask(props.source, selectModel.name); - - const modelTask = - HuggingFaceTaskMap.audio.includes(selectModel.task) || - ModelscopeTaskMap.audio.includes(selectModel.task) - ? modelTaskMap.audio - : ''; - - const modelTaskData = { - value: selectModel.task, - type: modelTaskType || modelTask, - text2speech: - HuggingFaceTaskMap[modelTaskMap.textToSpeech] === selectModel.task || - ModelscopeTaskMap[modelTaskMap.textToSpeech] === selectModel.task, - speech2text: - HuggingFaceTaskMap[modelTaskMap.speechToText] === selectModel.task || - ModelscopeTaskMap[modelTaskMap.speechToText] === selectModel.task - }; - return modelTaskData; - }; - - // just for setting the model name or repo_id, and the backend, Since the model type is fixed. - const handleOnSelectModel = (selectModel: any) => { - let name = _.split(selectModel.name, '/').slice(-1)[0]; - const reg = /(-gguf)$/i; - name = _.toLower(name).replace(reg, ''); - - const modelTaskData = handleRecognizeAudioModel(selectModel); - setModelTask(modelTaskData); - - if (SEARCH_SOURCE.includes(props.source)) { - form.setFieldsValue({ - repo_id: selectModel.name, - name: name, - backend: - modelTaskData.type === modelTaskMap.audio - ? backendOptionsMap.voxBox - : selectModel.isGGUF - ? backendOptionsMap.llamaBox - : backendOptionsMap.vllm - }); - } else { - form.setFieldsValue({ - ollama_library_model_name: selectModel.name, - name: name, - backend: backendOptionsMap.llamaBox - }); - } - }; - // voxbox is not support multi gpu const handleSetGPUIds = (backend: string) => { const gpuids = form.getFieldValue(['gpu_selector', 'gpu_ids']) || []; @@ -184,6 +123,7 @@ const DataForm: React.FC = forwardRef((props, ref) => { }; }; + // generate the data is available for the backend including the gpu_ids const handleOk = async (formdata: FormData) => { let data = _.cloneDeep(formdata); data.categories = Array.isArray(data.categories) @@ -217,7 +157,6 @@ const DataForm: React.FC = forwardRef((props, ref) => { () => { return { form: form, - handleOnSelectModel: handleOnSelectModel, submit: handleSumit, setFieldsValue: (values: FormData) => { form.setFieldsValue(values); diff --git a/src/pages/llmodels/components/deploy-modal.tsx b/src/pages/llmodels/components/deploy-modal.tsx index 04055d1b..9f6102ad 100644 --- a/src/pages/llmodels/components/deploy-modal.tsx +++ b/src/pages/llmodels/components/deploy-modal.tsx @@ -13,7 +13,7 @@ import { } from '../config'; import { FormContext } from '../config/form-context'; import { FormData, SourceType } from '../config/types'; -import { useCheckCompatibility } from '../hooks'; +import { useCheckCompatibility, useSelectModel } from '../hooks'; import ColumnWrapper from './column-wrapper'; import CompatibilityAlert from './compatible-alert'; import DataForm from './data-form'; @@ -84,6 +84,7 @@ const AddModal: FC = (props) => { warningStatus, submitAnyway } = useCheckCompatibility(); + const { onSelectModel } = useSelectModel(); const form = useRef({}); const intl = useIntl(); const [selectedModel, setSelectedModel] = useState({}); @@ -91,25 +92,28 @@ const AddModal: FC = (props) => { const [isGGUF, setIsGGUF] = useState(props.isGGUF || false); const modelFileRef = useRef(null); - const handleSelectModelFile = useCallback((item: any) => { + const handleSelectModelFile = (item: any) => { + const modelInfo = onSelectModel(selectedModel, props.source); form.current?.setFieldsValue?.({ file_name: item.fakeName, - backend: backendOptionsMap.llamaBox, - ...item.evaluateResult?.default_spec + ...item.evaluateResult?.default_spec, + ...modelInfo }); + if (item.fakeName) { handleShowCompatibleAlert(item.evaluateResult); } - }, []); + }; const handleOnSelectModel = (item: any) => { setSelectedModel(item); - form.current?.handleOnSelectModel?.(item); if (!item.isGGUF) { setIsGGUF(false); + const modelInfo = onSelectModel(item, props.source); handleShowCompatibleAlert(item.evaluateResult); form.current?.setFieldsValue?.({ - ...item.evaluateResult?.default_spec + ...item.evaluateResult?.default_spec, + ...modelInfo }); } }; diff --git a/src/pages/llmodels/forms/local-path.tsx b/src/pages/llmodels/forms/local-path.tsx index 7bda70da..2179eaf3 100644 --- a/src/pages/llmodels/forms/local-path.tsx +++ b/src/pages/llmodels/forms/local-path.tsx @@ -1,4 +1,4 @@ -import SealAutoComplete from '@/components/seal-form/auto-complete'; +import SealInput from '@/components/seal-form/seal-input'; import TooltipList from '@/components/tooltip-list'; import useAppUtils from '@/hooks/use-app-utils'; import { useIntl } from '@umijs/max'; @@ -60,17 +60,14 @@ const LocalPathForm: React.FC = () => { } ]} > - } - > + > ); diff --git a/src/pages/llmodels/hooks/index.ts b/src/pages/llmodels/hooks/index.ts index 143e171e..16d2425f 100644 --- a/src/pages/llmodels/hooks/index.ts +++ b/src/pages/llmodels/hooks/index.ts @@ -8,11 +8,15 @@ import _ from 'lodash'; import { useEffect, useRef, useState } from 'react'; import { evaluationsModelSpec, queryGPUList } from '../apis'; import { + HuggingFaceTaskMap, + ModelscopeTaskMap, backendOptionsMap, getSourceRepoConfigValue, modelSourceMap, + modelTaskMap, setSourceRepoConfigValue } from '../config'; +import { identifyModelTask } from '../config/audio-catalog'; import { EvaluateResult, FormData, @@ -317,7 +321,6 @@ export const useCheckCompatibility = () => { return { show: !compatible || hasClaim, type: !compatible ? 'warning' : 'success', - isHtml: hasClaim, ...msgData }; }; @@ -495,3 +498,50 @@ export const useCheckCompatibility = () => { submitAnyway }; }; + +export const useSelectModel = () => { + const handleRecognizeAudioModel = (selectModel: any, source: string) => { + const modelTaskType = identifyModelTask(source, selectModel.name); + + const modelTask = + HuggingFaceTaskMap.audio.includes(selectModel.task) || + ModelscopeTaskMap.audio.includes(selectModel.task) + ? modelTaskMap.audio + : ''; + + const modelTaskData = { + value: selectModel.task, + type: modelTaskType || modelTask, + text2speech: + HuggingFaceTaskMap[modelTaskMap.textToSpeech] === selectModel.task || + ModelscopeTaskMap[modelTaskMap.textToSpeech] === selectModel.task, + speech2text: + HuggingFaceTaskMap[modelTaskMap.speechToText] === selectModel.task || + ModelscopeTaskMap[modelTaskMap.speechToText] === selectModel.task + }; + return modelTaskData; + }; + + // just for setting the model name or repo_id, and the backend, Since the model type is fixed. + const onSelectModel = (selectModel: any, source: string) => { + let name = _.split(selectModel.name, '/').slice(-1)[0]; + const reg = /(-gguf)$/i; + name = _.toLower(name).replace(reg, ''); + + const modelTaskData = handleRecognizeAudioModel(selectModel, source); + return { + repo_id: selectModel.name, + name: name, + backend: + modelTaskData.type === modelTaskMap.audio + ? backendOptionsMap.voxBox + : selectModel.isGGUF + ? backendOptionsMap.llamaBox + : backendOptionsMap.vllm + }; + }; + + return { + onSelectModel + }; +};