From 30e0033ebe8955317cc962b93549a9c44031ea28 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Fri, 26 May 2023 16:23:18 +1000
Subject: [PATCH] fix(ui): fix results not added to gallery

---
 .../listeners/imageMetadataReceived.ts           | 16 ++++++----------
 .../listeners/imageUploaded.ts                   |  8 ++++----
 .../src/features/gallery/store/resultsSlice.ts   |  4 ++--
 .../src/features/gallery/store/uploadsSlice.ts   |  4 ++--
 4 files changed, 14 insertions(+), 18 deletions(-)

diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageMetadataReceived.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageMetadataReceived.ts
index 417b7c49cf..aa386a2f7f 100644
--- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageMetadataReceived.ts
+++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageMetadataReceived.ts
@@ -3,11 +3,11 @@ import { startAppListening } from '..';
 import { imageMetadataReceived } from 'services/thunks/image';
 import {
   ResultsImageDTO,
-  resultsAdapter,
+  resultUpserted,
 } from 'features/gallery/store/resultsSlice';
 import {
   UploadsImageDTO,
-  uploadsAdapter,
+  uploadUpserted,
 } from 'features/gallery/store/uploadsSlice';
 
 const moduleLog = log.child({ namespace: 'image' });
@@ -20,17 +20,13 @@ export const addImageMetadataReceivedFulfilledListener = () => {
       moduleLog.debug({ data: { image } }, 'Image metadata received');
 
       if (image.image_type === 'results') {
-        resultsAdapter.upsertOne(
-          getState().results,
-          action.payload as ResultsImageDTO
-        );
+        console.log('upsert results');
+        dispatch(resultUpserted(action.payload as ResultsImageDTO));
       }
 
       if (image.image_type === 'uploads') {
-        uploadsAdapter.upsertOne(
-          getState().uploads,
-          action.payload as UploadsImageDTO
-        );
+        console.log('upsert uploads');
+        dispatch(uploadUpserted(action.payload as UploadsImageDTO));
       }
     },
   });
diff --git a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageUploaded.ts b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageUploaded.ts
index c0ed294850..5b177eae91 100644
--- a/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageUploaded.ts
+++ b/invokeai/frontend/web/src/app/store/middleware/listenerMiddleware/listeners/imageUploaded.ts
@@ -1,11 +1,11 @@
 import { startAppListening } from '..';
-import { uploadAdded } from 'features/gallery/store/uploadsSlice';
+import { uploadUpserted } from 'features/gallery/store/uploadsSlice';
 import { imageSelected } from 'features/gallery/store/gallerySlice';
 import { imageUploaded } from 'services/thunks/image';
 import { addToast } from 'features/system/store/systemSlice';
 import { initialImageSelected } from 'features/parameters/store/actions';
 import { setInitialCanvasImage } from 'features/canvas/store/canvasSlice';
-import { resultAdded } from 'features/gallery/store/resultsSlice';
+import { resultUpserted } from 'features/gallery/store/resultsSlice';
 import { isResultsImageDTO, isUploadsImageDTO } from 'services/types/guards';
 import { log } from 'app/logging/useLogger';
 
@@ -25,7 +25,7 @@ export const addImageUploadedFulfilledListener = () => {
 
       // Handle uploads
       if (isUploadsImageDTO(image)) {
-        dispatch(uploadAdded(image));
+        dispatch(uploadUpserted(image));
 
         dispatch(addToast({ title: 'Image Uploaded', status: 'success' }));
 
@@ -45,7 +45,7 @@ export const addImageUploadedFulfilledListener = () => {
       // Handle results
       // TODO: Can this ever happen? I don't think so...
       if (isResultsImageDTO(image)) {
-        dispatch(resultAdded(image));
+        dispatch(resultUpserted(image));
       }
     },
   });
diff --git a/invokeai/frontend/web/src/features/gallery/store/resultsSlice.ts b/invokeai/frontend/web/src/features/gallery/store/resultsSlice.ts
index 18d0466033..e601af0443 100644
--- a/invokeai/frontend/web/src/features/gallery/store/resultsSlice.ts
+++ b/invokeai/frontend/web/src/features/gallery/store/resultsSlice.ts
@@ -37,7 +37,7 @@ const resultsSlice = createSlice({
   name: 'results',
   initialState: initialResultsState,
   reducers: {
-    resultAdded: resultsAdapter.upsertOne,
+    resultUpserted: resultsAdapter.upsertOne,
   },
   extraReducers: (builder) => {
     /**
@@ -74,6 +74,6 @@ export const {
   selectTotal: selectResultsTotal,
 } = resultsAdapter.getSelectors<RootState>((state) => state.results);
 
-export const { resultAdded } = resultsSlice.actions;
+export const { resultUpserted } = resultsSlice.actions;
 
 export default resultsSlice.reducer;
diff --git a/invokeai/frontend/web/src/features/gallery/store/uploadsSlice.ts b/invokeai/frontend/web/src/features/gallery/store/uploadsSlice.ts
index 1a03ed3391..599e1b3830 100644
--- a/invokeai/frontend/web/src/features/gallery/store/uploadsSlice.ts
+++ b/invokeai/frontend/web/src/features/gallery/store/uploadsSlice.ts
@@ -38,7 +38,7 @@ const uploadsSlice = createSlice({
   name: 'uploads',
   initialState: initialUploadsState,
   reducers: {
-    uploadAdded: uploadsAdapter.upsertOne,
+    uploadUpserted: uploadsAdapter.upsertOne,
   },
   extraReducers: (builder) => {
     /**
@@ -75,6 +75,6 @@ export const {
   selectTotal: selectUploadsTotal,
 } = uploadsAdapter.getSelectors<RootState>((state) => state.uploads);
 
-export const { uploadAdded } = uploadsSlice.actions;
+export const { uploadUpserted } = uploadsSlice.actions;
 
 export default uploadsSlice.reducer;