import { desc } from "drizzle-orm";
import { db } from "@/db";
import { coupons } from "@/db/schema";
import { saveCoupon } from "@/app/admin/actions";
export default async function C() {
  const rows = await db.select().from(coupons).orderBy(desc(coupons.id));
  const Row = ({ c }: { c?: typeof rows[number] }) => <form action={saveCoupon} className="card p-4 grid md:grid-cols-[1.2fr_1fr_.8fr_1fr_.8fr_1fr_auto_auto_auto] gap-2 items-center"><input type="hidden" name="id" value={c?.id ?? ""} /><input name="code" defaultValue={c?.code} placeholder="CODE" required className="input uppercase" /><select name="type" defaultValue={c?.type} className="input"><option value="percent">% off</option><option value="fixed">Fixed UGX</option><option value="free_shipping">Free delivery</option></select><input name="value" type="number" defaultValue={c?.value} placeholder="Value" className="input" /><input name="minOrder" type="number" defaultValue={c?.minOrder} placeholder="Min spend" className="input" /><input name="maxUses" type="number" defaultValue={c?.maxUses ?? ""} placeholder="Max uses" className="input" /><input name="endsAt" type="date" defaultValue={c?.endsAt ?? ""} className="input" /><label className="text-xs flex gap-1"><input type="checkbox" name="firstOrderOnly" defaultChecked={c?.firstOrderOnly} />1st order</label><label className="text-xs flex gap-1"><input type="checkbox" name="active" defaultChecked={c?.active ?? true} />Active</label><div className="flex gap-1"><button className="btn btn-green !py-2">{c ? "Save" : "Add"}</button>{c && <button name="_delete" value="1" className="btn !py-2 text-red-600">✕</button>}</div>{c && <span className="text-xs text-slate-500 md:col-span-9">Used {c.used} time(s)</span>}</form>;
  return <div><h1 className="text-2xl font-extrabold mb-1">Promotions & Coupons</h1><p className="text-sm text-slate-500 mb-5">All coupon rules are validated on the server at checkout. For product sales, set an “Original price” on products; for the announcement bar and banners use the Website Editor.</p><div className="space-y-3">{rows.map((c) => <Row key={c.id} c={c} />)}<h3 className="font-bold pt-4">New coupon</h3><Row /></div></div>;
}
