From 29462e62d22581d50dd172d8b283b64eb131d2cf Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Thu, 26 Jun 2025 18:15:34 +1000
Subject: [PATCH] fix(ui): handle selecting images/boards on invocation
 complete

---
 .../listeners/boardIdSelected.ts               | 18 ++----------------
 invokeai/frontend/web/src/app/store/store.ts   | 13 +------------
 .../ImageViewer/CurrentImagePreview.tsx        |  8 +++++---
 3 files changed, 8 insertions(+), 31 deletions(-)

diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/boardIdSelected.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/boardIdSelected.ts
index ec6e4dd162..ed1c0207ac 100644
--- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/boardIdSelected.ts
+++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/boardIdSelected.ts
@@ -1,16 +1,12 @@
 import { isAnyOf } from '@reduxjs/toolkit';
 import type { AppStartListening } from 'app/store/middleware/listenerMiddleware';
-import {
-  selectLastSelectedImage,
-  selectListImageNamesQueryArgs,
-  selectSelectedBoardId,
-} from 'features/gallery/store/gallerySelectors';
+import { selectListImageNamesQueryArgs, selectSelectedBoardId } from 'features/gallery/store/gallerySelectors';
 import { boardIdSelected, galleryViewChanged, imageSelected } from 'features/gallery/store/gallerySlice';
 import { imagesApi } from 'services/api/endpoints/images';
 
 export const addBoardIdSelectedListener = (startAppListening: AppStartListening) => {
   startAppListening({
-    matcher: isAnyOf(boardIdSelected, galleryViewChanged, imagesApi.endpoints.getImageNames.matchFulfilled),
+    matcher: isAnyOf(boardIdSelected, galleryViewChanged),
     effect: async (action, { getState, dispatch, condition, cancelActiveListeners }) => {
       // Cancel any in-progress instances of this listener, we don't want to select an image from a previous board
       cancelActiveListeners();
@@ -23,16 +19,6 @@ export const addBoardIdSelectedListener = (startAppListening: AppStartListening)
       const state = getState();
 
       const board_id = selectSelectedBoardId(state);
-      const lastSelectedImage = selectLastSelectedImage(state);
-
-      if (
-        imagesApi.endpoints.getImageNames.matchFulfilled(action) &&
-        lastSelectedImage &&
-        action.meta.arg.originalArgs.board_id === board_id
-      ) {
-        // We just loaded image names for the current board, and we have a last selected image
-        return;
-      }
 
       const queryArgs = { ...selectListImageNamesQueryArgs(state), board_id };
 
diff --git a/invokeai/frontend/web/src/app/store/store.ts b/invokeai/frontend/web/src/app/store/store.ts
index c721325087..9d3ffff7e8 100644
--- a/invokeai/frontend/web/src/app/store/store.ts
+++ b/invokeai/frontend/web/src/app/store/store.ts
@@ -39,7 +39,6 @@ import { authToastMiddleware } from 'services/api/authToastMiddleware';
 import type { JsonObject } from 'type-fest';
 
 import { STORAGE_PREFIX } from './constants';
-import { getDebugLoggerMiddleware } from './middleware/debugLoggerMiddleware';
 import { actionSanitizer } from './middleware/devtools/actionSanitizer';
 import { actionsDenylist } from './middleware/devtools/actionsDenylist';
 import { stateSanitizer } from './middleware/devtools/stateSanitizer';
@@ -177,17 +176,7 @@ export const createStore = (uniqueStoreKey?: string, persist = true) =>
         .concat(api.middleware)
         .concat(dynamicMiddlewares)
         .concat(authToastMiddleware)
-        .concat(
-          getDebugLoggerMiddleware({
-            filter: (action) => {
-              try {
-                return (action as UnknownAction).type.startsWith('api');
-              } catch {
-                return false;
-              }
-            },
-          })
-        )
+        // .concat(getDebugLoggerMiddleware())
         .prepend(listenerMiddleware.middleware),
     enhancers: (getDefaultEnhancers) => {
       const _enhancers = getDefaultEnhancers().concat(autoBatchEnhancer());
diff --git a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImagePreview.tsx b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImagePreview.tsx
index a779561e7d..d242ad99f6 100644
--- a/invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImagePreview.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/ImageViewer/CurrentImagePreview.tsx
@@ -91,7 +91,7 @@ export const CurrentImagePreview = memo(({ imageDTO }: { imageDTO: ImageDTO | nu
     $progressImage.set(null);
   }, [$progressEvent, $progressImage]);
 
-  const withProgress = shouldShowProgressInViewer && progressEvent && progressImage;
+  const withProgress = shouldShowProgressInViewer && progressImage !== null;
 
   return (
     <Flex
@@ -110,9 +110,11 @@ export const CurrentImagePreview = memo(({ imageDTO }: { imageDTO: ImageDTO | nu
       )}
       {!imageDTO && <NoContentForViewer />}
       {withProgress && (
-        <Flex w="full" h="full" position="absolute" alignItems="center" justifyContent="center" bg="base.900">
+        <Flex w="full" h="full" position="absolute" alignItems="center" justifyContent="center">
           <ProgressImage progressImage={progressImage} />
-          <ProgressIndicator progressEvent={progressEvent} position="absolute" top={6} right={6} size={8} />
+          {progressEvent && (
+            <ProgressIndicator progressEvent={progressEvent} position="absolute" top={6} right={6} size={8} />
+          )}
         </Flex>
       )}
       <Flex flexDir="column" gap={2} position="absolute" top={0} insetInlineStart={0} alignItems="flex-start">