import { Meta, StoryObj } from "@storybook/nextjs-vite";
import { EmailTemplate } from "./EmailTemplate";
import { fn } from "storybook/test";
import { buildEmailDefaults } from "@/lib/admin/builder/state/defaults/email";
import type { EmailScreenDefinition } from "@/lib/funnel/types";

// Получаем дефолтные значения из builder
const defaultScreen = buildEmailDefaults("email-screen-story") as EmailScreenDefinition;

/** EmailTemplate - экраны сбора email адреса */
const meta: Meta<typeof EmailTemplate> = {
  title: "Funnel Templates/EmailTemplate",
  component: EmailTemplate,
  tags: ["autodocs"],
  parameters: {
    layout: "fullscreen",
  },
  args: {
    screen: defaultScreen,
    onContinue: fn(),
    canGoBack: true,
    onBack: fn(),
    screenProgress: { current: 9, total: 10 },
    defaultTexts: {
      nextButton: "Next",
    },
    funnel: {
      meta: {
        id: "test-funnel",
        title: "Test Funnel",
      },
      screens: [],
    },
    selectedEmail: "",
    onEmailChange: fn(),
    answers: {},
  },
  argTypes: {
    screen: {
      control: { type: "object" },
    },
    screenProgress: {
      control: { type: "object" },
    },
    onContinue: { action: "continue" },
    onBack: { action: "back" },
  },
};

export default meta;
type Story = StoryObj<typeof meta>;

/** Дефолтный email экран */
export const Default: Story = {};

/** Экран без изображения */
export const WithoutImage: Story = {
  args: {
    screen: {
      ...defaultScreen,
      image: undefined,
    },
  },
};

/** Экран с consent */
export const WithConsent: Story = {
  args: {
    screen: {
      ...defaultScreen,
      bottomActionButton: {
        ...defaultScreen.bottomActionButton,
        showPrivacyTermsConsent: true,
      },
    },
  },
};

/** Экран без header */
export const WithoutHeader: Story = {
  args: {
    screen: {
      ...defaultScreen,
      header: {
        show: false,
      },
    },
  },
};

/** Экран с кастомными лейблами */
export const CustomLabels: Story = {
  args: {
    screen: {
      ...defaultScreen,
      emailInput: {
        label: "Your Email Address",
        placeholder: "Enter your email here...",
      },
    },
  },
};