github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-04-23 03:00:31 -04:00
Code Issues Packages Projects Releases Wiki Activity

(ui): add required/optional logic to other submodel fields

Browse Source
This commit is contained in:
Mary Hipp
2024-10-30 15:12:08 -04:00
committed by Brandon
parent befb629f46
commit 0ebe8fb1bd
4 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/CLIPEmbedModelFieldInputComponent.tsx
View File

@@ -39,14 +39,15 @@ const CLIPEmbedModelFieldInputComponent = (props: Props) => {
isLoading, isLoading,
selectedModel: field.value, selectedModel: field.value,
}); });
const required = props.fieldTemplate.required;
return ( return (
<Flex w="full" alignItems="center" gap={2}> <Flex w="full" alignItems="center" gap={2}>
<Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}> <Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}>
<FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value}> <FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value && required}>
<Combobox <Combobox
value={value} value={value}
placeholder={placeholder} placeholder={required ? placeholder : `(Optional) ${placeholder}`}
options={options} options={options}
onChange={onChange} onChange={onChange}
noOptionsMessage={noOptionsMessage} noOptionsMessage={noOptionsMessage}

5
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/CLIPGEmbedModelFieldInputComponent.tsx
View File

@@ -40,14 +40,15 @@ const CLIPGEmbedModelFieldInputComponent = (props: Props) => {
isLoading, isLoading,
selectedModel: field.value, selectedModel: field.value,
}); });
const required = props.fieldTemplate.required;
return ( return (
<Flex w="full" alignItems="center" gap={2}> <Flex w="full" alignItems="center" gap={2}>
<Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}> <Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}>
<FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value}> <FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value && required}>
<Combobox <Combobox
value={value} value={value}
placeholder={placeholder} placeholder={required ? placeholder : `(Optional) ${placeholder}`}
options={options} options={options}
onChange={onChange} onChange={onChange}
noOptionsMessage={noOptionsMessage} noOptionsMessage={noOptionsMessage}

5
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/CLIPLEmbedModelFieldInputComponent.tsx
View File

@@ -40,14 +40,15 @@ const CLIPLEmbedModelFieldInputComponent = (props: Props) => {
isLoading, isLoading,
selectedModel: field.value, selectedModel: field.value,
}); });
const required = props.fieldTemplate.required;
return ( return (
<Flex w="full" alignItems="center" gap={2}> <Flex w="full" alignItems="center" gap={2}>
<Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}> <Tooltip label={!disabledTabs.includes('models') && t('modelManager.starterModelsInModelManager')}>
<FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value}> <FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value && required}>
<Combobox <Combobox
value={value} value={value}
placeholder={placeholder} placeholder={required ? placeholder : `(Optional) ${placeholder}`}
options={options} options={options}
onChange={onChange} onChange={onChange}
noOptionsMessage={noOptionsMessage} noOptionsMessage={noOptionsMessage}

5
invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/VAEModelFieldInputComponent.tsx
View File

@@ -36,13 +36,14 @@ const VAEModelFieldInputComponent = (props: Props) => {
selectedModel: field.value, selectedModel: field.value,
isLoading, isLoading,
}); });
const required = props.fieldTemplate.required;
return ( return (
<Flex w="full" alignItems="center" gap={2}> <Flex w="full" alignItems="center" gap={2}>
<FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value}> <FormControl className="nowheel nodrag" isDisabled={!options.length} isInvalid={!value && required}>
<Combobox <Combobox
value={value} value={value}
placeholder={placeholder} placeholder={required ? placeholder : `(Optional) ${placeholder}`}
options={options} options={options}
onChange={onChange} onChange={onChange}
noOptionsMessage={noOptionsMessage} noOptionsMessage={noOptionsMessage}