Mathis
a75a87f683
Initial setup of the Neptune frontend project, including Dockerfile, environment files, TypeScript configuration, and essential components. Added basic page structures for dashboard and wallet, and configured Tailwind CSS and postcss.
54 lines
1.2 KiB
TypeScript
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>
|
|
);
|
|
}
|