import { ApiKeyGate } from "@/components/ApiKeyGate";
import { AppHeader } from "@/components/AppHeader";
import { ShareChooser } from "@/components/ShareChooser";
import { Sidebar, SidebarOffset } from "@/components/Sidebar";

export const metadata = {
  title: "Add to Freezmo",
};

export default async function SharePage({
  searchParams,
}: {
  searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
}) {
  const { id, text, url, error } = await searchParams;
  return (
    <ApiKeyGate>
      <div className="flex min-h-dvh">
        <Sidebar />
        <SidebarOffset />
        <main className="flex min-h-dvh min-w-0 flex-1 flex-col">
          <AppHeader />
          <div className="mx-auto w-full max-w-3xl flex-1 px-4 pb-tabbar lg:px-10 lg:pb-16 lg:pt-10">
            <ShareChooser
              id={typeof id === "string" ? id : undefined}
              text={typeof text === "string" ? text : undefined}
              url={typeof url === "string" ? url : undefined}
              error={typeof error === "string" ? error : undefined}
            />
          </div>
        </main>
      </div>
    </ApiKeyGate>
  );
}