import { PageHeader } from "@/components/dashboard/page-header";
import { Card } from "@/components/ui/card";
import { ChangePasswordForm } from "@/components/forms/change-password-form";

export default async function DonorSecurityPage({
  searchParams
}: {
  searchParams: Promise<{ required?: string }>;
}) {
  const required = (await searchParams).required === "1";

  return (
    <>
      <PageHeader title="كلمة المرور" description="استخدم كلمة مرور طويلة وفريدة ولا تشاركها مع أي شخص." />
      {required ? (
        <p className="mb-5 max-w-xl rounded-md border-r-4 border-[#c88719] bg-[#fff4d6] px-4 py-3 text-sm font-semibold text-[#76520b]" role="alert">
          يجب تغيير كلمة المرور الأولية قبل متابعة استخدام الحساب.
        </p>
      ) : null}
      <Card className="max-w-xl p-5 sm:p-6">
        <ChangePasswordForm />
      </Card>
    </>
  );
}
