import type { Metadata } from "next";
import { headers } from "next/headers";
import { auth } from "@/lib/auth/server";
import { db, webhooks, users, eq } from "@epicure/db";
import { WebhooksManager } from "@/components/settings/webhooks-manager";
import { DeveloperLockedNotice } from "@/components/settings/developer-locked-notice";
import { getMessages } from "@/lib/i18n/server";

export const metadata: Metadata = {};

export default async function WebhooksPage() {
  const session = await auth.api.getSession({ headers: await headers() });
  if (!session) return null;
  const m = getMessages((session.user as { locale?: string }).locale);

  const dbUser = (await db.select({ isDeveloper: users.isDeveloper }).from(users).where(eq(users.id, session.user.id)).limit(1))[0];

  const rows = dbUser?.isDeveloper
    ? await db
        .select({
          id: webhooks.id,
          url: webhooks.url,
          events: webhooks.events,
          active: webhooks.active,
          createdAt: webhooks.createdAt,
        })
        .from(webhooks)
        .where(eq(webhooks.userId, session.user.id))
    : [];

  return (
    <div className="space-y-8">
      <section className="rounded-xl border p-6 space-y-4">
        <div>
          <h2 className="font-semibold text-lg">{m.settings.webhooksPage.title}</h2>
          <p className="text-sm text-muted-foreground mt-1">
            {m.settings.webhooksPage.description}
          </p>
        </div>
        {!dbUser?.isDeveloper && <DeveloperLockedNotice message={m.settings.developerLockedNotice} />}
        {dbUser?.isDeveloper && (
          <WebhooksManager
            initialWebhooks={rows.map((w) => ({
              id: w.id,
              url: w.url,
              events: w.events,
              active: w.active,
              createdAt: w.createdAt.toISOString(),
            }))}
          />
        )}
      </section>
    </div>
  );
}