fix: added bucket error handling for 401 status (issue #425) (#487)

src/pages/index.tsx

@@ -60,6 +60,10 @@ export default function Home({ initialState }: Props) {
     SettingsSelectors.selectEnabledFeatures,
   );
 
+  const shouldLogin =
+    !authDisabled &&
+    (session.status !== 'authenticated' || !isClientSessionValid(session));
+
   // EFFECTS  --------------------------------------------
   useEffect(() => {
     if (!isIframe && !authDisabled && !isClientSessionValid(session)) {
@@ -80,8 +84,8 @@ export default function Home({ initialState }: Props) {
     handleSetProperVHPoints();
     window.addEventListener('resize', handleSetProperVHPoints);
 
-    dispatch(SettingsActions.initApp());
-  }, [dispatch, initialState]);
+    dispatch(SettingsActions.initApp({ shouldLogin }));
+  }, [dispatch, initialState, shouldLogin]);
 
   const handleIframeAuth = async () => {
     const timeout = 30 * 1000;
@@ -115,10 +119,7 @@ export default function Home({ initialState }: Props) {
     ]);
   };
 
-  const shouldIframeLogin =
-    isIframe &&
-    !authDisabled &&
-    (session.status !== 'authenticated' || !isClientSessionValid(session));
+  const shouldIframeLogin = isIframe && shouldLogin;
 
   return (
     <>

src/store/conversations/conversations.epics.ts

@@ -298,7 +298,6 @@ const initConversationsEpic: AppEpic = (action$) =>
           }),
         ),
       );
-
       if (!conversations.length || !selectedConversationsIds.length) {
         actions.push(
           of(

src/store/files/files.epics.ts

@@ -45,13 +45,18 @@ const getBucketEpic: AppEpic = (action$) =>
         map(({ bucket }) => {
           return FilesActions.setBucket({ bucket });
         }),
-        catchError(() => {
-          return of(
-            UIActions.showToast({
-              message: errorsMessages.errorGettingUserFileBucket,
-              type: 'error',
-            }),
-          );
+        catchError((error) => {
+          if (error.status === 401) {
+            window.location.assign('api/auth/signin');
+            return EMPTY;
+          } else {
+            return of(
+              UIActions.showToast({
+                message: errorsMessages.errorGettingUserFileBucket,
+                type: 'error',
+              }),
+            );
+          }
         }),
       );
     }),

src/store/settings/settings.epic.ts

@@ -1,4 +1,4 @@
-import { concat, filter, of, switchMap, tap } from 'rxjs';
+import { EMPTY, concat, delay, filter, of, switchMap, tap } from 'rxjs';
 
 import { combineEpics } from 'redux-observable';
 
@@ -16,19 +16,24 @@ import { SettingsActions, SettingsSelectors } from './settings.reducers';
 
 const initEpic: AppEpic = (action$, state$) =>
   action$.pipe(
-    filter((action) => SettingsActions.initApp.match(action)),
+    filter(SettingsActions.initApp.match),
     tap(() => {
       const storageType = SettingsSelectors.selectStorageType(state$.value);
       DataService.init(storageType);
     }),
-    switchMap(() =>
+    delay(100),
+    switchMap(({ payload }) =>
       concat(
-        of(ModelsActions.init()),
-        of(AddonsActions.init()),
         of(ConversationsActions.init()),
         of(PromptsActions.init()),
         of(UIActions.init()),
-        of(FilesActions.init()),
+        payload.shouldLogin
+          ? EMPTY
+          : concat(
+              of(ModelsActions.init()),
+              of(AddonsActions.init()),
+              of(FilesActions.init()),
+            ),
       ),
     ),
   );

src/store/settings/settings.reducers.ts

@@ -41,7 +41,7 @@ export const settingsSlice = createSlice({
   name: 'settings',
   initialState,
   reducers: {
-    initApp: (state) => state,
+    initApp: (state, _action: PayloadAction<{ shouldLogin: boolean }>) => state,
     setAppName: (
       state,
       { payload }: PayloadAction<SettingsState['appName']>,