import { getDictionary, isLocale, type Locale } from "@/lib/i18n";
import { notFound } from "next/navigation";

export default function ContactPage({ params }: { params: { locale: string } }) {
  if (!isLocale(params.locale)) {
    notFound();
  }

  const locale = params.locale as Locale;
  const dictionary = getDictionary(locale);

  return (
    <section className="panel">
      <p className="eyebrow">{dictionary.contact.kicker}</p>
      <h1>{dictionary.contact.title}</h1>
      <p className="lead">{dictionary.contact.description}</p>

      <div className="split-grid">
        {dictionary.contact.channels.map((channel) => (
          <article className="card" key={channel.name}>
            <h2>{channel.name}</h2>
            <p>{channel.status}</p>
            <button type="button" className="pending-btn" disabled aria-disabled="true">
              {dictionary.contact.pendingCta}
            </button>
          </article>
        ))}
      </div>
    </section>
  );
}