import type { Metadata } from "next";
import { createCaller } from "~/server/trpc.js";
import { ResourceDetail } from "~/components/resources/ResourceDetail.js";

export async function generateMetadata(
  { params }: { params: Promise<{ id: string }> },
): Promise<Metadata> {
  const { id } = await params;
  try {
    const trpc = await createCaller();
    const resource = await trpc.resource.getById({ id });
    return { title: `${resource.displayName} — Resources | CapaKraken` };
  } catch {
    return { title: "Resource — CapaKraken" };
  }
}

export default async function ResourceDetailPage({
  params,
}: {
  params: Promise<{ id: string }>;
}) {
  const { id } = await params;
  return <ResourceDetail resourceId={id} />;
}
