From 4ac447cf74d02b6d9261a636f2ae38d24dace3c6 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Sun, 2 Apr 2023 19:38:37 +1000
Subject: [PATCH] fix(ui): fix middleware types

---
 .../web/src/app/nodesSocketio/listeners.ts    |  7 +++--
 .../web/src/services/invokeMiddleware.ts      | 29 ++++++++++---------
 2 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/invokeai/frontend/web/src/app/nodesSocketio/listeners.ts b/invokeai/frontend/web/src/app/nodesSocketio/listeners.ts
index d9ef09a723..3cc56a82c3 100644
--- a/invokeai/frontend/web/src/app/nodesSocketio/listeners.ts
+++ b/invokeai/frontend/web/src/app/nodesSocketio/listeners.ts
@@ -1,4 +1,4 @@
-import { AnyAction, Dispatch, MiddlewareAPI } from '@reduxjs/toolkit';
+import { MiddlewareAPI } from '@reduxjs/toolkit';
 import dateFormat from 'dateformat';
 import i18n from 'i18n';
 import { v4 as uuidv4 } from 'uuid';
@@ -18,7 +18,7 @@ import {
   setIntermediateImage,
 } from 'features/gallery/store/gallerySlice';
 
-import type { RootState } from 'app/store';
+import type { AppDispatch, RootState } from 'app/store';
 import {
   GeneratorProgressEvent,
   InvocationCompleteEvent,
@@ -33,12 +33,13 @@ import {
   STATUS,
 } from 'services/apiSlice';
 import { emitUnsubscribe } from './actions';
+import { listSessions } from 'services/thunks/session';
 
 /**
  * Returns an object containing listener callbacks
  */
 const makeSocketIOListeners = (
-  store: MiddlewareAPI<Dispatch<AnyAction>, RootState>
+  store: MiddlewareAPI<AppDispatch, RootState>
 ) => {
   const { dispatch, getState } = store;
 
diff --git a/invokeai/frontend/web/src/services/invokeMiddleware.ts b/invokeai/frontend/web/src/services/invokeMiddleware.ts
index 29bf51bdf1..9c8544f75e 100644
--- a/invokeai/frontend/web/src/services/invokeMiddleware.ts
+++ b/invokeai/frontend/web/src/services/invokeMiddleware.ts
@@ -1,20 +1,21 @@
-import { Middleware } from '@reduxjs/toolkit';
+import { Middleware, MiddlewareAPI } from '@reduxjs/toolkit';
 import { emitSubscribe } from 'app/nodesSocketio/actions';
+import { AppDispatch, RootState } from 'app/store';
 import { setSessionId } from './apiSlice';
 import { invokeSession } from './thunks/session';
 
-export const invokeMiddleware: Middleware = (store) => (next) => (action) => {
-  const { dispatch } = store;
+export const invokeMiddleware: Middleware =
+  (store: MiddlewareAPI<AppDispatch, RootState>) => (next) => (action) => {
+    const { dispatch } = store;
 
-  if (action.type === 'api/createSession/fulfilled' && action?.payload?.id) {
-    const sessionId = action.payload.id;
-    console.log('createSession.fulfilled');
+    if (action.type === 'api/createSession/fulfilled' && action?.payload?.id) {
+      const sessionId = action.payload.id;
+      console.log('createSession.fulfilled');
 
-    dispatch(setSessionId(sessionId));
-    dispatch(emitSubscribe(sessionId));
-    // types are wrong but this works
-    dispatch(invokeSession({ sessionId }));
-  } else {
-    next(action);
-  }
-};
+      dispatch(setSessionId(sessionId));
+      dispatch(emitSubscribe(sessionId));
+      dispatch(invokeSession({ sessionId }));
+    } else {
+      next(action);
+    }
+  };