switched theme

components/loggedInHeader.tsx

@@ -0,0 +1,31 @@
+import {
+	getLoggedInUser,
+	getUserByUserId,
+	UserProfileDetails,
+} from "@/lib/profile";
+import { useEffect, useState } from "react";
+
+export function HomeLoggedInHeader() {
+	const [profileDetails, setProfileDetails] =
+		useState<UserProfileDetails | null>(null);
+
+	useEffect(() => {
+		(async () => {
+			const authed = await getLoggedInUser();
+			setProfileDetails(await getUserByUserId(authed.id.toString()));
+		})();
+	}, []);
+
+	if (!profileDetails) {
+		return (<></>)
+	}
+
+	return (
+		<div>
+			<span className="text-xl">Hello, {profileDetails.displayName}</span>
+			<span className="text-muted-foreground text-sm text-blue">{"@"}{profileDetails.name}</span>
+			<br/>
+			{profileDetails.id}
+		</div>
+	);
+}