import Link from "next/link";
import { redirect } from "next/navigation";

import { RoleCode } from "@prisma/client";
import { ShellPage } from "@/components/page-templates";
import { Button, SectionCard } from "@/components/ui";
import { getSession } from "@/lib/auth";
import { updateTeamUser } from "@/lib/admin-crud";
import { prisma } from "@/lib/prisma";

export default async function EditUserPage({ params }: { params: Promise<{ userId: string }> }) {
  const { userId } = await params;
  const session = await getSession();
  if (!session) {
    redirect("/login");
  }

  const roles = await prisma.role.findMany({
    where: { tenantId: session.tenantId, code: { in: [RoleCode.ADMIN_CLIENT, RoleCode.AGENT] } },
    orderBy: { code: "asc" }
  });
  const fullUser = await prisma.user.findFirst({
    where: { id: userId, tenantId: session.tenantId },
    include: { role: true }
  });
  if (!fullUser) {
    redirect("/team?error=user_not_found");
  }

  return (
    <ShellPage shell="admin" title="Edit User" description="Update role dan status user.">
      <SectionCard title="User form">
        <form action={updateTeamUser} className="grid gap-4 md:max-w-2xl">
          <input type="hidden" name="userId" value={fullUser.id} />
          <input
            name="fullName"
            required
            defaultValue={fullUser.fullName}
            className="rounded-xl border border-line px-4 py-3"
          />
          <input
            name="email"
            required
            type="email"
            defaultValue={fullUser.email}
            className="rounded-xl border border-line px-4 py-3"
          />
          <label className="block text-sm">
            <span className="text-on-surface-variant">Role</span>
            <select name="roleId" defaultValue={fullUser.roleId} className="mt-2 w-full rounded-xl border border-line px-4 py-3">
              {roles.map((role) => (
                <option key={role.id} value={role.id}>
                  {role.name}
                </option>
              ))}
            </select>
          </label>
          <label className="block text-sm">
            <span className="text-on-surface-variant">Status</span>
            <select name="status" defaultValue={fullUser.status} className="mt-2 w-full rounded-xl border border-line px-4 py-3">
              <option value="INVITED">Invited</option>
              <option value="ACTIVE">Active</option>
              <option value="DISABLED">Disabled</option>
            </select>
          </label>
          <input
            name="password"
            type="password"
            placeholder="Password baru (opsional)"
            className="md:col-span-2 rounded-xl border border-line px-4 py-3"
          />
          <div className="md:col-span-2 flex gap-3">
            <Button type="submit" className="rounded-xl">
              Save changes
            </Button>
            <Link href={`/team/${fullUser.id}`} className="text-on-surface-variant hover:underline">
              Cancel
            </Link>
          </div>
        </form>
      </SectionCard>
    </ShellPage>
  );
}