import { Link } from "react-router-dom";
import { STAFF_PERMISSION_DEFINITIONS, type StaffPermissionSection } from "../../utils/staffAccess.ts";

/**
 * Said in place of a staff section this person may not open: a typed address, or a page whose access was
 * taken away while it was open. It replaces the section, so nothing of it stays on screen and nothing more is
 * read. The server refuses independently; this is the person being told.
 */
const SectionUnavailable = ({ section, manage = false }: { section: StaffPermissionSection; manage?: boolean }) => {
  const label = STAFF_PERMISSION_DEFINITIONS.find((definition) => definition.key === section)?.label ?? section;

  return (
    <div className="ak-page-body p-6" role="alert">
      <h1 className="ak-page-title">
        {manage ? `You can’t manage ${label}` : `You don’t have access to ${label}`}
      </h1>
      <p className="text-sm text-secondary">
        {manage
          ? `Your role at this practice can see ${label} but not change it.`
          : `Your role at this practice doesn’t include ${label}.`}{" "}
        If you need it, ask a practice administrator.
      </p>
      <Link className="btn btn-blue-ghost" to="/dashboard/profile">
        Go to my profile
      </Link>
    </div>
  );
};

export default SectionUnavailable;