Skip to content

Commit

Permalink
fix/consider-version-compatibility-on-extra-mounts-in-model-serving (#…
Browse files Browse the repository at this point in the history 
…2447)

This PR provides conditionally showing extra mount vfolders only when Core version supports its feature.

<!--
Please precisely, concisely, and concretely describe what this PR changes, the rationale behind codes,
and how it affects the users and other developers.
-->

**Checklist:** (if applicable)

- [ ] Mention to the original issue
- [ ] Documentation
- [ ] Minium required manager version
- [ ] Specific setting for review (eg., KB link, endpoint or how to setup)
- [ ] Minimum requirements to check during review
- [ ] Test case(s) to demonstrate the difference of before/after
  • Loading branch information
@lizable
lizable authored May 31, 2024
1 parent 1d8c3a7 commit bfb86e5
Show file tree
Hide file tree
Showing 7 changed files with 259 additions and 228 deletions.
1 change: 1 addition & 0 deletions react/src/components/BAIModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@ const BAIModal: React.FC<BAIModalProps> = ({ styles, ...modalProps }) => {
<>
<style>{rawBAIModalCss}</style>
<Modal
keyboard={false}
{...modalProps}
centered={modalProps.centered ?? true}
className="bai-modal"
Expand Down
170 changes: 89 additions & 81 deletions react/src/components/ServiceLauncherModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ interface ServiceCreateConfigResourceType {
'warboy.device'?: number | string;
'hyperaccel-lpu.device'?: number | string;
}
interface MountOptionType {
export interface MountOptionType {
mount_destination?: string;
type?: string;
permission?: string;
Expand Down Expand Up @@ -259,21 +259,27 @@ const ServiceLauncherModal: React.FC<ServiceLauncherProps> = ({
config: {
model: values.vFolderName,
model_version: 1, // FIXME: hardcoded. change it with option later
model_mount_destination: values.modelMountDestination,
model_definition_path: values.modelDefinitionPath,
extra_mounts: _.reduce(
values.mounts,
(acc, key: string) => {
acc[key] = {
...(values.vfoldersAliasMap[key] && {
mount_destination: values.vfoldersAliasMap[key],
}),
type: 'bind', // FIXME: hardcoded. change it with option later
};
return acc;
},
{} as Record<string, MountOptionType>,
),
...(baiClient.supports('endpoint-extra-mounts') && {
extra_mounts: _.reduce(
values.mounts,
(acc, key: string) => {
acc[key] = {
...(values.vfoldersAliasMap[key] && {
mount_destination: values.vfoldersAliasMap[key],
}),
type: 'bind', // FIXME: hardcoded. change it with option later
};
return acc;
},
{} as Record<string, MountOptionType>,
),
model_definition_path: values.modelDefinitionPath,
}),
model_mount_destination:
baiClient.supports('endpoint-extra-mounts') &&
values.modelMountDestination !== ''
? values.modelMountDestination
: '/models',
environ: {}, // FIXME: hardcoded. change it with option later
scaling_group: values.resourceGroup,
resources: {
Expand Down Expand Up @@ -516,7 +522,6 @@ const ServiceLauncherModal: React.FC<ServiceLauncherProps> = ({

// Apply any operation after clicking Cancel or close button button
const handleCancel = () => {
formRef.current?.resetFields();
onRequestClose();
};

Expand Down Expand Up @@ -597,7 +602,6 @@ const ServiceLauncherModal: React.FC<ServiceLauncherProps> = ({
<Form
ref={formRef}
disabled={mutationToCreateService.isLoading}
preserve={false}
layout="vertical"
labelCol={{ span: 12 }}
initialValues={
Expand Down Expand Up @@ -716,71 +720,75 @@ const ServiceLauncherModal: React.FC<ServiceLauncherProps> = ({
</Form.Item>
)
)}
<Flex
direction="row"
gap={'xxs'}
align="stretch"
justify="between"
>
<Form.Item
name={'modelMountDestination'}
label={t('modelService.ModelMountDestination')}
style={{ width: '50%' }}
labelCol={{ style: { width: 400 } }}
>
<Input
allowClear
placeholder={'/models'}
disabled={!!endpoint}
/>
</Form.Item>
<MinusOutlined
style={{
fontSize: token.fontSizeXL,
color: token.colorTextDisabled,
}}
rotate={290}
/>
<Form.Item
name={'modelDefinitionPath'}
label={t('modelService.ModelDefinitionPath')}
style={{ width: '50%' }}
labelCol={{ style: { width: 300 } }}
>
<Input
allowClear
placeholder={
endpoint?.model_definition_path
? endpoint?.model_definition_path
: 'model-definition.yaml'
}
/>
</Form.Item>
</Flex>
<Form.Item
noStyle
shouldUpdate={(prev, cur) =>
prev.vFolderName !== cur.vFolderName
}
>
{() => {
return (
<VFolderTableFormItem
rowKey={'id'}
label={t('modelService.AdditionalMounts')}
filter={(vf) =>
vf.name !==
formRef.current?.getFieldValue('vFolderName') &&
vf.status === 'ready' &&
vf.usage_mode !== 'model'
}
tableProps={{
size: 'small',
{baiClient.supports('endpoint-extra-mounts') ? (
<>
<Flex
direction="row"
gap={'xxs'}
align="stretch"
justify="between"
>
<Form.Item
name={'modelMountDestination'}
label={t('modelService.ModelMountDestination')}
style={{ width: '50%' }}
labelCol={{ style: { width: 400 } }}
>
<Input
allowClear
placeholder={'/models'}
disabled={!!endpoint}
/>
</Form.Item>
<MinusOutlined
style={{
fontSize: token.fontSizeXL,
color: token.colorTextDisabled,
}}
rotate={290}
/>
);
}}
</Form.Item>
<Form.Item
name={'modelDefinitionPath'}
label={t('modelService.ModelDefinitionPath')}
style={{ width: '50%' }}
labelCol={{ style: { width: 300 } }}
>
<Input
allowClear
placeholder={
endpoint?.model_definition_path
? endpoint?.model_definition_path
: 'model-definition.yaml'
}
/>
</Form.Item>
</Flex>
<Form.Item
noStyle
shouldUpdate={(prev, cur) =>
prev.vFolderName !== cur.vFolderName
}
>
{() => {
return (
<VFolderTableFormItem
rowKey={'id'}
label={t('modelService.AdditionalMounts')}
filter={(vf) =>
vf.name !==
formRef.current?.getFieldValue('vFolderName') &&
vf.status === 'ready' &&
vf.usage_mode !== 'model'
}
tableProps={{
size: 'small',
}}
/>
);
}}
</Form.Item>
</>
) : null}
</>
)}
<Form.Item
Expand Down
22 changes: 21 additions & 1 deletion react/src/components/ServiceValidationView.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import { useTanMutation } from '../hooks/reactQueryAlias';
import Flex from './Flex';
import FlexActivityIndicator from './FlexActivityIndicator';
import {
MountOptionType,
ServiceCreateType,
ServiceLauncherFormValue,
} from './ServiceLauncherModal';
Expand Down Expand Up @@ -62,7 +63,26 @@ const ServiceValidationView: React.FC<ServiceValidationModalProps> = ({
open_to_public: values.openToPublic,
config: {
model: values.vFolderName,
model_mount_destination: '/models', // FIXME: hardcoded. change it with option later
model_version: 1, // FIXME: hardcoded. change it with option later
...(baiClient.supports('endpoint-extra-mounts') && {
extra_mounts: _.reduce(
values.mounts,
(acc, key: string) => {
acc[key] = {
...(values.vfoldersAliasMap[key] && {
mount_destination: values.vfoldersAliasMap[key],
}),
type: 'bind', // FIXME: hardcoded. change it with option later
};
return acc;
},
{} as Record<string, MountOptionType>,
),
}),
model_definition_path: values.modelDefinitionPath,
model_mount_destination: baiClient.supports('endpoint-extra-mounts')
? values.modelMountDestination
: '/models',
environ: {}, // FIXME: hardcoded. change it with option later
scaling_group: values.resourceGroup,
resources: {
Expand Down
2 changes: 1 addition & 1 deletion react/src/components/VFolderTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -173,7 +173,7 @@ const VFolderTable: React.FC<VFolderTableProps> = ({
keypair_resource_policy_name: keypair?.resource_policy || '',
},
{
fetchPolicy: 'network-only',
fetchPolicy: 'store-and-network',
fetchKey: fetchKey,
},
);
Expand Down
Loading

0 comments on commit bfb86e5

Please sign in to comment.