Added loading property when user's profile is loading

app/hooks/auth.tsx

@@ -1,62 +1,83 @@
-import { useEffect, useState, createContext, useContext, type PropsWithChildren } from "react";
-import { useSearchParams } from "react-router";
+import {
+    useEffect,
+    useState,
+    createContext,
+    useContext,
+    type PropsWithChildren,
+} from "react";
+import { useLocation, useSearchParams } from "react-router";
 
 type User = {
-    id: string,
-    steamid: string,
-    name: string,
-    avatar: string
-}
+    id: string;
+    steamid: string;
+    name: string;
+    avatar: string;
+};
 
 type AuthContextType = {
-    user: User | null,
-    login: () => void,
-    logout: () => Promise<void>
-}
+    user: User | null;
+    loading: boolean;
+    login: () => void;
+    logout: () => Promise<void>;
+};
 
 const AuthContext = createContext<AuthContextType>({
     user: null,
+    loading: false,
     login: () => {},
-    logout: async () => {}
+    logout: async () => {},
 });
 
-export function AuthProvider({children}: PropsWithChildren) {
+export function AuthProvider({ children }: PropsWithChildren) {
     const [user, setUser] = useState(null);
+    const [loading, setLoading] = useState(false);
     const [searchParams, setSeachParams] = useSearchParams();
+    const location = useLocation();
 
     useEffect(() => {
         const load = async () => {
-
             if (searchParams.get("openid.ns") !== null) {
-            let response = await fetch("http://localhost:8080/login?" + searchParams.toString(), {credentials: "include"}).then(r => r.text());
-            setSeachParams({}, {replace: true});
+                setLoading(true);
+                let query = searchParams.toString();
+                setSeachParams({}, { replace: true });
+                let response = await fetch(
+                    "http://localhost:8080/login?" + query,
+                    { credentials: "include" },
+                ).then((r) => r.text());
                 if (response === "nok") {
                     // TODO: signal error to user
                 }
             }
 
-        let data = await fetch("http://localhost:8080/me", {credentials: "include"})
-            .then(r => r.json())
+            let data = await fetch("http://localhost:8080/me", {
+                credentials: "include",
+            }).then((r) => r.json());
 
             console.log(data);
             setUser(data);
-        }
+            setLoading(false);
+        };
 
         load();
     }, []);
 
     const login = () => {
-        location.replace("https://steamcommunity.com/openid/login?openid.claimed_id=http://specs.openid.net/auth/2.0/identifier_select&openid.identity=http://specs.openid.net/auth/2.0/identifier_select&openid.mode=checkid_setup&openid.ns=http://specs.openid.net/auth/2.0&openid.realm=http://localhost:5173&openid.return_to=http://localhost:5173");
+        window.location.replace(
+            "https://steamcommunity.com/openid/login?openid.claimed_id=http://specs.openid.net/auth/2.0/identifier_select&openid.identity=http://specs.openid.net/auth/2.0/identifier_select&openid.mode=checkid_setup&openid.ns=http://specs.openid.net/auth/2.0&openid.realm=http://localhost:5173&openid.return_to=http://localhost:5173" +
+                location.pathname,
+        );
     };
 
     const logout = async () => {
-        await fetch("http://localhost:8080/logout", {credentials: "include"})
+        await fetch("http://localhost:8080/logout", { credentials: "include" });
         setUser(null);
     };
 
-    return <AuthContext.Provider value={{user, login, logout}}>
+    return (
+        <AuthContext.Provider value={{ user, loading, login, logout }}>
             {children}
         </AuthContext.Provider>
+    );
 }
 
 export function useAuth() {