import { Meta, StoryObj } from "@storybook/react"
import { add } from "date-fns"
import React from "react"
import { Countdown, CountdownProps } from "./Countdown"

type Story = StoryObj<typeof Countdown>

const meta: Meta<typeof Countdown> = {
  title: "Design System/Countdown",
  component: Countdown,
}

export default meta

const END_DATE = add(new Date(), {
  years: 3,
  months: 2,
  days: 3,
  hours: 4,
  minutes: 5,
  seconds: 6,
})

const Template = (args: CountdownProps) => {
  return <Countdown {...args} />
}

export const Default: Story = {
  render: Template,
  args: {
    end: END_DATE,
  },
}

export const ShowDaysOnly: Story = {
  render: Template,
  args: {
    end: END_DATE,
    showDaysOnly: true,
  },
}

export const Small: Story = {
  render: Template,
  args: {
    end: END_DATE,
    size: "sm",
  },
}