import { columns } from "@/app/admin/printers/columns";
import { DataTable } from "@/app/admin/printers/data-table";
import { CreatePrinterDialog } from "@/app/admin/printers/dialogs/create-printer";
import { Button } from "@/components/ui/button";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { db } from "@/server/db";
import { PlusCircleIcon } from "lucide-react";

export default async function AdminPage() {
	const data = await db.query.printers.findMany();

	return (
		<Card>
			<CardHeader className="flex flex-row justify-between items-center">
				<div>
					<CardTitle>Druckerverwaltung</CardTitle>
					<CardDescription>Suche, Bearbeite, Lösche und Erstelle Drucker</CardDescription>
				</div>
				<CreatePrinterDialog>
					<Button variant={"default"} className="flex gap-2 items-center">
						<PlusCircleIcon className="w-4 h-4" />
						<span>Drucker erstellen</span>
					</Button>
				</CreatePrinterDialog>
			</CardHeader>
			<CardContent>
				<DataTable columns={columns} data={data} />
			</CardContent>
		</Card>
	);
}
