Oops

src/app/_components/VoteUI.tsx

@@ -74,7 +74,7 @@ const VoteUI = () => {
   const [presenceData] = usePresence<PresenceItem>(
     `${env.NEXT_PUBLIC_APP_ENV}-${roomId}`,
     {
-      name: `${user?.firstName} ${user?.lastName}` || "",
+      name: (user?.fullName ?? user?.username) || "",
       image: user?.imageUrl || "",
       client_id: user?.id || "unknown",
       isAdmin: isAdmin(user?.publicMetadata),

src/app/dashboard/loading.tsx

@@ -0,0 +1,5 @@
+import LoadingIndicator from "@/app/_components/LoadingIndicator";
+
+export default function Loading() {
+  return <LoadingIndicator />;
+}

src/app/dashboard/page.tsx

@@ -16,7 +16,7 @@ export default async function Dashboard() {
   return (
     <div className="flex flex-col text-center items-center justify-center px-4 py-16 gap-4">
       <h1 className="flex flex-row flex-wrap text-center justify-center items-center gap-1 text-4xl font-bold mx-auto">
-        Hi, {user?.firstName}!{" "}
+        Hi, {user?.firstName ?? user?.username}!{" "}
         {isAdmin(user?.publicMetadata) && (
           <FaShieldAlt className="inline-block text-primary" />
         )}

src/app/room/[id]/loading.tsx

@@ -1,6 +1,5 @@
 import LoadingIndicator from "@/app/_components/LoadingIndicator";
 
 export default function Loading() {
-  // You can add any UI inside Loading, including a Skeleton.
   return <LoadingIndicator />;
 }