From 662f1321f6d3d3cb48801e3b1ca4fe81e4085008 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Sun, 2 Apr 2023 19:48:29 +1000
Subject: [PATCH] feat(ui): add rtk action type guard

---
 .../frontend/web/src/services/invokeMiddleware.ts   | 13 ++++++++++---
 1 file changed, 10 insertions(+), 3 deletions(-)

diff --git a/invokeai/frontend/web/src/services/invokeMiddleware.ts b/invokeai/frontend/web/src/services/invokeMiddleware.ts
index 9c8544f75e..5579015f79 100644
--- a/invokeai/frontend/web/src/services/invokeMiddleware.ts
+++ b/invokeai/frontend/web/src/services/invokeMiddleware.ts
@@ -1,14 +1,21 @@
-import { Middleware, MiddlewareAPI } from '@reduxjs/toolkit';
+import { isFulfilled, 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';
+import { createSession, invokeSession } from './thunks/session';
+
+/**
+ * `redux-toolkit` provides nice matching utilities, which can be used as type guards
+ * See: https://redux-toolkit.js.org/api/matching-utilities
+ */
+
+const isFulfilledCreateSession = isFulfilled(createSession);
 
 export const invokeMiddleware: Middleware =
   (store: MiddlewareAPI<AppDispatch, RootState>) => (next) => (action) => {
     const { dispatch } = store;
 
-    if (action.type === 'api/createSession/fulfilled' && action?.payload?.id) {
+    if (isFulfilledCreateSession(action)) {
       const sessionId = action.payload.id;
       console.log('createSession.fulfilled');