ISSUE-182 - handle 401s & 403s

src/api/axios.ts

@@ -1,3 +1,4 @@
+import { signOutHandler } from '@/utils';
 import axios from 'axios';
 
 const baseURL = import.meta.env.VITE_PARSEABLE_URL ?? '/';
@@ -13,4 +14,17 @@ instance.interceptors.request.use(
 	},
 );
 
+instance.interceptors.response.use(
+	(response) => {
+	  return response;
+	},
+	(error) => {
+		const status = error.status || (error.response ? error.response.status : 0);
+		if (status === 403 || status === 401) {
+			signOutHandler();
+		}
+		return Promise.reject(error);
+	}
+  );
+
 export const Axios = () => instance;

src/components/Navbar/index.tsx

@@ -30,7 +30,7 @@ import Cookies from 'js-cookie';
 import { NAVBAR_WIDTH } from '@/constants/theme';
 import { useUser } from '@/hooks/useUser';
 import { useLogStream } from '@/hooks/useLogStream';
-const baseURL = import.meta.env.VITE_PARSEABLE_URL ?? '/';
+import { signOutHandler } from '@/utils';
 
 const isSecureConnection = window.location.protocol === 'https:';
 const links = [
@@ -80,13 +80,6 @@ const Navbar: FC<NavbarProps> = (props) => {
 		};
 	}, [subNavbarTogle.get()]);
 
-	const onSignOut = () => {
-		Cookies.remove('session');
-		Cookies.remove('username');
-
-		window.location.href = `${baseURL}api/v1/o/logout?redirect=${window.location.origin}/login`;
-	};
-
 	useEffect(() => {
 		if (location.pathname.split('/')[2]) {
 			setCurrentPage(`/${location.pathname.split('/')[2]}`);
@@ -279,7 +272,7 @@ const Navbar: FC<NavbarProps> = (props) => {
 					icon={<IconLogout size="1.3rem" stroke={1.3} />}
 					className={actionBtn}
 					component="a"
-					onClick={onSignOut}
+					onClick={signOutHandler}
 				/>
 			</MantineNavbar.Section>
 			<Modal

src/utils/index.ts

@@ -1,6 +1,9 @@
 import dayjs from 'dayjs';
 import { useMemo } from 'react';
 import { useLocation } from 'react-router-dom';
+import Cookies from 'js-cookie';
+
+export const baseURL = import.meta.env.VITE_PARSEABLE_URL ?? '/';
 
 export const wait = (sec = 1) => new Promise<void>((res) => setTimeout(res, sec * 1000));
 
@@ -57,3 +60,9 @@ export const generateQueryParam = (obj: object) => {
 	const endcodedBase64 = base64.replaceAll('+', '.').replaceAll('/', '_').replaceAll('=', '-');
 	return `?q=${endcodedBase64}`;
 };
+
+export const signOutHandler = () => {
+	Cookies.remove('session');
+	Cookies.remove('username');
+	window.location.href = `${baseURL}api/v1/o/logout?redirect=${window.location.origin}/login`;
+};