"use client";

import Link from "next/link";
import { useParams } from "next/navigation";
import { useCallback, useEffect, useState } from "react";
import { AppShell } from "@/components/app/AppShell";
import { RequireStudentManage } from "@/components/auth/RequirePermission";
import { Alert } from "@/components/ui/Alert";
import { Button } from "@/components/ui/Button";
import { ConfirmDialog } from "@/components/ui/ConfirmDialog";
import { PageContentSkeleton } from "@/components/ui/Skeleton";
import { ApiError, apiGet, apiPost } from "@/lib/api";

interface StudentResetUser {
  id: number;
  first_name?: string | null;
  last_name?: string | null;
  full_name?: string | null;
  mobile?: string | null;
  national_code?: string | null;
  initial_password?: string | null;
  must_change_password?: boolean;
}

function CredentialRow({
  label,
  value,
  onCopy,
}: {
  label: string;
  value: string;
  onCopy: (text: string) => void;
}) {
  return (
    <div className="flex flex-wrap items-center justify-between gap-2 border-b border-[var(--border)] py-3 last:border-b-0">
      <div>
        <p className="text-sm text-[var(--muted)]">{label}</p>
        <p className="mt-1 font-mono text-base font-semibold tracking-wide" dir="ltr">
          {value || "—"}
        </p>
      </div>
      {value ? (
        <Button variant="secondary" className="text-xs" onClick={() => onCopy(value)}>
          کپی
        </Button>
      ) : null}
    </div>
  );
}

export default function ResetStudentPasswordPage() {
  const { id } = useParams<{ id: string }>();
  const [student, setStudent] = useState<StudentResetUser | null>(null);
  const [password, setPassword] = useState<string | null>(null);
  const [messageSent, setMessageSent] = useState<boolean | null>(null);
  const [error, setError] = useState<string | null>(null);
  const [notice, setNotice] = useState<string | null>(null);
  const [loading, setLoading] = useState(true);
  const [resetting, setResetting] = useState(false);
  const [forcing, setForcing] = useState(false);
  const [confirmOpen, setConfirmOpen] = useState(false);

  const displayName = student
    ? student.full_name || [student.first_name, student.last_name].filter(Boolean).join(" ") || "دانش‌آموز"
    : "";

  const resetAndSend = useCallback(async () => {
    setResetting(true);
    setError(null);
    setNotice(null);
    try {
      const data = await apiPost<{
        initial_password: string;
        message_sent?: boolean;
        student?: StudentResetUser;
      }>(`/students/${id}/reset-password`, {});
      setPassword(data.initial_password);
      setMessageSent(Boolean(data.message_sent));
      if (data.student) {
        setStudent(data.student);
      }
      setConfirmOpen(false);
      setNotice(
        data.message_sent
          ? "رمز جدید ساخته شد و پیام برای کاربر ارسال شد."
          : "رمز جدید ساخته شد. پیام ارسال نشد (شماره موبایل یا قالب پیام را بررسی کنید).",
      );
    } catch (err) {
      setError(err instanceof ApiError ? err.message : "بازنشانی رمز ناموفق بود.");
    } finally {
      setResetting(false);
    }
  }, [id]);

  useEffect(() => {
    let cancelled = false;
    (async () => {
      setLoading(true);
      setError(null);
      setMessageSent(null);
      setNotice(null);
      try {
        const data = await apiGet<StudentResetUser>(`/students/${id}`);
        if (cancelled) return;
        setStudent(data);
        setPassword(data.initial_password ?? null);
      } catch (err) {
        if (!cancelled) {
          setError(err instanceof ApiError ? err.message : "خطا در بارگذاری دانش‌آموز");
        }
      } finally {
        if (!cancelled) setLoading(false);
      }
    })();
    return () => {
      cancelled = true;
    };
  }, [id]);

  const copy = async (text: string) => {
    try {
      await navigator.clipboard.writeText(text);
      setNotice("کپی شد.");
    } catch {
      setNotice("کپی در کلیپ‌بورد پشتیبانی نشد.");
    }
  };

  return (
    <RequireStudentManage>
      <AppShell
        title="بازنشانی رمز عبور"
        subtitle={displayName || `شناسه #${id}`}
        showBack
        breadcrumbLabels={{ student: displayName || undefined }}
      >
        {error ? <Alert tone="error">{error}</Alert> : null}
        {notice ? <Alert tone="success">{notice}</Alert> : null}

        {loading ? (
          <PageContentSkeleton rows={4} />
        ) : student ? (
          <div className="space-y-4">
            <div className="rounded-2xl border border-[var(--border)] bg-white p-4 shadow-card sm:p-6">
              <h2 className="mb-1 text-lg font-bold">{displayName}</h2>
              <p className="mb-4 text-sm text-[var(--muted)]">
                موبایل: {student.mobile || "ثبت نشده"}
              </p>
              <CredentialRow
                label="نام کاربری (کد ملی)"
                value={student.national_code ?? ""}
                onCopy={copy}
              />
              <CredentialRow label="رمز عبور پیشفرض" value={password ?? ""} onCopy={copy} />
              {messageSent === true ? (
                <p className="mt-4 text-sm text-emerald-700">پیام اطلاعات ورود برای کاربر ارسال شد.</p>
              ) : null}
              {messageSent === false ? (
                <p className="mt-4 text-sm text-amber-700">
                  پیام ارسال نشد. قالب «بازنشانی رمز توسط مدیر» و شماره موبایل را در پیام‌رسان بررسی کنید.
                </p>
              ) : null}
            </div>

            <div className="flex flex-wrap gap-2">
              <Button onClick={() => setConfirmOpen(true)}>ساخت و ارسال رمز جدید</Button>
              <Button
                variant="secondary"
                loading={forcing}
                onClick={async () => {
                  setForcing(true);
                  setError(null);
                  try {
                    const data = await apiPost<StudentResetUser>(`/students/${id}/force-password-change`, {
                      force: !student.must_change_password,
                    });
                    setStudent(data);
                    setNotice(
                      data.must_change_password
                        ? "در ورود بعدی این دانش‌آموز باید رمز عبور را عوض کند."
                        : "اجبار تغییر رمز برای این دانش‌آموز برداشته شد.",
                    );
                  } catch (err) {
                    setError(err instanceof ApiError ? err.message : "ثبت اجبار تغییر رمز ناموفق بود.");
                  } finally {
                    setForcing(false);
                  }
                }}
              >
                {student.must_change_password ? "برداشتن اجبار تغییر رمز" : "اجبار تغییر رمز در ورود بعدی"}
              </Button>
              <Link href={`/students/${id}`}>
                <Button variant="secondary">مشاهده دانش‌آموز</Button>
              </Link>
              <Link href="/students">
                <Button variant="secondary">بازگشت به فهرست</Button>
              </Link>
            </div>
          </div>
        ) : null}

        <ConfirmDialog
          open={confirmOpen}
          title="ساخت و ارسال رمز جدید"
          message={`رمز عبور ${displayName || "این دانش‌آموز"} عوض می‌شود و پیام اطلاعات ورود برای شماره موبایل ارسال می‌شود. ادامه می‌دهید؟`}
          confirmLabel="تأیید و ارسال"
          cancelLabel="انصراف"
          confirmVariant="primary"
          loading={resetting}
          onCancel={() => {
            if (!resetting) setConfirmOpen(false);
          }}
          onConfirm={() => void resetAndSend()}
        />
      </AppShell>
    </RequireStudentManage>
  );
}