import { useNavigate } from "react-router-dom";
import { ChevronRight, ShieldCheck } from "lucide-react";
import { Card, CardHeader, CardTitle } from "../../../components/ui/card";
import ConsentSettingsSection from "./ConsentSettingsSection";

// admin-v2 dashboard.html "Agreements" — the BAA, and what patients agree to. The BAA keeps its
// own route (a legal instrument, executed and superseded, never just another settings card — see
// the register note on OrganizationPage's BAA card); this page links to it rather than re-deriving
// its status, and hosts the patient-facing consent text, which was previously an unrouted card.
const AgreementsPage = ({ inForce = false }: { inForce?: boolean }) => {
  const navigate = useNavigate();

  return (
    <div className="space-y-4">
      <Card>
        <CardHeader>
          <div className="flex items-center justify-between gap-3">
            <div className="flex items-center gap-2">
              <ShieldCheck className="h-5 w-5" />
              <CardTitle>Business Associate Agreement</CardTitle>
              {inForce ? <span className="ak-pill ak-pill--ok">In force</span> : null}
            </div>
            <button
              type="button"
              className="btn btn-blue-ghost"
              onClick={() => navigate("/dashboard/organization/baa")}
            >
              Open
              <ChevronRight className="h-4 w-4" />
            </button>
          </div>
        </CardHeader>
      </Card>

      <ConsentSettingsSection />
    </div>
  );
};

export default AgreementsPage;