import { eq } from "drizzle-orm";
import { appSettings } from "@minecraft-account-manager/database";
import { db } from "@/lib/database";
import { saveDiscordSettings } from "./actions";

export default async function AdminPage({
  searchParams,
}: {
  searchParams: Promise<{ saved?: string; error?: string }>;
}) {
  const query = await searchParams;
  const [settings] = await db.select().from(appSettings).where(eq(appSettings.id, "default")).limit(1);
  const message = settings?.registrationMessage ?? "Please register your Minecraft account before joining.";

  return (
    <main className="mx-auto max-w-6xl px-6 py-14">
      <div className="grid gap-10 lg:grid-cols-[0.7fr_1.3fr]">
        <section>
          <p className="font-mono text-xs font-bold uppercase tracking-[0.25em] text-accent">System settings</p>
          <h1 className="mt-4 font-display text-5xl font-black uppercase leading-none tracking-tight">Server gate</h1>
          <p className="mt-6 max-w-sm leading-7 text-muted">The Discord guild and invite are deployment environment settings. Operators can adjust the message shown to denied Minecraft players here.</p>
          <dl className="mt-7 space-y-2 font-mono text-[10px] uppercase tracking-wider text-muted">
            <div><dt className="inline font-bold text-ink">Guild:</dt> <dd className="inline">{process.env.DISCORD_GUILD_ID ? "configured" : "missing"}</dd></div>
            <div><dt className="inline font-bold text-ink">Invite:</dt> <dd className="inline">{process.env.DISCORD_INVITE_URL ? "configured" : "missing"}</dd></div>
          </dl>
        </section>

        <form action={saveDiscordSettings} className="border border-line bg-panel p-7 shadow-[8px_8px_0_var(--color-shadow)] sm:p-9">
          {query.saved && <p className="mb-6 border-l-2 border-signal pl-4 font-mono text-xs font-bold uppercase tracking-wider">Settings saved</p>}
          {query.error && <p className="mb-6 border-l-2 border-accent pl-4 text-sm">Check the highlighted configuration values and try again.</p>}

          <label className="block font-mono text-xs font-bold uppercase tracking-wider" htmlFor="registrationMessage">Denied-player message</label>
          <textarea
            className="mt-3 min-h-32 w-full resize-y border border-line bg-canvas px-4 py-3 text-sm leading-6 outline-none focus:border-accent"
            defaultValue={message}
            id="registrationMessage"
            maxLength={500}
            minLength={10}
            name="registrationMessage"
            required
          />

          <button className="mt-8 border border-ink bg-ink px-6 py-3 font-mono text-xs font-bold uppercase tracking-[0.16em] text-canvas hover:bg-accent" type="submit">Save configuration</button>
        </form>
      </div>
    </main>
  );
}