import { Suspense } from "react";
import { notFound } from "next/navigation";
import { api } from "@/lib/api";
import SiteShell from "@/components/SiteShell";
import MemberProfileClient from "@/components/MemberProfileClient";

export default async function MemberPage({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params;
  const profile = await api.getMemberProfile(id).catch(() => null);
  if (!profile) notFound();
  return (
    <SiteShell showFooter>
      <Suspense fallback={<div className="container dest-empty">…</div>}>
        <MemberProfileClient profile={profile} />
      </Suspense>
    </SiteShell>
  );
}