import { LogOut, MessageSquareOff } from "lucide-react";
import { Button } from "../ui/button";
import type { AdolescentGateReason } from "../../utils/adolescentFeatureGate";

// A 12-17 helper gets no explanation: the 18+ surfaces are absent, not explained.
export const ScopedSwitchInHeld = ({
  reason,
  subjectName,
  onExit,
}: {
  reason: Exclude<AdolescentGateReason, "not-applicable">;
  subjectName?: string;
  onExit: () => void;
}) => {
  const who = subjectName?.trim() || "them";
  return (
    <div className="ak-card ak-card--panel mx-auto my-8 flex max-w-xl flex-col items-start gap-3 p-6" role="status">
      <MessageSquareOff className="size-6 text-muted-foreground" aria-hidden="true" />
      {reason === "unknown-age" ? (
        <p>
          To message for {who}, first add your date of birth to your own profile. Exit, add it under My details,
          then switch in again.
        </p>
      ) : (
        <p>Messages are not available here.</p>
      )}
      <Button type="button" variant="outline" onClick={onExit}>
        <LogOut className="size-4" aria-hidden="true" />
        Exit
      </Button>
    </div>
  );
};