fix: select a useable instance type for initial
This commit is contained in:
@@ -200,9 +200,13 @@ const AddModal: React.FC<AddModalProps> = ({
|
|||||||
}
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
if (!instanceTypes.length) return;
|
|
||||||
|
|
||||||
const first = instanceTypes[0];
|
const first = instanceTypes.find((item) => !item.disabled);
|
||||||
|
|
||||||
|
if (!first) return;
|
||||||
|
|
||||||
|
// On create, auto-select the first instance type in the list
|
||||||
|
|
||||||
const template = findTemplateByManufacturer(
|
const template = findTemplateByManufacturer(
|
||||||
first.spec?.manufacturer,
|
first.spec?.manufacturer,
|
||||||
templates
|
templates
|
||||||
|
|||||||
@@ -33,11 +33,21 @@ const InstanceTypeList: React.FC<InstanceTypeListProps> = ({
|
|||||||
dataList = [],
|
dataList = [],
|
||||||
loading
|
loading
|
||||||
}) => {
|
}) => {
|
||||||
const handleSelect = (item: InstanceTypeItemModel) => {
|
const handleSelect = (
|
||||||
if (!isAvailable(item) || value === item.name) return;
|
item: InstanceTypeItemModel & { disabled?: boolean }
|
||||||
|
) => {
|
||||||
|
if (item.disabled || value === item.name) return;
|
||||||
onChange?.(item);
|
onChange?.(item);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const filterList = dataList.map((item) => {
|
||||||
|
const available = isAvailable(item);
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
disabled: !available
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
if (!dataList.length) {
|
if (!dataList.length) {
|
||||||
if (loading) {
|
if (loading) {
|
||||||
return (
|
return (
|
||||||
@@ -55,8 +65,7 @@ const InstanceTypeList: React.FC<InstanceTypeListProps> = ({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<TypeGrid>
|
<TypeGrid>
|
||||||
{dataList.map((item) => {
|
{filterList.map((item) => {
|
||||||
const disabled = !isAvailable(item);
|
|
||||||
const name = item.name;
|
const name = item.name;
|
||||||
return (
|
return (
|
||||||
<TemplateCard
|
<TemplateCard
|
||||||
@@ -66,7 +75,7 @@ const InstanceTypeList: React.FC<InstanceTypeListProps> = ({
|
|||||||
hoverable
|
hoverable
|
||||||
height={106}
|
height={106}
|
||||||
active={value === name}
|
active={value === name}
|
||||||
disabled={disabled}
|
disabled={item.disabled}
|
||||||
onClick={() => handleSelect(item)}
|
onClick={() => handleSelect(item)}
|
||||||
>
|
>
|
||||||
<InstanceTypeItem item={item} />
|
<InstanceTypeItem item={item} />
|
||||||
|
|||||||
@@ -131,6 +131,7 @@ export interface InstanceTypeStatus {
|
|||||||
export interface InstanceTypeItem {
|
export interface InstanceTypeItem {
|
||||||
name: string;
|
name: string;
|
||||||
spec: InstanceTypeSpec;
|
spec: InstanceTypeSpec;
|
||||||
|
disabled?: boolean;
|
||||||
status: InstanceTypeStatus;
|
status: InstanceTypeStatus;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user