import {
	Table,
	TableBody,
	TableCaption,
	TableCell,
	TableFooter,
	TableHead,
	TableHeader,
	TableRow,
} from "@/components/ui/table";
import { headers } from "next/headers";
import Link from "next/link";
import BlockDeviceDialog from "../block-device-dialog";
import DeviceCard from "../device-card";
import Pagination from "../pagination";

export async function AdminDevicesTable({
	searchParams,
	parentalControl,
}: {
	searchParams: Promise<{
		query: string;
		page: number;
		sortBy: string;
	}>;
	parentalControl?: boolean;
}) {
	// const session = await auth.api.getSession({
	// 	headers: await headers(),
	// });
	// const isAdmin = session?.user.role === "ADMIN";
	// const query = (await searchParams)?.query || "";
	// const page = (await searchParams)?.page;
	// const sortBy = (await searchParams)?.sortBy || "asc";
	// const totalDevices = await prisma.device.count({
	// 	where: {
	// 		OR: [
	// 			{
	// 				name: {
	// 					contains: query || "",
	// 					mode: "insensitive",
	// 				},
	// 			},
	// 			{
	// 				mac: {
	// 					contains: query || "",
	// 					mode: "insensitive",
	// 				},
	// 			},
	// 		],
	// 	},
	// });

	// const totalPages = Math.ceil(totalDevices / 10);
	// const limit = 10;
	// const offset = (Number(page) - 1) * limit || 0;

	// const devices = await prisma.device.findMany({
	// 	where: {
	// 		OR: [
	// 			{
	// 				name: {
	// 					contains: query || "",
	// 					mode: "insensitive",
	// 				},
	// 			},
	// 			{
	// 				mac: {
	// 					contains: query || "",
	// 					mode: "insensitive",
	// 				},
	// 			},
	// 		],
	// 	},
	// 	include: {
	// 		User: true,
	// 		payments: true,
	// 	},
	// 	skip: offset,
	// 	take: limit,
	// 	orderBy: {
	// 		name: `${sortBy}` as "asc" | "desc",
	// 	},
	// });
	return null;
	// return (
	// 	<div>
	// 		{devices.length === 0 ? (
	// 			<div className="h-[calc(100svh-400px)] flex flex-col items-center justify-center my-4">
	// 				<h3>No devices yet.</h3>
	// 			</div>
	// 		) : (
	// 			<>
	// 				<div className="hidden sm:block">
	// 					<Table className="overflow-scroll">
	// 						<TableCaption>Table of all devices.</TableCaption>
	// 						<TableHeader>
	// 							<TableRow>
	// 								<TableHead>Device Name</TableHead>
	// 								<TableHead>User</TableHead>
	// 								<TableHead>MAC Address</TableHead>
	// 								<TableHead>isActive</TableHead>
	// 								<TableHead>blocked</TableHead>
	// 								<TableHead>blockedBy</TableHead>
	// 								<TableHead>expiryDate</TableHead>
	// 							</TableRow>
	// 						</TableHeader>
	// 						<TableBody className="overflow-scroll">
	// 							{devices.map((device) => (
	// 								<TableRow key={device.id}>
	// 									<TableCell>
	// 										<div className="flex flex-col items-start">
	// 											<Link
	// 												className="font-medium hover:underline"
	// 												href={`/devices/${device.id}`}
	// 											>
	// 												{device.name}
	// 											</Link>
	// 											{device.isActive && (
	// 												<span className="text-muted-foreground">
	// 													Active until{" "}
	// 													{new Date().toLocaleDateString("en-US", {
	// 														month: "short",
	// 														day: "2-digit",
	// 														year: "numeric",
	// 													})}
	// 												</span>
	// 											)}

	// 											{device.blocked && (
	// 												<div className="p-2 rounded border my-2">
	// 													<span>Comment: </span>
	// 													<p className="text-neutral-500">
	// 														blocked because he was watching youtube
	// 													</p>
	// 												</div>
	// 											)}
	// 										</div>
	// 									</TableCell>
	// 									<TableCell className="font-medium">
	// 										{device.User?.name}
	// 									</TableCell>

	// 									<TableCell className="font-medium">{device.mac}</TableCell>
	// 									<TableCell>
	// 										{device.isActive ? "Active" : "Inactive"}
	// 									</TableCell>
	// 									<TableCell>
	// 										{device.blocked ? "Blocked" : "Not Blocked"}
	// 									</TableCell>
	// 									<TableCell>
	// 										{device.blocked ? device.blockedBy : ""}
	// 									</TableCell>
	// 									<TableCell>
	// 										{new Date().toLocaleDateString("en-US", {
	// 											month: "short",
	// 											day: "2-digit",
	// 											year: "numeric",
	// 										})}
	// 									</TableCell>
	// 									<TableCell>
	// 										<BlockDeviceDialog
	// 											admin={isAdmin}
	// 											type={device.blocked ? "unblock" : "block"}
	// 											device={device}
	// 										/>
	// 									</TableCell>
	// 								</TableRow>
	// 							))}
	// 						</TableBody>
	// 						<TableFooter>
	// 							<TableRow>
	// 								<TableCell colSpan={7}>
	// 									{query.length > 0 && (
	// 										<p className="text-sm text-muted-foreground">
	// 											Showing {devices.length} locations for &quot;{query}
	// 											&quot;
	// 										</p>
	// 									)}
	// 								</TableCell>
	// 								<TableCell className="text-muted-foreground">
	// 									{totalDevices} devices
	// 								</TableCell>
	// 							</TableRow>
	// 						</TableFooter>
	// 					</Table>
	// 					<Pagination totalPages={totalPages} currentPage={page} />
	// 				</div>
	// 				<div className="sm:hidden my-4">
	// 					{devices.map((device) => (
	// 						<DeviceCard
	// 							parentalControl={parentalControl}
	// 							key={device.id}
	// 							device={device}
	// 						/>
	// 					))}
	// 				</div>
	// 			</>
	// 		)}
	// 	</div>
	// );
}