import { prisma } from "@/lib/prisma";
import { userPurchasedReadingsCountSelect } from "@/lib/admin/purchased-readings";
import { Card, CardContent } from "@/components/ui/card";
import { AdminUserActions } from "./user-actions";
import { UserExportToolbar } from "./user-export-toolbar";

export default async function AdminUsersPage() {
  const users = await prisma.user.findMany({
    orderBy: { createdAt: "desc" },
    select: {
      id: true,
      phone: true,
      role: true,
      status: true,
      createdAt: true,
      ...userPurchasedReadingsCountSelect,
    },
  });

  return (
    <div>
      <h1 className="text-2xl font-bold mb-6">کاربران</h1>
      <UserExportToolbar />
      <Card>
        <CardContent className="p-0">
          <table className="w-full text-sm">
            <thead>
              <tr className="border-b">
                <th className="text-right p-4">شماره موبایل</th>
                <th className="text-right p-4">نقش</th>
                <th className="text-right p-4">وضعیت</th>
                <th className="text-right p-4">تعداد فال</th>
                <th className="text-right p-4">تاریخ</th>
                <th className="text-right p-4">عملیات</th>
              </tr>
            </thead>
            <tbody>
              {users.map((u) => (
                <tr key={u.id} className="border-b last:border-0">
                  <td className="p-4">{u.phone}</td>
                  <td className="p-4">{u.role}</td>
                  <td className="p-4">{u.status}</td>
                  <td className="p-4 tabular-nums">
                    {u._count.readings.toLocaleString("fa-IR")}
                  </td>
                  <td className="p-4">{new Date(u.createdAt).toLocaleDateString("fa-IR")}</td>
                  <td className="p-4">
                    <AdminUserActions userId={u.id} status={u.status} />
                  </td>
                </tr>
              ))}
            </tbody>
          </table>
        </CardContent>
      </Card>
    </div>
  );
}