30 lines
737 B
TypeScript
30 lines
737 B
TypeScript
import { useQuery } from "@tanstack/react-query";
|
|
import { ProfileCard, ProfileEditor } from "@modules/profile";
|
|
import { getProfile } from "@modules/profile/api/profileApi";
|
|
|
|
export default function ProfilePage(): JSX.Element {
|
|
const { data, isLoading } = useQuery({
|
|
queryKey: ["profile-me"],
|
|
queryFn: getProfile
|
|
});
|
|
|
|
if (isLoading || !data) {
|
|
return (
|
|
<main>
|
|
<p>Loading profile...</p>
|
|
</main>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<main style={{ display: "grid", gap: "2rem", padding: "1.5rem" }}>
|
|
<ProfileCard
|
|
email={data.user.email}
|
|
displayName={data.profile.display_name}
|
|
avatarUrl={data.profile.avatar_url}
|
|
/>
|
|
<ProfileEditor profile={data} />
|
|
</main>
|
|
);
|
|
}
|