import { http, HttpResponse } from "msw";
import preview from "../../.storybook/preview.tsx";
import { LetterheadParagraph } from "../Letterhead/index.tsx";
import { sleep } from "../sleep.ts";
import { SubscribeByEmailCard } from "./SubscribeByEmailCard.tsx";

const handlers = {
  subscribe() {
    return http.post(
      "http://mock.api/v1/newsletters/changelog/subscriptions",
      async () => {
        await sleep(2000);

        return HttpResponse.json(
          { tokenId: "1", message: "Ok" },
          { status: 201 },
        );
      },
    );
  },
  confirm() {
    return http.put(
      "http://mock.api/v1/newsletters/changelog/newsletter-signup-tokens/:tokenId",
      async () => {
        await sleep(2000);

        return HttpResponse.json({ message: "Ok" }, { status: 201 });
      },
    );
  },
};

const meta = preview.meta({
  title: "Newsletter/Subscribe By Email Card",
  component: SubscribeByEmailCard,
  tags: ["autodocs"],
  args: {
    content: {
      SUBSCRIBE: {
        title: "Space Gits on Indie Tabletop Club",
        description: (
          <LetterheadParagraph>
            Space Gits is getting a fancy <strong>gang builder</strong> and{" "}
            <strong>smart rules</strong> in late 2025 in collaboration with
            Indie Tabletop Club. Subscribe to ITC&apos;s{" "}
            <em>at‑most‑one‑a‑month</em> newsletter and be among the first to
            gain early access. It&apos;s gonna be rad.
          </LetterheadParagraph>
        ),
      },
      SUBSCRIBE_SUCCESS: {
        title: "Subscribed!",
        description:
          "Thank you for being awesome. Once Space Gits is available for " +
          "early access, you will be among the first to know!",
      },
    },
  },
  parameters: {
    msw: {
      handlers: {
        subscribe: handlers.subscribe(),
        confirm: handlers.confirm(),
      },
    },
  },
});

export const Default = meta.story({});