import Container from "@/components/ui/Container";
import DynamicForm from "@/components/forms/DynamicForm";
import { getFormSchema, getSiteSettings } from "@/lib/api";

export async function generateMetadata({ params }: { params: Promise<{ formKey: string }> }) {
  const { formKey } = await params;
  const schema = await getFormSchema(formKey);
  return { title: schema?.name || "Form" };
}

export default async function GenericFormPage({ params }: { params: Promise<{ formKey: string }> }) {
  const { formKey } = await params;
  const [schema, site] = await Promise.all([getFormSchema(formKey), getSiteSettings()]);
  const contactEmail = site.email || "contact@nspfoundation.org";

  return (
    <section className="py-20 border-b border-neutral-400">
      <Container className="max-w-xl">
        <h1 className="font-heading font-extrabold text-3xl text-ink text-center">{schema?.name || "Form"}</h1>
        <div className="mt-8">
          {schema ? (
            <DynamicForm formKey={schema.formKey} fields={schema.fields} successMessage={schema.successMessage} submitLabel={schema.name} />
          ) : (
            <p className="text-sm text-ink-soft text-center">
              This form isn&apos;t available right now. Please email {contactEmail} directly.
            </p>
          )}
        </div>
      </Container>
    </section>
  );
}