logic for handling errors related to authentication

src/contexts/UserAuthenticationContext.tsx

-import authenticateUser from "@/utils/requests/authenticateUser";
+import authenticateUser, { parseAuthicationErrors } from "@/utils/requests/authenticateUser";
 import type { IuserInformations } from "@/utils/requests/types";
 import getUserInformations from "@/utils/requests/userInformations";
+import ErrorModal from "@components/modals/ErrorModal";
 import { LOG } from "@logger";
 import AsyncStorage from "@react-native-async-storage/async-storage";
 // import { type NavigationProp, useNavigation } from "@react-navigation/native";
 import { useMutation } from "@tanstack/react-query";
-import type { AxiosError } from "axios";
+import * as SplashScreen from "expo-splash-screen";
 import { createContext, useCallback, useContext, useEffect, useState } from "react";
+import { useModalsManagerContext } from "./ModalsManagerContext";
 import type { IauthenticationData } from "./Types";
 
 const log = LOG.extend("UserAuthenticationContext");
 
+SplashScreen.preventAutoHideAsync();
+
 export interface UserAuthenticationContextProps {
 	isAuthenticated: boolean;
 	setIsAuthenticated: React.Dispatch<React.SetStateAction<boolean>>;
@@ -86,6 +90,7 @@ export const UserAuthenticationContextProvider = ({ children }: { children: Reac
 	});
 
 	// Hoooks
+	const { showModal } = useModalsManagerContext();
 
 	// const navigation = useNavigation<NavigationProp<ImainStackNavigator>>();
 
@@ -99,25 +104,16 @@ export const UserAuthenticationContextProvider = ({ children }: { children: Reac
 		},
 		onSuccess: (data) => {
 			setAuthenticationData(data);
-			// navigation.popToTop();
-			// navigation.replace("bottomTabs");
-			// navigation.navigate("bottomTabs");
+
 			log.info("Receive data from authenticateUser, running getUserInformations...");
 			userInformationsMutation.mutate(data.access);
-			// console.log("user informations", userInformations);
 		},
-		// biome-ignore lint/suspicious/noExplicitAny: <Axios error>
-		onError: (error: AxiosError<any>) => {
-			log.error("authenticationMutation", error);
-			if (error.response) {
-				log.error("error :: ", error.response.data);
-				if (error.response.status === 400) {
-					return setError("Bad request");
-				}
-				const message: string = error.response.data.detail;
-				return setError(message);
-			}
-			setError("Unknown error");
+		onError: (error: unknown) => {
+			const errorString = parseAuthicationErrors(error);
+			showModal(<ErrorModal message={errorString} />);
+		},
+		onSettled: () => {
+			setIsAuthenticating(false);
 		},
 	});
 
@@ -239,13 +235,14 @@ export const UserAuthenticationContextProvider = ({ children }: { children: Reac
 					setAuthenticationData(authenticationData);
 					setUserInformations(userInformations);
 					setIsAuthenticated(true);
-					// navigation.navigate("appBottomTabsNavigator");
 				}
 			} catch (error) {
 				log.error(
 					"UserAuthenticationContext | App Startup | error during retrieval of stored data |",
 					JSON.stringify(error, null, 2),
 				);
+			} finally {
+				setTimeout(async () => await SplashScreen.hideAsync(), 500);
 			}
 		})();
 	}, []);

src/utils/requests/authenticateUser.ts

 import type { IauthenticationData } from "@/contexts/Types";
 import { LOG } from "@logger";
+import { AxiosError } from "axios";
 import axiosRequest from "../axiosRequest";
 
 const log = LOG.extend("authenticateUser");
@@ -19,3 +20,18 @@ const authenticateUser = async ({ username, password }: { username: string; pass
 };
 
 export default authenticateUser;
+
+export const parseAuthicationErrors = (error: unknown): string => {
+	if (error instanceof AxiosError && error.response) {
+		switch (error.response.status) {
+			case 401:
+				return "Wrong username or password";
+			default:
+				return "Unknown Error. Please try again.";
+		}
+	}
+	if (error instanceof AxiosError && error.request) {
+		return "Network error";
+	}
+	return "Unknown error";
+};