diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json index db38bbcdbf..c67d634126 100644 --- a/invokeai/frontend/web/public/locales/en.json +++ b/invokeai/frontend/web/public/locales/en.json @@ -304,6 +304,12 @@ "method": "High Resolution Fix Method" } }, + "prompt": { + "addPromptTrigger": "Add Prompt Trigger", + "compatibleEmbeddings": "Compatible Embeddings", + "noPromptTriggers": "No triggers available", + "noMatchingTriggers": "No matching triggers" + }, "embedding": { "addEmbedding": "Add Embedding", "incompatibleModel": "Incompatible base model:", diff --git a/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.stories.tsx b/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.stories.tsx deleted file mode 100644 index fe25569413..0000000000 --- a/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.stories.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import type { Meta, StoryObj } from '@storybook/react'; - -import { EmbeddingSelect } from './EmbeddingSelect'; -import type { EmbeddingSelectProps } from './types'; - -const meta: Meta = { - title: 'Feature/Prompt/EmbeddingSelect', - tags: ['autodocs'], - component: EmbeddingSelect, -}; - -export default meta; -type Story = StoryObj; - -const Component = (props: EmbeddingSelectProps) => { - return Invoke; -}; - -export const Default: Story = { - render: Component, -}; diff --git a/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.tsx b/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.tsx deleted file mode 100644 index 848cb04386..0000000000 --- a/invokeai/frontend/web/src/features/embedding/EmbeddingSelect.tsx +++ /dev/null @@ -1,67 +0,0 @@ -import type { ChakraProps } from '@invoke-ai/ui-library'; -import { Combobox, FormControl } from '@invoke-ai/ui-library'; -import { useAppSelector } from 'app/store/storeHooks'; -import { useGroupedModelCombobox } from 'common/hooks/useGroupedModelCombobox'; -import type { EmbeddingSelectProps } from 'features/embedding/types'; -import { t } from 'i18next'; -import { memo, useCallback } from 'react'; -import { useTranslation } from 'react-i18next'; -import { useGetTextualInversionModelsQuery } from 'services/api/endpoints/models'; -import type { TextualInversionModelConfig } from 'services/api/types'; - -const noOptionsMessage = () => t('embedding.noMatchingEmbedding'); - -export const EmbeddingSelect = memo(({ onSelect, onClose }: EmbeddingSelectProps) => { - const { t } = useTranslation(); - - const currentBaseModel = useAppSelector((s) => s.generation.model?.base); - - const getIsDisabled = useCallback( - (embedding: TextualInversionModelConfig): boolean => { - const isCompatible = currentBaseModel === embedding.base; - const hasMainModel = Boolean(currentBaseModel); - return !hasMainModel || !isCompatible; - }, - [currentBaseModel] - ); - const { data, isLoading } = useGetTextualInversionModelsQuery(); - - const _onChange = useCallback( - (embedding: TextualInversionModelConfig | null) => { - if (!embedding) { - return; - } - onSelect(embedding.name); - }, - [onSelect] - ); - - const { options, onChange } = useGroupedModelCombobox({ - modelEntities: data, - getIsDisabled, - onChange: _onChange, - }); - - return ( - - - - ); -}); - -EmbeddingSelect.displayName = 'EmbeddingSelect'; - -const selectStyles: ChakraProps['sx'] = { - w: 'full', -}; diff --git a/invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/Metadata/ModelMetadata.tsx b/invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/Metadata/ModelMetadata.tsx index 2284041e40..700a98c4ec 100644 --- a/invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/Metadata/ModelMetadata.tsx +++ b/invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/Metadata/ModelMetadata.tsx @@ -10,13 +10,11 @@ export const ModelMetadata = () => { const { data: metadata } = useGetModelMetadataQuery(selectedModelKey ?? skipToken); return ( - <> - - - - - - - + + + + + + ); }; diff --git a/invokeai/frontend/web/src/features/parameters/components/Core/ParamNegativePrompt.tsx b/invokeai/frontend/web/src/features/parameters/components/Core/ParamNegativePrompt.tsx index d10982a4ff..ea6eafd8b9 100644 --- a/invokeai/frontend/web/src/features/parameters/components/Core/ParamNegativePrompt.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/Core/ParamNegativePrompt.tsx @@ -1,8 +1,8 @@ import { Box, Textarea } from '@invoke-ai/ui-library'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; -import { AddEmbeddingButton } from 'features/embedding/AddEmbeddingButton'; -import { EmbeddingPopover } from 'features/embedding/EmbeddingPopover'; -import { usePrompt } from 'features/embedding/usePrompt'; +import { AddPromptTriggerButton } from 'features/prompt/AddPromptTriggerButton'; +import { PromptPopover } from 'features/prompt/PromptPopover'; +import { usePrompt } from 'features/prompt/usePrompt'; import { PromptOverlayButtonWrapper } from 'features/parameters/components/Prompts/PromptOverlayButtonWrapper'; import { setNegativePrompt } from 'features/parameters/store/generationSlice'; import { memo, useCallback, useRef } from 'react'; @@ -19,19 +19,14 @@ export const ParamNegativePrompt = memo(() => { }, [dispatch] ); - const { onChange, isOpen, onClose, onOpen, onSelectEmbedding, onKeyDown } = usePrompt({ + const { onChange, isOpen, onClose, onOpen, onSelect, onKeyDown } = usePrompt({ prompt, textareaRef, onChange: _onChange, }); return ( - +