import { useEffect, useState } from 'react';
import type { StoryObj, Meta } from '@storybook/react';

import { Progress } from '.';

const meta: Meta<typeof Progress> = {
  title: 'Components/Progress',
  component: Progress,
  argTypes: {},
};

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

export const Default: Story = {
  name: 'Default',
  render: () => {
    const [progress, setProgress] = useState(13);

    useEffect(() => {
      const timer = setTimeout(() => setProgress(100), 1500);
      return () => clearTimeout(timer);
    }, []);

    return <Progress value={progress} />;
  },
};
