diff --git a/invokeai/frontend/web/public/locales/en.json b/invokeai/frontend/web/public/locales/en.json index 18f506d5bf..751d56372f 100644 --- a/invokeai/frontend/web/public/locales/en.json +++ b/invokeai/frontend/web/public/locales/en.json @@ -102,7 +102,8 @@ "generate": "Generate", "openInNewTab": "Open in New Tab", "dontAskMeAgain": "Don't ask me again", - "areYouSure": "Are you sure?" + "areYouSure": "Are you sure?", + "imagePrompt": "Image Prompt" }, "gallery": { "generations": "Generations", diff --git a/invokeai/frontend/web/src/app/store/util/defaultMemoizeOptions.ts b/invokeai/frontend/web/src/app/store/util/defaultMemoizeOptions.ts new file mode 100644 index 0000000000..fd2abd228d --- /dev/null +++ b/invokeai/frontend/web/src/app/store/util/defaultMemoizeOptions.ts @@ -0,0 +1,7 @@ +import { isEqual } from 'lodash-es'; + +export const defaultSelectorOptions = { + memoizeOptions: { + resultEqualityCheck: isEqual, + }, +}; diff --git a/invokeai/frontend/web/src/common/components/ImageToImageOverlay.tsx b/invokeai/frontend/web/src/common/components/ImageToImageOverlay.tsx index 45a45e37d3..9d864f5c9c 100644 --- a/invokeai/frontend/web/src/common/components/ImageToImageOverlay.tsx +++ b/invokeai/frontend/web/src/common/components/ImageToImageOverlay.tsx @@ -14,6 +14,7 @@ const ImageToImageOverlay = ({ image }: ImageToImageOverlayProps) => { w: 'full', h: 'full', position: 'absolute', + pointerEvents: 'none', }} > { +const ImagePromptHeading = () => { const dispatch = useAppDispatch(); const { t } = useTranslation(); @@ -18,7 +18,7 @@ const ImageToImageSettingsHeader = () => { return ( - Image to Image + {t('parameters.initialImage')} @@ -38,4 +38,4 @@ const ImageToImageSettingsHeader = () => { ); }; -export default ImageToImageSettingsHeader; +export default ImagePromptHeading; diff --git a/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx b/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx index 31f36a3761..824860e219 100644 --- a/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx +++ b/invokeai/frontend/web/src/features/gallery/components/CurrentImageButtons.tsx @@ -410,7 +410,7 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => { }} {...props} > - + { )} - + } tooltip={`${t('parameters.usePrompt')} (P)`} @@ -528,7 +528,7 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => { {(isUpscalingEnabled || isFaceRestoreEnabled) && ( - + {isFaceRestoreEnabled && ( { )} - + } tooltip={`${t('parameters.info')} (I)`} @@ -603,14 +603,16 @@ const CurrentImageButtons = (props: CurrentImageButtonsProps) => { /> - } - tooltip={`${t('gallery.deleteImage')} (Del)`} - aria-label={`${t('gallery.deleteImage')} (Del)`} - isDisabled={!image || !isConnected} - colorScheme="error" - /> + + } + tooltip={`${t('gallery.deleteImage')} (Del)`} + aria-label={`${t('gallery.deleteImage')} (Del)`} + isDisabled={!image || !isConnected} + colorScheme="error" + /> + {image && ( { }, [dispatch, currentCategory]); return ( - + - + diff --git a/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageToggle.tsx b/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageToggle.tsx index 89da0ae8b0..eeb0804b5d 100644 --- a/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageToggle.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageToggle.tsx @@ -1,34 +1,50 @@ import { Flex } from '@chakra-ui/react'; +import { createSelector } from '@reduxjs/toolkit'; import { RootState } from 'app/store/store'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; +import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions'; import IAISwitch from 'common/components/IAISwitch'; +import { generationSelector } from 'features/parameters/store/generationSelectors'; import { isImageToImageEnabledChanged } from 'features/parameters/store/generationSlice'; +import { uiSelector } from 'features/ui/store/uiSelectors'; +import { shouldShowImageParametersChanged } from 'features/ui/store/uiSlice'; import { ChangeEvent } from 'react'; import { useTranslation } from 'react-i18next'; +const selector = createSelector( + [uiSelector, generationSelector], + (ui, generation) => { + const { isImageToImageEnabled } = generation; + const { shouldShowImageParameters } = ui; + return { + isImageToImageEnabled, + shouldShowImageParameters, + }; + }, + defaultSelectorOptions +); + export default function ImageToImageToggle() { - const isImageToImageEnabled = useAppSelector( - (state: RootState) => state.generation.isImageToImageEnabled - ); + const { isImageToImageEnabled, shouldShowImageParameters } = + useAppSelector(selector); const { t } = useTranslation(); const dispatch = useAppDispatch(); const handleChange = (e: ChangeEvent) => - dispatch(isImageToImageEnabledChanged(e.target.checked)); + dispatch(shouldShowImageParametersChanged(e.target.checked)); return ( - + diff --git a/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/InitialImagePreview.tsx b/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/InitialImagePreview.tsx index ddfdb622ef..7d5a6f3422 100644 --- a/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/InitialImagePreview.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/AdvancedParameters/ImageToImage/InitialImagePreview.tsx @@ -70,7 +70,6 @@ const InitialImagePreview = () => { return ( { }} onDrop={handleDrop} > - {initialImage?.url && ( - - { - setIsLoaded(true); - }} - fallback={ - - - - } - /> - {isLoaded && } - - )} - {!initialImage?.url && } + + {initialImage?.url && ( + <> + { + setIsLoaded(true); + }} + fallback={ + + + + } + /> + {isLoaded && } + + )} + {!initialImage?.url && } + {!isImageToImageEnabled && ( - } + icon={} paddingX={0} paddingY={0} colorScheme="error" diff --git a/invokeai/frontend/web/src/features/parameters/components/ProcessButtons/ProcessButtons.tsx b/invokeai/frontend/web/src/features/parameters/components/ProcessButtons/ProcessButtons.tsx index ba8522f0bf..2b4399866e 100644 --- a/invokeai/frontend/web/src/features/parameters/components/ProcessButtons/ProcessButtons.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/ProcessButtons/ProcessButtons.tsx @@ -4,6 +4,8 @@ import { activeTabNameSelector } from 'features/ui/store/uiSelectors'; import CancelButton from './CancelButton'; import InvokeButton from './InvokeButton'; import LoopbackButton from './Loopback'; +import IAICheckbox from 'common/components/IAICheckbox'; +import IAISwitch from 'common/components/IAISwitch'; /** * Buttons to start and cancel image generation. diff --git a/invokeai/frontend/web/src/features/parameters/components/ProgressImagePreview.tsx b/invokeai/frontend/web/src/features/parameters/components/ProgressImagePreview.tsx index 4458f873db..09fad6acda 100644 --- a/invokeai/frontend/web/src/features/parameters/components/ProgressImagePreview.tsx +++ b/invokeai/frontend/web/src/features/parameters/components/ProgressImagePreview.tsx @@ -55,7 +55,6 @@ const ProgressImagePreview = () => { return ( <> - {' '} dispatch(setShouldShowProgressImages(!showProgressWindow)) diff --git a/invokeai/frontend/web/src/features/ui/components/CreateParametersDrawer.tsx b/invokeai/frontend/web/src/features/ui/components/CreateParametersDrawer.tsx index 507c349471..a033ae3a05 100644 --- a/invokeai/frontend/web/src/features/ui/components/CreateParametersDrawer.tsx +++ b/invokeai/frontend/web/src/features/ui/components/CreateParametersDrawer.tsx @@ -1,6 +1,6 @@ import { isEqual } from 'lodash-es'; import ResizableDrawer from './common/ResizableDrawer/ResizableDrawer'; -import GenerateParameters from './tabs/Create/GenerateParameters'; +import CreateBaseSettings from './tabs/Create/CreateBaseSettings'; import { createSelector } from '@reduxjs/toolkit'; import { activeTabNameSelector, uiSelector } from '../store/uiSelectors'; import { lightboxSelector } from 'features/lightbox/store/lightboxSelectors'; @@ -13,16 +13,26 @@ import { memo } from 'react'; import { Flex } from '@chakra-ui/react'; import InvokeAILogoComponent from 'features/system/components/InvokeAILogoComponent'; import PinParametersPanelButton from './PinParametersPanelButton'; +import { Panel, PanelGroup } from 'react-resizable-panels'; +import CreateSidePanelPinned from './tabs/Create/CreateSidePanelPinned'; +import CreateTextParameters from './tabs/Create/CreateBaseSettings'; +import ResizeHandle from './tabs/ResizeHandle'; +import CreateImageSettings from './tabs/Create/CreateImageSettings'; const selector = createSelector( [uiSelector, activeTabNameSelector, lightboxSelector], (ui, activeTabName, lightbox) => { - const { shouldPinParametersPanel, shouldShowParametersPanel } = ui; + const { + shouldPinParametersPanel, + shouldShowParametersPanel, + shouldShowImageParameters, + } = ui; const { isLightboxOpen } = lightbox; return { shouldPinParametersPanel, shouldShowParametersPanel, + shouldShowImageParameters, }; }, { @@ -34,8 +44,11 @@ const selector = createSelector( const CreateParametersPanel = () => { const dispatch = useAppDispatch(); - const { shouldPinParametersPanel, shouldShowParametersPanel } = - useAppSelector(selector); + const { + shouldPinParametersPanel, + shouldShowParametersPanel, + shouldShowImageParameters, + } = useAppSelector(selector); const handleClosePanel = () => { dispatch(setShouldShowParametersPanel(false)); @@ -53,13 +66,7 @@ const CreateParametersPanel = () => { onClose={handleClosePanel} minWidth={500} > - + { - + + <> + + + + {shouldShowImageParameters && ( + <> + + + + + + )} + + ); diff --git a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx index f548744c44..509272a2e4 100644 --- a/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx +++ b/invokeai/frontend/web/src/features/ui/components/InvokeTabs.tsx @@ -39,13 +39,13 @@ import { configSelector } from 'features/system/store/configSelectors'; import { isEqual } from 'lodash-es'; import AnimatedImageToImagePanel from 'features/parameters/components/AnimatedImageToImagePanel'; import Scrollable from './common/Scrollable'; -import GenerateParameters from './tabs/Create/GenerateParameters'; +import CreateBaseSettings from './tabs/Create/CreateBaseSettings'; import PinParametersPanelButton from './PinParametersPanelButton'; import ParametersSlide from './common/ParametersSlide'; import ImageGalleryPanel from 'features/gallery/components/ImageGalleryPanel'; import { Panel, PanelGroup, PanelResizeHandle } from 'react-resizable-panels'; import ImageGalleryContent from 'features/gallery/components/ImageGalleryContent'; -import CreateTabContent from './tabs/Create/GenerateContent'; +import CreateTabContent from './tabs/Create/CreateContent'; import ParametersPanel from './ParametersPanel'; import { OverlayScrollbarsComponent } from 'overlayscrollbars-react'; import CreateTab from './tabs/Create/CreateTab'; diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateParameters.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateBaseSettings.tsx similarity index 97% rename from invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateParameters.tsx rename to invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateBaseSettings.tsx index b03594eec6..1208f867b2 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateParameters.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateBaseSettings.tsx @@ -40,7 +40,7 @@ import { PARAMETERS_PANEL_WIDTH } from 'theme/util/constants'; import OverlayScrollable from '../../common/OverlayScrollable'; import AnimatedImageToImagePanel from 'features/parameters/components/AnimatedImageToImagePanel'; -const GenerateParameters = () => { +const CreateBaseSettings = () => { const { t } = useTranslation(); const generateAccordionItems: ParametersAccordionItems = useMemo( @@ -102,23 +102,22 @@ const GenerateParameters = () => { + - ); }; -export default memo(GenerateParameters); +export default memo(CreateBaseSettings); diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateContent.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateContent.tsx similarity index 78% rename from invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateContent.tsx rename to invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateContent.tsx index cd0c6a6142..bad7475c2e 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateContent.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateContent.tsx @@ -10,10 +10,16 @@ const CreateTabContent = () => { width: '100%', height: '100%', borderRadius: 'base', - bg: 'base.850', + // bg: 'base.850', }} > - + diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateImageSettings.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateImageSettings.tsx new file mode 100644 index 0000000000..ac80ae77f3 --- /dev/null +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateImageSettings.tsx @@ -0,0 +1,53 @@ +import { memo } from 'react'; +import OverlayScrollable from '../../common/OverlayScrollable'; +import ImageToImageSettings from 'features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageSettings'; +import { + Box, + ButtonGroup, + Collapse, + Flex, + Heading, + HStack, + Image, + Spacer, + useDisclosure, + VStack, +} from '@chakra-ui/react'; +import { motion } from 'framer-motion'; + +import IAIButton from 'common/components/IAIButton'; +import ImageFit from 'features/parameters/components/AdvancedParameters/ImageToImage/ImageFit'; +import ImageToImageStrength from 'features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageStrength'; +import IAIIconButton from 'common/components/IAIIconButton'; + +import { useTranslation } from 'react-i18next'; +import { useState } from 'react'; +import { FaUndo, FaUpload } from 'react-icons/fa'; +import ImagePromptHeading from 'common/components/ImageToImageSettingsHeader'; +import InitialImagePreview from 'features/parameters/components/AdvancedParameters/ImageToImage/InitialImagePreview'; + +const CreateImageSettings = () => { + return ( + + + + + + + + + ); +}; + +export default memo(CreateImageSettings); diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateSidePanelPinned.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateSidePanelPinned.tsx new file mode 100644 index 0000000000..b17237d46e --- /dev/null +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateSidePanelPinned.tsx @@ -0,0 +1,69 @@ +import { createSelector } from '@reduxjs/toolkit'; +import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; +import { uiSelector } from 'features/ui/store/uiSelectors'; +import { memo } from 'react'; +import { Panel } from 'react-resizable-panels'; +import CreateTextParameters from './CreateBaseSettings'; +import PinParametersPanelButton from '../../PinParametersPanelButton'; +import ResizeHandle from '../ResizeHandle'; +import ImageToImageSettings from 'features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageSettings'; +import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions'; +import CreateImageSettings from './CreateImageSettings'; + +const selector = createSelector( + uiSelector, + (ui) => { + const { + shouldPinParametersPanel, + shouldShowParametersPanel, + shouldShowImageParameters, + } = ui; + + return { + shouldPinParametersPanel, + shouldShowParametersPanel, + shouldShowImageParameters, + }; + }, + defaultSelectorOptions +); + +const CreateSidePanelPinned = () => { + const dispatch = useAppDispatch(); + const { + shouldPinParametersPanel, + shouldShowParametersPanel, + shouldShowImageParameters, + } = useAppSelector(selector); + return ( + <> + + + + + {shouldShowImageParameters && ( + <> + + + + + + )} + + + ); +}; + +export default memo(CreateSidePanelPinned); diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateTab.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateTab.tsx index b6236386d6..9bd11d828b 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateTab.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/CreateTab.tsx @@ -1,17 +1,20 @@ import { Portal, TabPanel } from '@chakra-ui/react'; import { memo } from 'react'; import { Panel, PanelGroup, PanelResizeHandle } from 'react-resizable-panels'; -import GenerateParameters from './GenerateParameters'; +import CreateBaseSettings from './CreateBaseSettings'; import PinParametersPanelButton from '../../PinParametersPanelButton'; import ImageGalleryContent from 'features/gallery/components/ImageGalleryContent'; import { createSelector } from '@reduxjs/toolkit'; import { uiSelector } from 'features/ui/store/uiSelectors'; import { useAppDispatch, useAppSelector } from 'app/store/storeHooks'; import { requestCanvasRescale } from 'features/canvas/store/thunks/requestCanvasScale'; -import CreateTabContent from './GenerateContent'; +import CreateTabContent from './CreateContent'; import ResizeHandle from '../ResizeHandle'; import AnimatedImageToImagePanel from 'features/parameters/components/AnimatedImageToImagePanel'; import ImageToImageSettings from 'features/parameters/components/AdvancedParameters/ImageToImage/ImageToImageSettings'; +import CreateSidePanelPinned from './CreateSidePanelPinned'; +import CreateTextParameters from './CreateBaseSettings'; +import CreateImageSettings from './CreateImageSettings'; const selector = createSelector(uiSelector, (ui) => { const { @@ -19,6 +22,7 @@ const selector = createSelector(uiSelector, (ui) => { shouldShowGallery, shouldPinParametersPanel, shouldShowParametersPanel, + shouldShowImageParameters, } = ui; return { @@ -26,6 +30,7 @@ const selector = createSelector(uiSelector, (ui) => { shouldShowGallery, shouldPinParametersPanel, shouldShowParametersPanel, + shouldShowImageParameters, }; }); @@ -36,44 +41,49 @@ const CreateTab = () => { shouldShowGallery, shouldPinParametersPanel, shouldShowParametersPanel, + shouldShowImageParameters, } = useAppSelector(selector); return ( {shouldPinParametersPanel && shouldShowParametersPanel && ( <> - + - - - )} - {shouldPinParametersPanel && shouldShowParametersPanel && ( - <> - - - + {shouldShowImageParameters && ( + <> + + + + + + )} )} { dispatch(requestCanvasRescale()); @@ -84,7 +94,7 @@ const CreateTab = () => { {shouldPinGallery && shouldShowGallery && ( <> - + diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateWorkspace.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateWorkspace.tsx index ebbf5cb5be..a49836e027 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateWorkspace.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Create/GenerateWorkspace.tsx @@ -1,8 +1,8 @@ import { Box, Flex } from '@chakra-ui/react'; import { useAppSelector } from 'app/store/storeHooks'; import { memo } from 'react'; -import CreateTabContent from './GenerateContent'; -import GenerateParameters from './GenerateParameters'; +import CreateTabContent from './CreateContent'; +import CreateBaseSettings from './CreateBaseSettings'; import PinParametersPanelButton from '../../PinParametersPanelButton'; import { RootState } from 'app/store/store'; import Scrollable from '../../common/Scrollable'; @@ -35,7 +35,7 @@ const GenerateWorkspace = () => { }} > - + { ) : ( - + )} diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/Nodes/NodesTab.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/Nodes/NodesTab.tsx index d754cca45e..c3f82a6b7c 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/Nodes/NodesTab.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/Nodes/NodesTab.tsx @@ -37,6 +37,7 @@ const NodesTab = () => { return ( diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/ResizeHandle.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/ResizeHandle.tsx index 02f2486fbe..e75a4fa88a 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/ResizeHandle.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/ResizeHandle.tsx @@ -8,7 +8,7 @@ const ResizeHandle = () => { - + ); diff --git a/invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasTab.tsx b/invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasTab.tsx index 382bfd8105..65122af536 100644 --- a/invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasTab.tsx +++ b/invokeai/frontend/web/src/features/ui/components/tabs/UnifiedCanvas/UnifiedCanvasTab.tsx @@ -42,6 +42,7 @@ const UnifiedCanvasTab = () => { return ( diff --git a/invokeai/frontend/web/src/features/ui/store/uiSlice.ts b/invokeai/frontend/web/src/features/ui/store/uiSlice.ts index c5d3442f38..c4e2ad367c 100644 --- a/invokeai/frontend/web/src/features/ui/store/uiSlice.ts +++ b/invokeai/frontend/web/src/features/ui/store/uiSlice.ts @@ -24,6 +24,7 @@ export const initialUIState: UIState = { floatingProgressImageRect: { x: 0, y: 0, width: 0, height: 0 }, shouldShowProgressImages: false, shouldAutoShowProgressImages: false, + shouldShowImageParameters: false, }; export const uiSlice = createSlice({ @@ -136,6 +137,12 @@ export const uiSlice = createSlice({ ) => { state.shouldAutoShowProgressImages = action.payload; }, + shouldShowImageParametersChanged: ( + state, + action: PayloadAction + ) => { + state.shouldShowImageParameters = action.payload; + }, }, }); @@ -163,6 +170,7 @@ export const { floatingProgressImageResized, setShouldShowProgressImages, setShouldAutoShowProgressImages, + shouldShowImageParametersChanged, } = uiSlice.actions; export default uiSlice.reducer; diff --git a/invokeai/frontend/web/src/features/ui/store/uiTypes.ts b/invokeai/frontend/web/src/features/ui/store/uiTypes.ts index bdcf0a3c30..3e2a3a1616 100644 --- a/invokeai/frontend/web/src/features/ui/store/uiTypes.ts +++ b/invokeai/frontend/web/src/features/ui/store/uiTypes.ts @@ -32,4 +32,5 @@ export interface UIState { floatingProgressImageRect: Rect; shouldShowProgressImages: boolean; shouldAutoShowProgressImages: boolean; + shouldShowImageParameters: boolean; }