From e97fd85904e32ebe0a35cc66e75f010970e7dc63 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:33:24 -0400 Subject: [PATCH 1/9] added selectedStylePreset to preload presets when app loads --- invokeai/frontend/web/src/app/components/App.tsx | 16 +++++++++++++++- .../web/src/app/components/InvokeAIUI.tsx | 3 +++ 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/invokeai/frontend/web/src/app/components/App.tsx b/invokeai/frontend/web/src/app/components/App.tsx index 41f3d97051..c7c623488e 100644 --- a/invokeai/frontend/web/src/app/components/App.tsx +++ b/invokeai/frontend/web/src/app/components/App.tsx @@ -14,6 +14,7 @@ import DeleteImageModal from 'features/deleteImageModal/components/DeleteImageMo import { DynamicPromptsModal } from 'features/dynamicPrompts/components/DynamicPromptsPreviewModal'; import { useStarterModelsToast } from 'features/modelManagerV2/hooks/useStarterModelsToast'; import { StylePresetModal } from 'features/stylePresets/components/StylePresetForm/StylePresetModal'; +import { activeStylePresetIdChanged } from 'features/stylePresets/store/stylePresetSlice'; import { configChanged } from 'features/system/store/configSlice'; import { languageSelector } from 'features/system/store/systemSelectors'; import InvokeTabs from 'features/ui/components/InvokeTabs'; @@ -39,10 +40,17 @@ interface Props { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; + selectedStylePresetId?: string; destination?: InvokeTabName | undefined; } -const App = ({ config = DEFAULT_CONFIG, selectedImage, selectedWorkflowId, destination }: Props) => { +const App = ({ + config = DEFAULT_CONFIG, + selectedImage, + selectedWorkflowId, + selectedStylePresetId, + destination, +}: Props) => { const language = useAppSelector(languageSelector); const logger = useLogger('system'); const dispatch = useAppDispatch(); @@ -81,6 +89,12 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage, selectedWorkflowId, desti } }, [selectedWorkflowId, getAndLoadWorkflow]); + useEffect(() => { + if (selectedStylePresetId) { + dispatch(activeStylePresetIdChanged(selectedStylePresetId)); + } + }, [dispatch, selectedStylePresetId]); + useEffect(() => { if (destination) { dispatch(setActiveTab(destination)); diff --git a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx index 5804902408..a17620cae4 100644 --- a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx +++ b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx @@ -45,6 +45,7 @@ interface Props extends PropsWithChildren { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; + selectedStylePresetId?: string; destination?: InvokeTabName; customStarUi?: CustomStarUi; socketOptions?: Partial; @@ -66,6 +67,7 @@ const InvokeAIUI = ({ queueId, selectedImage, selectedWorkflowId, + selectedStylePresetId, destination, customStarUi, socketOptions, @@ -227,6 +229,7 @@ const InvokeAIUI = ({ config={config} selectedImage={selectedImage} selectedWorkflowId={selectedWorkflowId} + selectedStylePresetId={selectedStylePresetId} destination={destination} /> From cd215700fef8a2baba90dbb788e123b0789b8d79 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:34:07 -0400 Subject: [PATCH 2/9] added route for selecting style preset --- invokeai/app/api/routers/style_presets.py | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/invokeai/app/api/routers/style_presets.py b/invokeai/app/api/routers/style_presets.py index dadd89debb..600cd237db 100644 --- a/invokeai/app/api/routers/style_presets.py +++ b/invokeai/app/api/routers/style_presets.py @@ -53,6 +53,20 @@ async def get_style_preset( return StylePresetRecordWithImage(image=image, **style_preset.model_dump()) except StylePresetNotFoundError: raise HTTPException(status_code=404, detail="Style preset not found") + +@style_presets_router.post( + "/i/{style_preset_id}", + operation_id="set_style_preset", + responses={ + 200: {"model": StylePresetRecordWithImage}, + }, +) +async def select_style_preset( + style_preset_id: str = Path(description="The style preset to select"), +) -> None: + """Selects a style preset, this will be used for saving recently used style presets""" + + return @style_presets_router.patch( From fc39086fb4b3c9752b92be979de2cd95fbedd74c Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:34:31 -0400 Subject: [PATCH 3/9] call stylePresetSelected --- .../store/middleware/listenerMiddleware/index.ts | 4 ++++ .../listeners/stylePresetSelected.ts | 15 +++++++++++++++ .../src/services/api/endpoints/stylePresets.ts | 14 +++++--------- 3 files changed, 24 insertions(+), 9 deletions(-) create mode 100644 invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts index a1ce52b407..3c1285221c 100644 --- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts +++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts @@ -53,6 +53,7 @@ import type { AppDispatch, RootState } from 'app/store/store'; import { addArchivedOrDeletedBoardListener } from './listeners/addArchivedOrDeletedBoardListener'; import { addEnqueueRequestedUpscale } from './listeners/enqueueRequestedUpscale'; +import { addStylePresetSelectedListener } from './listeners/stylePresetSelected'; export const listenerMiddleware = createListenerMiddleware(); @@ -123,6 +124,9 @@ addImageRemovedFromBoardFulfilledListener(startAppListening); addBoardIdSelectedListener(startAppListening); addArchivedOrDeletedBoardListener(startAppListening); +// Style Presets +addStylePresetSelectedListener(startAppListening); + // Node schemas addGetOpenAPISchemaListener(startAppListening); diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts new file mode 100644 index 0000000000..fd8c9aae52 --- /dev/null +++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts @@ -0,0 +1,15 @@ +import type { AppStartListening } from 'app/store/middleware/listenerMiddleware'; +import { activeStylePresetIdChanged } from 'features/stylePresets/store/stylePresetSlice'; +import { stylePresetsApi } from 'services/api/endpoints/stylePresets'; + +export const addStylePresetSelectedListener = (startAppListening: AppStartListening) => { + startAppListening({ + actionCreator: activeStylePresetIdChanged, + effect: async (action, { dispatch }) => { + if (!action.payload) { + return; + } + dispatch(stylePresetsApi.endpoints.selectStylePreset.initiate(action.payload)); + }, + }); +}; diff --git a/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts b/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts index 44023b59d1..80f1971be8 100644 --- a/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts +++ b/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts @@ -18,15 +18,11 @@ const buildStylePresetsUrl = (path: string = '') => buildV1Url(`style_presets/${ export const stylePresetsApi = api.injectEndpoints({ endpoints: (build) => ({ - getStylePreset: build.query< - paths['/api/v1/style_presets/i/{style_preset_id}']['get']['responses']['200']['content']['application/json'], - string - >({ - query: (style_preset_id) => buildStylePresetsUrl(`i/${style_preset_id}`), - providesTags: (result, error, style_preset_id) => [ - { type: 'StylePreset', id: style_preset_id }, - 'FetchOnReconnect', - ], + selectStylePreset: build.mutation({ + query: (style_preset_id) => ({ + url: buildStylePresetsUrl(`i/${style_preset_id}`), + method: 'POST', + }), }), deleteStylePreset: build.mutation({ query: (style_preset_id) => ({ From 404ad6a7fde65a71ad6759abf94d53dbc3d3a013 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:42:42 -0400 Subject: [PATCH 4/9] cleanup --- invokeai/app/api/routers/style_presets.py | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/invokeai/app/api/routers/style_presets.py b/invokeai/app/api/routers/style_presets.py index 600cd237db..0d7f1532d3 100644 --- a/invokeai/app/api/routers/style_presets.py +++ b/invokeai/app/api/routers/style_presets.py @@ -53,7 +53,7 @@ async def get_style_preset( return StylePresetRecordWithImage(image=image, **style_preset.model_dump()) except StylePresetNotFoundError: raise HTTPException(status_code=404, detail="Style preset not found") - + @style_presets_router.post( "/i/{style_preset_id}", operation_id="set_style_preset", From c0c139da88868b946d079f3ca481d59a8650b110 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:46:51 -0400 Subject: [PATCH 5/9] formatting ruff --- invokeai/app/api/routers/style_presets.py | 1 + 1 file changed, 1 insertion(+) diff --git a/invokeai/app/api/routers/style_presets.py b/invokeai/app/api/routers/style_presets.py index 0d7f1532d3..a63279eec6 100644 --- a/invokeai/app/api/routers/style_presets.py +++ b/invokeai/app/api/routers/style_presets.py @@ -54,6 +54,7 @@ async def get_style_preset( except StylePresetNotFoundError: raise HTTPException(status_code=404, detail="Style preset not found") + @style_presets_router.post( "/i/{style_preset_id}", operation_id="set_style_preset", From 92125e5fd24ad0dd619c4ec51c5dbf1a8c8b0d6c Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 16:13:38 -0400 Subject: [PATCH 6/9] bug fixes --- invokeai/app/api/routers/style_presets.py | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/invokeai/app/api/routers/style_presets.py b/invokeai/app/api/routers/style_presets.py index a63279eec6..a785402fd4 100644 --- a/invokeai/app/api/routers/style_presets.py +++ b/invokeai/app/api/routers/style_presets.py @@ -57,10 +57,7 @@ async def get_style_preset( @style_presets_router.post( "/i/{style_preset_id}", - operation_id="set_style_preset", - responses={ - 200: {"model": StylePresetRecordWithImage}, - }, + operation_id="select_style_preset", ) async def select_style_preset( style_preset_id: str = Path(description="The style preset to select"), From 026ac36b0631e2f665333de0f3112d0b11388ee9 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Wed, 28 Aug 2024 09:44:08 -0400 Subject: [PATCH 7/9] Revert "added selectedStylePreset to preload presets when app loads" This reverts commit e97fd85904e32ebe0a35cc66e75f010970e7dc63. --- invokeai/frontend/web/src/app/components/App.tsx | 16 +--------------- .../web/src/app/components/InvokeAIUI.tsx | 3 --- 2 files changed, 1 insertion(+), 18 deletions(-) diff --git a/invokeai/frontend/web/src/app/components/App.tsx b/invokeai/frontend/web/src/app/components/App.tsx index c7c623488e..41f3d97051 100644 --- a/invokeai/frontend/web/src/app/components/App.tsx +++ b/invokeai/frontend/web/src/app/components/App.tsx @@ -14,7 +14,6 @@ import DeleteImageModal from 'features/deleteImageModal/components/DeleteImageMo import { DynamicPromptsModal } from 'features/dynamicPrompts/components/DynamicPromptsPreviewModal'; import { useStarterModelsToast } from 'features/modelManagerV2/hooks/useStarterModelsToast'; import { StylePresetModal } from 'features/stylePresets/components/StylePresetForm/StylePresetModal'; -import { activeStylePresetIdChanged } from 'features/stylePresets/store/stylePresetSlice'; import { configChanged } from 'features/system/store/configSlice'; import { languageSelector } from 'features/system/store/systemSelectors'; import InvokeTabs from 'features/ui/components/InvokeTabs'; @@ -40,17 +39,10 @@ interface Props { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; - selectedStylePresetId?: string; destination?: InvokeTabName | undefined; } -const App = ({ - config = DEFAULT_CONFIG, - selectedImage, - selectedWorkflowId, - selectedStylePresetId, - destination, -}: Props) => { +const App = ({ config = DEFAULT_CONFIG, selectedImage, selectedWorkflowId, destination }: Props) => { const language = useAppSelector(languageSelector); const logger = useLogger('system'); const dispatch = useAppDispatch(); @@ -89,12 +81,6 @@ const App = ({ } }, [selectedWorkflowId, getAndLoadWorkflow]); - useEffect(() => { - if (selectedStylePresetId) { - dispatch(activeStylePresetIdChanged(selectedStylePresetId)); - } - }, [dispatch, selectedStylePresetId]); - useEffect(() => { if (destination) { dispatch(setActiveTab(destination)); diff --git a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx index a17620cae4..5804902408 100644 --- a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx +++ b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx @@ -45,7 +45,6 @@ interface Props extends PropsWithChildren { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; - selectedStylePresetId?: string; destination?: InvokeTabName; customStarUi?: CustomStarUi; socketOptions?: Partial; @@ -67,7 +66,6 @@ const InvokeAIUI = ({ queueId, selectedImage, selectedWorkflowId, - selectedStylePresetId, destination, customStarUi, socketOptions, @@ -229,7 +227,6 @@ const InvokeAIUI = ({ config={config} selectedImage={selectedImage} selectedWorkflowId={selectedWorkflowId} - selectedStylePresetId={selectedStylePresetId} destination={destination} /> From b2df9095702c045e88842b4380445cd0e0e5ee12 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Tue, 27 Aug 2024 15:33:24 -0400 Subject: [PATCH 8/9] added selectedStylePreset to preload presets when app loads --- invokeai/frontend/web/src/app/components/App.tsx | 16 +++++++++++++++- .../web/src/app/components/InvokeAIUI.tsx | 3 +++ 2 files changed, 18 insertions(+), 1 deletion(-) diff --git a/invokeai/frontend/web/src/app/components/App.tsx b/invokeai/frontend/web/src/app/components/App.tsx index 41f3d97051..c7c623488e 100644 --- a/invokeai/frontend/web/src/app/components/App.tsx +++ b/invokeai/frontend/web/src/app/components/App.tsx @@ -14,6 +14,7 @@ import DeleteImageModal from 'features/deleteImageModal/components/DeleteImageMo import { DynamicPromptsModal } from 'features/dynamicPrompts/components/DynamicPromptsPreviewModal'; import { useStarterModelsToast } from 'features/modelManagerV2/hooks/useStarterModelsToast'; import { StylePresetModal } from 'features/stylePresets/components/StylePresetForm/StylePresetModal'; +import { activeStylePresetIdChanged } from 'features/stylePresets/store/stylePresetSlice'; import { configChanged } from 'features/system/store/configSlice'; import { languageSelector } from 'features/system/store/systemSelectors'; import InvokeTabs from 'features/ui/components/InvokeTabs'; @@ -39,10 +40,17 @@ interface Props { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; + selectedStylePresetId?: string; destination?: InvokeTabName | undefined; } -const App = ({ config = DEFAULT_CONFIG, selectedImage, selectedWorkflowId, destination }: Props) => { +const App = ({ + config = DEFAULT_CONFIG, + selectedImage, + selectedWorkflowId, + selectedStylePresetId, + destination, +}: Props) => { const language = useAppSelector(languageSelector); const logger = useLogger('system'); const dispatch = useAppDispatch(); @@ -81,6 +89,12 @@ const App = ({ config = DEFAULT_CONFIG, selectedImage, selectedWorkflowId, desti } }, [selectedWorkflowId, getAndLoadWorkflow]); + useEffect(() => { + if (selectedStylePresetId) { + dispatch(activeStylePresetIdChanged(selectedStylePresetId)); + } + }, [dispatch, selectedStylePresetId]); + useEffect(() => { if (destination) { dispatch(setActiveTab(destination)); diff --git a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx index 5804902408..a17620cae4 100644 --- a/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx +++ b/invokeai/frontend/web/src/app/components/InvokeAIUI.tsx @@ -45,6 +45,7 @@ interface Props extends PropsWithChildren { action: 'sendToImg2Img' | 'sendToCanvas' | 'useAllParameters'; }; selectedWorkflowId?: string; + selectedStylePresetId?: string; destination?: InvokeTabName; customStarUi?: CustomStarUi; socketOptions?: Partial; @@ -66,6 +67,7 @@ const InvokeAIUI = ({ queueId, selectedImage, selectedWorkflowId, + selectedStylePresetId, destination, customStarUi, socketOptions, @@ -227,6 +229,7 @@ const InvokeAIUI = ({ config={config} selectedImage={selectedImage} selectedWorkflowId={selectedWorkflowId} + selectedStylePresetId={selectedStylePresetId} destination={destination} /> From 326de55d3edf1317d08be9e03c642be98400ec72 Mon Sep 17 00:00:00 2001 From: chainchompa Date: Wed, 28 Aug 2024 09:53:29 -0400 Subject: [PATCH 9/9] remove api changes and only preselect style preset --- invokeai/app/api/routers/style_presets.py | 12 ------------ .../store/middleware/listenerMiddleware/index.ts | 4 ---- .../listeners/stylePresetSelected.ts | 15 --------------- .../src/services/api/endpoints/stylePresets.ts | 14 +++++++++----- 4 files changed, 9 insertions(+), 36 deletions(-) delete mode 100644 invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts diff --git a/invokeai/app/api/routers/style_presets.py b/invokeai/app/api/routers/style_presets.py index a785402fd4..dadd89debb 100644 --- a/invokeai/app/api/routers/style_presets.py +++ b/invokeai/app/api/routers/style_presets.py @@ -55,18 +55,6 @@ async def get_style_preset( raise HTTPException(status_code=404, detail="Style preset not found") -@style_presets_router.post( - "/i/{style_preset_id}", - operation_id="select_style_preset", -) -async def select_style_preset( - style_preset_id: str = Path(description="The style preset to select"), -) -> None: - """Selects a style preset, this will be used for saving recently used style presets""" - - return - - @style_presets_router.patch( "/i/{style_preset_id}", operation_id="update_style_preset", diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts index 3c1285221c..a1ce52b407 100644 --- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts +++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/index.ts @@ -53,7 +53,6 @@ import type { AppDispatch, RootState } from 'app/store/store'; import { addArchivedOrDeletedBoardListener } from './listeners/addArchivedOrDeletedBoardListener'; import { addEnqueueRequestedUpscale } from './listeners/enqueueRequestedUpscale'; -import { addStylePresetSelectedListener } from './listeners/stylePresetSelected'; export const listenerMiddleware = createListenerMiddleware(); @@ -124,9 +123,6 @@ addImageRemovedFromBoardFulfilledListener(startAppListening); addBoardIdSelectedListener(startAppListening); addArchivedOrDeletedBoardListener(startAppListening); -// Style Presets -addStylePresetSelectedListener(startAppListening); - // Node schemas addGetOpenAPISchemaListener(startAppListening); diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts deleted file mode 100644 index fd8c9aae52..0000000000 --- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/stylePresetSelected.ts +++ /dev/null @@ -1,15 +0,0 @@ -import type { AppStartListening } from 'app/store/middleware/listenerMiddleware'; -import { activeStylePresetIdChanged } from 'features/stylePresets/store/stylePresetSlice'; -import { stylePresetsApi } from 'services/api/endpoints/stylePresets'; - -export const addStylePresetSelectedListener = (startAppListening: AppStartListening) => { - startAppListening({ - actionCreator: activeStylePresetIdChanged, - effect: async (action, { dispatch }) => { - if (!action.payload) { - return; - } - dispatch(stylePresetsApi.endpoints.selectStylePreset.initiate(action.payload)); - }, - }); -}; diff --git a/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts b/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts index 80f1971be8..44023b59d1 100644 --- a/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts +++ b/invokeai/frontend/web/src/services/api/endpoints/stylePresets.ts @@ -18,11 +18,15 @@ const buildStylePresetsUrl = (path: string = '') => buildV1Url(`style_presets/${ export const stylePresetsApi = api.injectEndpoints({ endpoints: (build) => ({ - selectStylePreset: build.mutation({ - query: (style_preset_id) => ({ - url: buildStylePresetsUrl(`i/${style_preset_id}`), - method: 'POST', - }), + getStylePreset: build.query< + paths['/api/v1/style_presets/i/{style_preset_id}']['get']['responses']['200']['content']['application/json'], + string + >({ + query: (style_preset_id) => buildStylePresetsUrl(`i/${style_preset_id}`), + providesTags: (result, error, style_preset_id) => [ + { type: 'StylePreset', id: style_preset_id }, + 'FetchOnReconnect', + ], }), deleteStylePreset: build.mutation({ query: (style_preset_id) => ({