From 9ebab013c1cde149a89b6005830eb5328022a145 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 5 Jul 2023 18:21:46 +1000
Subject: [PATCH] fix(ui): deleting image selects first image

---
 .../listeners/imageDeleted.ts                 | 26 ++++++++++---------
 .../features/gallery/store/gallerySlice.ts    |  6 -----
 2 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageDeleted.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageDeleted.ts
index ca20170c5d..f083a716a4 100644
--- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageDeleted.ts
+++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageDeleted.ts
@@ -1,21 +1,21 @@
-import { startAppListening } from '..';
-import { imageDeleted } from 'services/api/thunks/image';
 import { log } from 'app/logging/useLogger';
-import { clamp } from 'lodash-es';
-import {
-  imageSelected,
-  imageRemoved,
-  selectImagesIds,
-} from 'features/gallery/store/gallerySlice';
 import { resetCanvas } from 'features/canvas/store/canvasSlice';
 import { controlNetReset } from 'features/controlNet/store/controlNetSlice';
-import { clearInitialImage } from 'features/parameters/store/generationSlice';
-import { nodeEditorReset } from 'features/nodes/store/nodesSlice';
-import { api } from 'services/api';
+import {
+  imageRemoved,
+  imageSelected,
+  selectFilteredImages,
+} from 'features/gallery/store/gallerySlice';
 import {
   imageDeletionConfirmed,
   isModalOpenChanged,
 } from 'features/imageDeletion/store/imageDeletionSlice';
+import { nodeEditorReset } from 'features/nodes/store/nodesSlice';
+import { clearInitialImage } from 'features/parameters/store/generationSlice';
+import { clamp } from 'lodash-es';
+import { api } from 'services/api';
+import { imageDeleted } from 'services/api/thunks/image';
+import { startAppListening } from '..';
 
 const moduleLog = log.child({ namespace: 'image' });
 
@@ -37,7 +37,9 @@ export const addRequestedImageDeletionListener = () => {
         state.gallery.selection[state.gallery.selection.length - 1];
 
       if (lastSelectedImage === image_name) {
-        const ids = selectImagesIds(state);
+        const filteredImages = selectFilteredImages(state);
+
+        const ids = filteredImages.map((i) => i.image_name);
 
         const deletedImageIndex = ids.findIndex(
           (result) => result.toString() === image_name
diff --git a/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts b/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts
index f4d2babf38..41a52e3452 100644
--- a/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts
+++ b/invokeai/frontend/web/src/features/gallery/store/gallerySlice.ts
@@ -7,7 +7,6 @@ import {
 import { RootState } from 'app/store/store';
 import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
 import { dateComparator } from 'common/util/dateComparator';
-import { imageDeletionConfirmed } from 'features/imageDeletion/store/imageDeletionSlice';
 import { keyBy, uniq } from 'lodash-es';
 import { boardsApi } from 'services/api/endpoints/boards';
 import {
@@ -174,11 +173,6 @@ export const gallerySlice = createSlice({
       state.limit = limit;
       state.total = total;
     });
-    builder.addCase(imageDeletionConfirmed, (state, action) => {
-      // Image deleted
-      const { image_name } = action.payload.imageDTO;
-      imagesAdapter.removeOne(state, image_name);
-    });
     builder.addCase(imageUrlsReceived.fulfilled, (state, action) => {
       const { image_name, image_url, thumbnail_url } = action.payload;