import Link from "next/link";
import { sql } from "drizzle-orm";
import { db } from "@/db";
import { products } from "@/db/schema";
export default async function Brands({ searchParams }: { searchParams: Promise<{ view?: string }> }) {
  const sup = (await searchParams).view === "suppliers";
  const col = sup ? products.supplier : products.brand;
  const rows = await db.select({ name: col, n: sql<number>`count(*)::int`, stock: sql<number>`sum(${products.stock})::int` }).from(products).groupBy(col).orderBy(col);
  return <div><h1 className="text-2xl font-extrabold mb-1">{sup ? "Suppliers" : "Brands"}</h1><p className="text-sm text-slate-500 mb-5">{sup ? "Suppliers" : "Brands"} are assigned on each product. Edit a product to change its {sup ? "supplier" : "brand"}.</p>
    <div className="card overflow-hidden"><table className="w-full text-sm"><thead className="bg-cloud text-xs text-left text-slate-500"><tr><th className="p-3">Name</th><th>Products</th><th>Units in stock</th><th></th></tr></thead><tbody>{rows.map((r) => <tr key={r.name || "-"} className="border-t"><td className="p-3 font-semibold">{r.name || <i className="text-slate-400">Not set</i>}</td><td>{r.n}</td><td>{r.stock}</td><td><Link href={`/admin/products?q=${encodeURIComponent(r.name || "")}`} className="text-brand text-xs font-semibold">View products</Link></td></tr>)}</tbody></table></div></div>;
}