fix: enhance cluster create form

This commit is contained in:
Yuxing Deng
2026-06-03 23:17:38 +08:00
committed by jialin
parent a221b22be9
commit 4810ff2dbe
2 changed files with 16 additions and 16 deletions
@@ -273,9 +273,6 @@ const ClusterForm: React.FC<AddModalProps> = forwardRef(
<K8sPodSpec <K8sPodSpec
key={currentData?.id ?? 'new'} key={currentData?.id ?? 'new'}
action={action} action={action}
initialGpuInstanceOptions={
currentData?.k8s_options?.gpuInstanceOptions
}
></K8sPodSpec> ></K8sPodSpec>
) )
} }
@@ -2,9 +2,8 @@ import { PageActionType } from '@/config/types';
import { Input as CInput, LabelSelector, SwitchCard } from '@gpustack/core-ui'; import { Input as CInput, LabelSelector, SwitchCard } from '@gpustack/core-ui';
import { useIntl } from '@umijs/max'; import { useIntl } from '@umijs/max';
import { Form } from 'antd'; import { Form } from 'antd';
import React, { useState } from 'react'; import React from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import { GpuInstanceOptions } from '../config/types';
import ImageCredential from './image-credential'; import ImageCredential from './image-credential';
import K8SVolumeMount from './k8s-volume-mount'; import K8SVolumeMount from './k8s-volume-mount';
@@ -77,18 +76,23 @@ const OperatorImageForm: React.FC = () => {
); );
}; };
const GpuInstanceOptionsForm: React.FC<{ const GpuInstanceOptionsForm: React.FC = () => {
initialValue?: GpuInstanceOptions;
}> = ({ initialValue }) => {
const intl = useIntl(); const intl = useIntl();
const form = Form.useFormInstance(); const form = Form.useFormInstance();
const [enabled, setEnabled] = useState<boolean>(!!initialValue); // The presence of `gpuInstanceOptions` on `k8s_options` is the source of
// truth for whether GPU instances are enabled. Derive the toggle directly
// from the watched form value rather than mirroring it into local state, so
// it stays in sync when the form loads async values (EDIT) or resets.
const gpuInstanceOptions = Form.useWatch(
['k8s_options', 'gpuInstanceOptions'],
form
);
const enabled = !!gpuInstanceOptions;
const handleToggle = (checked: boolean) => { const handleToggle = (checked: boolean) => {
setEnabled(checked); if (!form) return;
// The presence of `gpuInstanceOptions` on `k8s_options` is what signals // The presence of `gpuInstanceOptions` is what signals "GPU instances
// "GPU instances enabled" to the backend. The toggle is the source of // enabled" to the backend — when on, ensure the object exists (defaulting
// truth for that presence — when on, ensure the object exists (defaulting
// to {} so it survives even when the static address is left blank); when // to {} so it survives even when the static address is left blank); when
// off, remove it entirely. // off, remove it entirely.
const path = ['k8s_options', 'gpuInstanceOptions']; const path = ['k8s_options', 'gpuInstanceOptions'];
@@ -137,11 +141,10 @@ const GpuInstanceOptionsForm: React.FC<{
const K8sPodSpec: React.FC<{ const K8sPodSpec: React.FC<{
action: PageActionType; action: PageActionType;
initialGpuInstanceOptions?: GpuInstanceOptions; }> = ({ action }) => {
}> = ({ action, initialGpuInstanceOptions }) => {
return ( return (
<> <>
<GpuInstanceOptionsForm initialValue={initialGpuInstanceOptions} /> <GpuInstanceOptionsForm />
<NamespaceForm /> <NamespaceForm />
<K8SVolumeMount action={action}></K8SVolumeMount> <K8SVolumeMount action={action}></K8SVolumeMount>
<ImageCredential /> <ImageCredential />