import { api } from "@/trpc/server";
import type { User } from "next-auth";
import { notFound } from "next/navigation";
import React from "react";
import type { PublicUser } from "@/server/auth/config";
import { auth } from "@/server/auth";
import LobbyPage from "@/app/_components/lobby-page";

async function Page({
  params,
}: {
  params: Promise<{
    id: string;
  }>;
}) {
  const session = await auth();
  const { id } = await params;
  const lobby = await api.lobby.get({ id });
  if (!lobby) return notFound();

  const members: Array<{ leader: boolean } & PublicUser> = [
    { ...lobby.leader, leader: true },
    ...(lobby?.members?.map(({ user }) => ({ ...user, leader: false })) ?? []),
  ];

  return <LobbyPage lobby={lobby} initialMembers={members} session={session} />;
}

export default Page;