import { CommonModule } from '@angular/common';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { moduleMetadata, type Meta, type StoryObj } from '@storybook/angular';

//Components
import { CaProgressExpirationComponent } from './ca-progress-expiration.component';

//Pipes
import {
  CurrencyFormatPipe,
  ProgressExpirationAbsPipe,
  ProgressExpirationWidthPipe,
  TimeFormatPipe,
} from './pipes';

const meta: Meta<CaProgressExpirationComponent> = {
  title: 'Example/ProgressExpiration',
  component: CaProgressExpirationComponent,
  tags: ['autodocs'],
  decorators: [
    moduleMetadata({
      imports: [CommonModule, FormsModule, ReactiveFormsModule, TimeFormatPipe],
      providers: [
        ProgressExpirationWidthPipe,
        ProgressExpirationAbsPipe,
        CurrencyFormatPipe,
        TimeFormatPipe,
      ],
    }),
  ],
  argTypes: {
    config: {
      control: 'object',
      defaultValue: {
        template: 'todo-list',
        expireDate: new Date(),
        startDate: new Date(),
        type: 'small',
        theme: 'light',
      },
    },
  },
};

export default meta;

type Story = StoryObj<CaProgressExpirationComponent>;

export const TodoProgressExpirationCompleted: Story = {
  args: {
    config: [
      {
        template: 'todo-list',
        expireDate: new Date('2024-08-09'),
        completedDate: new Date('2024-08-07'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const TodoProgressExpirationExpired: Story = {
  args: {
    config: [
      {
        template: 'todo-list',
        expireDate: new Date('2024-08-09'),
        completedDate: new Date('2024-08-12'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const TodoProgressExpirationDeadlineIn: Story = {
  args: {
    config: [
      {
        template: 'todo-list',
        expireDate: new Date('2024-08-09'),
        startDate: new Date('2024-08-05'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const TodoProgressExpirationDeadlineWas: Story = {
  args: {
    config: [
      {
        template: 'todo-list',
        expireDate: new Date('2024-08-05'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const DetailsProgressExpiration: Story = {
  args: {
    config: [
      {
        template: 'details',
        expireDate: new Date('2024-08-25'),
        startDate: new Date('2024-08-04'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const DetailsProgressExpirationHours: Story = {
  args: {
    config: [
      {
        template: 'details',
        expireDate: new Date('2024-08-07T02:00:00'),
        type: 'small',
        theme: 'light',
      },
    ],
  },
};

export const LocationProgressExpirationWeekly: Story = {
  args: {
    config: [
      {
        template: 'location',
        expireDate: new Date('2024-10-10T13:00:00'),
        type: 'small',
        theme: 'light',
        rent: 380,
      },
    ],
  },
};

export const LocationProgressExpirationMontlhy: Story = {
  args: {
    config: [
      {
        template: 'location',
        expireDate: new Date('2024-10-24T02:00:00'),
        type: 'small',
        theme: 'light',
        rent: 380,
      },
    ],
  },
};