81 lines
2.0 KiB
TypeScript
81 lines
2.0 KiB
TypeScript
import { PageActionType } from '@/config/types';
|
|
import FormDrawer from '@/pages/_components/form-drawer';
|
|
import React, { useEffect, useRef } from 'react';
|
|
import { ProviderType } from '../config';
|
|
import {
|
|
ClusterListItem,
|
|
NodePoolFormData as FormData,
|
|
NodePoolListItem as ListItem
|
|
} from '../config/types';
|
|
import { useProviderRegions } from '../hooks/use-provider-regions';
|
|
import PoolForm from './pool-form';
|
|
|
|
type AddModalProps = {
|
|
title: string;
|
|
action: PageActionType;
|
|
open: boolean;
|
|
provider: ProviderType; // 'kubernetes' | 'custom' | 'digitalocean';
|
|
currentData?: ListItem | null;
|
|
clusterData?: ClusterListItem | null;
|
|
onOk: (values: FormData) => void;
|
|
onCancel: () => void;
|
|
};
|
|
const AddPool: React.FC<AddModalProps> = ({
|
|
title,
|
|
action,
|
|
open,
|
|
provider,
|
|
onOk,
|
|
currentData,
|
|
clusterData,
|
|
onCancel
|
|
}) => {
|
|
const { getInstanceTypes, getOSImages, updateInstanceTypes, updateOSImages } =
|
|
useProviderRegions();
|
|
const formRef = useRef<any>(null);
|
|
|
|
const handleSubmit = async () => {
|
|
formRef.current?.submit?.();
|
|
};
|
|
|
|
const handleOnFinish = async (data: FormData) => {
|
|
onOk(data);
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
formRef.current?.reset?.();
|
|
onCancel();
|
|
};
|
|
|
|
useEffect(() => {
|
|
const init = async (clusterData: ClusterListItem) => {
|
|
const allTyps = await getInstanceTypes(clusterData.credential_id);
|
|
const allImages = await getOSImages(clusterData.credential_id);
|
|
updateInstanceTypes(clusterData.region, allTyps);
|
|
updateOSImages(clusterData.region, allImages);
|
|
};
|
|
if (open && clusterData && clusterData.credential_id) {
|
|
init(clusterData);
|
|
}
|
|
}, [clusterData, open]);
|
|
|
|
return (
|
|
<FormDrawer
|
|
title={title}
|
|
open={open}
|
|
onCancel={handleCancel}
|
|
onSubmit={handleSubmit}
|
|
>
|
|
<PoolForm
|
|
ref={formRef}
|
|
action={action}
|
|
provider={provider}
|
|
currentData={currentData}
|
|
onFinish={handleOnFinish}
|
|
></PoolForm>
|
|
</FormDrawer>
|
|
);
|
|
};
|
|
|
|
export default AddPool;
|