failed login should result in Invalid credentials error message

src/redux/user/user.thunks.test.ts

@@ -5,12 +5,15 @@ import {
   ToolkitStoreWithSingleSlice,
   createStoreInstanceUsingSliceReducer,
 } from '@/utils/createStoreInstanceUsingSliceReducer';
+import { showToast } from '@/utils/showToast';
 import { apiPath } from '../apiPath';
 import { closeModal } from '../modal/modal.slice';
 import userReducer from './user.slice';
 import { UserState } from './user.types';
 import { login } from './user.thunks';
 
+jest.mock('../../utils/showToast');
+
 const mockedAxiosClient = mockNetworkResponse();
 const CREDENTIALS = {
   login: 'test',
@@ -50,4 +53,15 @@ describe('login thunk', () => {
 
     await store.dispatch(login(CREDENTIALS));
   });
+
+  it('dispatch showToast on failed login with invalid data', async () => {
+    mockedAxiosClient.onPost(apiPath.postLogin()).reply(HttpStatusCode.Unauthorized, loginFixture);
+
+    await store.dispatch(login(CREDENTIALS));
+
+    expect(showToast).toHaveBeenCalledWith({
+      message: 'Invalid credentials.',
+      type: 'error',
+    });
+  });
 });

src/redux/user/user.thunks.ts

@@ -6,6 +6,8 @@ import { sessionSchemaValid } from '@/models/sessionValidSchema';
 import { Login, SessionValid, User, UserPrivilege } from '@/types/models';
 import { USER_ROLE } from '@/constants/user';
 import { getError } from '@/utils/error-report/getError';
+import axios, { HttpStatusCode } from 'axios';
+import { showToast } from '@/utils/showToast';
 import { apiPath } from '../apiPath';
 import { closeModal, openLoggedInMenuModal } from '../modal/modal.slice';
 import { hasPrivilege } from './user.utils';
@@ -60,6 +62,15 @@ export const login = createAsyncThunk(
 
       return undefined;
     } catch (error) {
+      if (axios.isAxiosError(error)) {
+        if (error?.response?.status === HttpStatusCode.Unauthorized) {
+          showToast({
+            type: 'error',
+            message: 'Invalid credentials.',
+          });
+          return undefined;
+        }
+      }
       return Promise.reject(getError({ error, prefix: 'Login' }));
     }
   },