chore: allow switch backend between vllm and mindie
This commit is contained in:
@@ -8,7 +8,6 @@ const Wrapper = styled.div<{ $maxHeight?: number }>`
|
|||||||
typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};
|
typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-inline: 8px;
|
|
||||||
`;
|
`;
|
||||||
|
|
||||||
const OverlayScroller: React.FC<any> = ({
|
const OverlayScroller: React.FC<any> = ({
|
||||||
@@ -38,6 +37,8 @@ const OverlayScroller: React.FC<any> = ({
|
|||||||
hidden={false}
|
hidden={false}
|
||||||
as="div"
|
as="div"
|
||||||
style={{
|
style={{
|
||||||
|
paddingInlineStart: 8,
|
||||||
|
paddingInlineEnd: 8,
|
||||||
...style
|
...style
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
@@ -51,7 +52,6 @@ export const TooltipOverlayScroller: React.FC<
|
|||||||
> = ({ children, maxHeight, title, ...rest }) => {
|
> = ({ children, maxHeight, title, ...rest }) => {
|
||||||
return (
|
return (
|
||||||
<Tooltip
|
<Tooltip
|
||||||
destroyTooltipOnHide
|
|
||||||
overlayInnerStyle={{
|
overlayInnerStyle={{
|
||||||
width: 'max-content',
|
width: 'max-content',
|
||||||
maxWidth: 300,
|
maxWidth: 300,
|
||||||
|
|||||||
@@ -146,7 +146,13 @@ export const FilterBar: React.FC<FilterBarProps> = (props) => {
|
|||||||
</Button>
|
</Button>
|
||||||
</Space>
|
</Space>
|
||||||
);
|
);
|
||||||
}, [actionItems, actionType, rowSelection?.selectedRowKeys, intl]);
|
}, [
|
||||||
|
actionItems,
|
||||||
|
actionType,
|
||||||
|
rowSelection?.selectedRowKeys,
|
||||||
|
handleClickPrimary,
|
||||||
|
intl
|
||||||
|
]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PageTools
|
<PageTools
|
||||||
|
|||||||
@@ -68,6 +68,7 @@ const SearchModel: React.FC<SearchInputProps> = (props) => {
|
|||||||
modelSourceMap.huggingface_value,
|
modelSourceMap.huggingface_value,
|
||||||
modelSourceMap.modelscope_value
|
modelSourceMap.modelscope_value
|
||||||
];
|
];
|
||||||
|
console.log('hasLinuxWorker---------:', hasLinuxWorker);
|
||||||
const [isEvaluating, setIsEvaluating] = useState<boolean>(false);
|
const [isEvaluating, setIsEvaluating] = useState<boolean>(false);
|
||||||
const [current, setCurrent] = useState<string>('');
|
const [current, setCurrent] = useState<string>('');
|
||||||
const currentRef = useRef<string>('');
|
const currentRef = useRef<string>('');
|
||||||
|
|||||||
@@ -529,7 +529,7 @@ const Models: React.FC<ModelsProps> = ({
|
|||||||
|
|
||||||
const config = modalConfig[item.key];
|
const config = modalConfig[item.key];
|
||||||
const hasLinuxWorker = workerList.some(
|
const hasLinuxWorker = workerList.some(
|
||||||
(worker) => worker.labels?.os === 'linux'
|
(worker) => _.toLower(worker.labels?.os) === 'linux'
|
||||||
);
|
);
|
||||||
|
|
||||||
if (config) {
|
if (config) {
|
||||||
|
|||||||
@@ -169,8 +169,13 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
|
|||||||
const isEndwithGGUF = _.endsWith(value, '.gguf');
|
const isEndwithGGUF = _.endsWith(value, '.gguf');
|
||||||
const isBlobFile = value.split('/').pop().includes('sha256');
|
const isBlobFile = value.split('/').pop().includes('sha256');
|
||||||
let backend = backendOptionsMap.llamaBox;
|
let backend = backendOptionsMap.llamaBox;
|
||||||
|
const isVllmOrAscend = [
|
||||||
|
backendOptionsMap.vllm,
|
||||||
|
backendOptionsMap.ascendMindie
|
||||||
|
].includes(form.getFieldValue('backend'));
|
||||||
|
|
||||||
if (!isEndwithGGUF || !isBlobFile) {
|
if (!isEndwithGGUF || !isBlobFile) {
|
||||||
backend = backendOptionsMap.vllm;
|
backend = isVllmOrAscend ? formData!.backend : backendOptionsMap.vllm;
|
||||||
}
|
}
|
||||||
form.setFieldValue('backend', backend);
|
form.setFieldValue('backend', backend);
|
||||||
handleBackendChange?.(backend);
|
handleBackendChange?.(backend);
|
||||||
@@ -399,6 +404,13 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
|
|||||||
);
|
);
|
||||||
}, [warningStatus.show, warningStatus.type, warningStatus.isDefault]);
|
}, [warningStatus.show, warningStatus.type, warningStatus.isDefault]);
|
||||||
|
|
||||||
|
const isVllmOrAscend = useMemo(() => {
|
||||||
|
return (
|
||||||
|
formData?.backend === backendOptionsMap.vllm ||
|
||||||
|
formData?.backend === backendOptionsMap.ascendMindie
|
||||||
|
);
|
||||||
|
}, [formData?.backend]);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (open && formData) {
|
if (open && formData) {
|
||||||
setOriginalFormData();
|
setOriginalFormData();
|
||||||
@@ -563,7 +575,8 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
|
|||||||
label: backendLabelMap[backendOptionsMap.vllm],
|
label: backendLabelMap[backendOptionsMap.vllm],
|
||||||
value: backendOptionsMap.vllm,
|
value: backendOptionsMap.vllm,
|
||||||
disabled:
|
disabled:
|
||||||
formData?.source === modelSourceMap.local_path_value
|
formData?.source === modelSourceMap.local_path_value ||
|
||||||
|
isVllmOrAscend
|
||||||
? false
|
? false
|
||||||
: isGGUF
|
: isGGUF
|
||||||
},
|
},
|
||||||
@@ -571,7 +584,8 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
|
|||||||
label: backendLabelMap[backendOptionsMap.ascendMindie],
|
label: backendLabelMap[backendOptionsMap.ascendMindie],
|
||||||
value: backendOptionsMap.ascendMindie,
|
value: backendOptionsMap.ascendMindie,
|
||||||
disabled:
|
disabled:
|
||||||
formData?.source === modelSourceMap.local_path_value
|
formData?.source === modelSourceMap.local_path_value ||
|
||||||
|
isVllmOrAscend
|
||||||
? false
|
? false
|
||||||
: isGGUF
|
: isGGUF
|
||||||
},
|
},
|
||||||
@@ -579,14 +593,14 @@ const UpdateModal: React.FC<AddModalProps> = (props) => {
|
|||||||
label: backendLabelMap[backendOptionsMap.voxBox],
|
label: backendLabelMap[backendOptionsMap.voxBox],
|
||||||
value: backendOptionsMap.voxBox,
|
value: backendOptionsMap.voxBox,
|
||||||
disabled:
|
disabled:
|
||||||
formData?.source === modelSourceMap.local_path_value
|
formData?.source !== modelSourceMap.local_path_value ||
|
||||||
? false
|
!isVllmOrAscend
|
||||||
: isGGUF
|
|
||||||
}
|
}
|
||||||
]}
|
]}
|
||||||
disabled={
|
disabled={
|
||||||
action === PageAction.EDIT &&
|
action === PageAction.EDIT &&
|
||||||
formData?.source !== modelSourceMap.local_path_value
|
formData?.source !== modelSourceMap.local_path_value &&
|
||||||
|
!isVllmOrAscend
|
||||||
}
|
}
|
||||||
></SealSelect>
|
></SealSelect>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|||||||
@@ -19,6 +19,7 @@ type AddModalProps = {
|
|||||||
open: boolean;
|
open: boolean;
|
||||||
source: string;
|
source: string;
|
||||||
width?: string | number;
|
width?: string | number;
|
||||||
|
hasLinuxWorker?: boolean;
|
||||||
workersList: Global.BaseOption<number>[];
|
workersList: Global.BaseOption<number>[];
|
||||||
onOk: (values: FormData) => void;
|
onOk: (values: FormData) => void;
|
||||||
onCancel: () => void;
|
onCancel: () => void;
|
||||||
@@ -31,6 +32,7 @@ const DownloadModel: React.FC<AddModalProps> = (props) => {
|
|||||||
open,
|
open,
|
||||||
onOk,
|
onOk,
|
||||||
onCancel,
|
onCancel,
|
||||||
|
hasLinuxWorker,
|
||||||
source,
|
source,
|
||||||
width = 600
|
width = 600
|
||||||
} = props || {};
|
} = props || {};
|
||||||
@@ -172,6 +174,7 @@ const DownloadModel: React.FC<AddModalProps> = (props) => {
|
|||||||
>
|
>
|
||||||
<ColumnWrapper>
|
<ColumnWrapper>
|
||||||
<SearchModel
|
<SearchModel
|
||||||
|
hasLinuxWorker={hasLinuxWorker}
|
||||||
modelSource={props.source}
|
modelSource={props.source}
|
||||||
onSelectModel={handleOnSelectModel}
|
onSelectModel={handleOnSelectModel}
|
||||||
isDownload={true}
|
isDownload={true}
|
||||||
|
|||||||
@@ -31,7 +31,7 @@ import { ConfigProvider, Empty, Table, Tag, Typography, message } from 'antd';
|
|||||||
import dayjs from 'dayjs';
|
import dayjs from 'dayjs';
|
||||||
import { useAtom } from 'jotai';
|
import { useAtom } from 'jotai';
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import React, { useEffect, useState } from 'react';
|
import React, { useCallback, useEffect, useState } from 'react';
|
||||||
import styled from 'styled-components';
|
import styled from 'styled-components';
|
||||||
import {
|
import {
|
||||||
useGenerateFormEditInitialValues,
|
useGenerateFormEditInitialValues,
|
||||||
@@ -92,7 +92,7 @@ const PathWrapper = styled.div`
|
|||||||
const ItemWrapper = styled.ul`
|
const ItemWrapper = styled.ul`
|
||||||
max-width: 300px;
|
max-width: 300px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding-inline: 15px 0;
|
padding-inline: 13px 0;
|
||||||
word-break: break-word;
|
word-break: break-word;
|
||||||
li {
|
li {
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
@@ -203,17 +203,17 @@ const ModelFiles = () => {
|
|||||||
useGenerateModelFileOptions();
|
useGenerateModelFileOptions();
|
||||||
const intl = useIntl();
|
const intl = useIntl();
|
||||||
const { showSuccess } = useAppUtils();
|
const { showSuccess } = useAppUtils();
|
||||||
const [workersList, setWorkersList] = useState<Global.BaseOption<number>[]>(
|
const [workersList, setWorkersList] = useState<any[]>([]);
|
||||||
[]
|
|
||||||
);
|
|
||||||
const [downloadModalStatus, setDownlaodMoalStatus] = useState<{
|
const [downloadModalStatus, setDownlaodMoalStatus] = useState<{
|
||||||
show: boolean;
|
show: boolean;
|
||||||
width: number | string;
|
width: number | string;
|
||||||
source: string;
|
source: string;
|
||||||
|
hasLinuxWorker: boolean;
|
||||||
gpuOptions: any[];
|
gpuOptions: any[];
|
||||||
}>({
|
}>({
|
||||||
show: false,
|
show: false,
|
||||||
width: 600,
|
width: 600,
|
||||||
|
hasLinuxWorker: false,
|
||||||
source: modelSourceMap.huggingface_value,
|
source: modelSourceMap.huggingface_value,
|
||||||
gpuOptions: []
|
gpuOptions: []
|
||||||
});
|
});
|
||||||
@@ -388,12 +388,18 @@ const ModelFiles = () => {
|
|||||||
return <div></div>;
|
return <div></div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleClickDropdown = (item: any) => {
|
const handleClickDropdown = useCallback(
|
||||||
const config = modalConfig[item.key];
|
(item: any) => {
|
||||||
if (config) {
|
const config = modalConfig[item.key];
|
||||||
setDownlaodMoalStatus({ ...config, gpuOptions: [] });
|
const hasLinuxWorker = workersList.some(
|
||||||
}
|
(worker) => _.toLower(worker.labels?.os) === 'linux'
|
||||||
};
|
);
|
||||||
|
if (config) {
|
||||||
|
setDownlaodMoalStatus({ ...config, hasLinuxWorker, gpuOptions: [] });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[workersList]
|
||||||
|
);
|
||||||
|
|
||||||
const handleDownloadCancel = () => {
|
const handleDownloadCancel = () => {
|
||||||
setDownlaodMoalStatus({
|
setDownlaodMoalStatus({
|
||||||
@@ -617,6 +623,7 @@ const ModelFiles = () => {
|
|||||||
open={downloadModalStatus.show}
|
open={downloadModalStatus.show}
|
||||||
source={downloadModalStatus.source}
|
source={downloadModalStatus.source}
|
||||||
width={downloadModalStatus.width}
|
width={downloadModalStatus.width}
|
||||||
|
hasLinuxWorker={downloadModalStatus.hasLinuxWorker}
|
||||||
workersList={workersList.filter(
|
workersList={workersList.filter(
|
||||||
(item: any) => item.state === WorkerStatusMap.ready
|
(item: any) => item.state === WorkerStatusMap.ready
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user