import { Button } from "../../../../components/ui/button.tsx";
import { sectionReadDeniedMessage, type SectionReadFailure } from "../../../../utils/sectionReadRefusal";

/**
 * THE ONE PLACE THE THREE SECTIONS OF A PRACTICE'S PAGE SAY WHY THEY HAVE NOTHING TO SHOW.
 *
 * Providers, appointments and locations each read one list and each used to answer a refusal with the
 * sentence they use for an empty one. They are three sections rather than one, but the two things they
 * have to say about a failed read are identical, and writing them out three times is how the third copy
 * drifts from the first two.
 *
 * THE RETRY BELONGS TO THE RETRYABLE CASE ONLY. Offering one under a denial hands somebody a button
 * whose every press reproduces the refusal that put it on screen, which is the defect the agreement
 * sections on this same page were fixed for.
 */
export const SectionReadNotice = ({
    failure,
    subject,
    practice,
    whatTheyCanTell,
    onRetry,
}: {
    failure: SectionReadFailure;
    /** What could not be shown, as a noun phrase - see `sectionReadDeniedMessage`. */
    subject: string;
    practice: string;
    whatTheyCanTell: string;
    onRetry: () => void;
}) => (
    <div className="space-y-2">
        <p className="text-sm text-secondary">
            {failure === "denied"
                ? sectionReadDeniedMessage(subject, practice, whatTheyCanTell)
                /* UNCHANGED IN SPIRIT FROM THE AGREEMENT SECTIONS ABOVE: it refuses to state a fact it is
                   unsure of, which is the correct thing to say about a genuine fault. Saying that the list
                   is empty would be stating one. */
                : `Could not load ${subject}. Try again.`}
        </p>
        {failure === "error" && (
            <Button type="button" variant="outline" onClick={onRetry}>
                Try again
            </Button>
        )}
    </div>
);

export default SectionReadNotice;