import { renderToStaticMarkup } from "react-dom/server";
import { describe, expect, it } from "vitest";

import { getCharacterBySlug } from "@/data/constants/character";
import { CharacterProvider } from "@/providers/character-provider";

import { LockedImageMessageCard } from "../locked-image-message-card";

describe("LockedImageMessageCard", () => {
  it("renders the promotion hint and an enabled unlock action", () => {
    const character = getCharacterBySlug("maya");
    if (!character) throw new Error("Missing Maya character fixture");
    const html = renderToStaticMarkup(
      <CharacterProvider character={character}>
        <LockedImageMessageCard
          hint="Unlock this private photo."
          onUnlock={() => undefined}
        />
      </CharacterProvider>,
    );

    expect(html).toContain('aria-label="Locked private image"');
    expect(html).toContain("Unlock this private photo.");
    expect(html).toContain("Unlock private image");
    expect(html).not.toContain(' disabled=""');
  });
});
