import type { Meta, StoryFn } from '@storybook/react'
import React from 'react'

import { daysAgo, hoursAgo, now } from '../../stories/decorators/storyTime'

import { CustomDateSeparator } from '.'

type ComponentProps = React.ComponentProps<typeof CustomDateSeparator>

const meta: Meta<ComponentProps> = {
  title: 'CustomDateSeparator',
  component: CustomDateSeparator,
  parameters: { layout: 'fullscreen', chromatic: { disableSnapshot: true } },
}
export default meta

const Template: StoryFn<ComponentProps> = (args) => (
  <div className="w-[640px] bg-background-primary p-6">
    <CustomDateSeparator {...args} />
  </div>
)

export const Today: StoryFn<ComponentProps> = Template.bind({})
Today.args = { date: hoursAgo(2) }

export const Yesterday: StoryFn<ComponentProps> = Template.bind({})
Yesterday.args = { date: hoursAgo(30) }

export const LastWeek: StoryFn<ComponentProps> = Template.bind({})
LastWeek.args = { date: daysAgo(6) }

export const Unread: StoryFn<ComponentProps> = Template.bind({})
Unread.args = { date: now(), unread: true }