import { auth } from "@/lib/auth";
import { prisma } from "@/lib/db";
import { hasPermission } from "@/lib/permissions";
import { redirect } from "next/navigation";

export default async function UsersPage() {
  const session = await auth();
  if (!hasPermission(session?.user, "users.manage")) {
    redirect("/dashboard");
  }

  const users = await prisma.user.findMany({
    include: { roles: { include: { role: true } } },
    orderBy: { createdAt: "asc" },
  });

  return (
    <div className="space-y-4">
      <div>
        <h1 className="text-2xl font-bold">المستخدمون والصلاحيات</h1>
        <p className="text-sm text-muted">إدارة الأدوار: مدير / موظف / محاسب</p>
      </div>
      <div className="card overflow-hidden">
        <div className="table-wrap">
          <table className="data-table">
            <thead>
              <tr>
                <th>الاسم</th>
                <th>البريد</th>
                <th>الأدوار</th>
                <th>الحالة</th>
                <th>آخر دخول</th>
              </tr>
            </thead>
            <tbody>
              {users.map((u) => (
                <tr key={u.id}>
                  <td className="font-semibold">{u.name}</td>
                  <td>{u.email}</td>
                  <td>{u.roles.map((r) => r.role.nameAr).join("، ")}</td>
                  <td>{u.isActive ? "نشط" : "موقوف"}</td>
                  <td>
                    {u.lastLoginAt
                      ? u.lastLoginAt.toLocaleString("ar-EG")
                      : "—"}
                  </td>
                </tr>
              ))}
            </tbody>
          </table>
        </div>
      </div>
    </div>
  );
}