brief-07-front/src/components/account-dialog.tsx
Mathis 4c061dc19c
feat(account-dialog): handle case when userContext not present
This commit updates the account-dialog component to properly handle when there's no userContext. Previously, a default user data was set when no userContext was found, this has been replaced with a simple message saying 'No account'. Also, checks for an authentication token in localStorage have been included. These changes aim towards better handling of edge cases and unauthenticated scenarios.
2024-06-17 09:47:57 +02:00

54 lines
1.2 KiB
TypeScript

"use client";
import { AccountInfo } from "@/components/account-info";
import { UserDataContext } from "@/components/providers/userdata-provider";
import { Skeleton } from "@/components/ui/skeleton";
import type { IUserData } from "@/interfaces/userdata.interface";
import {
type Dispatch,
type SetStateAction,
useContext,
useEffect,
useState,
} from "react";
const localStorage = typeof window !== "undefined" ? window.localStorage : null;
export function AccountDialog() {
const userContext = useContext(UserDataContext);
const token = localStorage?.getItem("sub") || "";
const haveToken = token.length >= 16 || false;
console.log(haveToken);
const [isLoaded, setIsLoaded] = useState<boolean>(false);
if (!userContext) {
return (
<div>
<p>No account</p>
</div>
);
}
useEffect(() => {
if (userContext?.userData) {
setIsLoaded(true);
}
}, [userContext?.userData]);
if (!isLoaded) {
return <Skeleton className="w-14 h-10 rounded" />;
}
return (
<div>
<AccountInfo
userData={userContext?.userData as IUserData}
setUserData={
userContext?.setUserData as Dispatch<SetStateAction<IUserData | undefined>>
}
isDisconnected={!haveToken}
/>
</div>
);
}