import type { Meta, StoryObj } from '@storybook/react';
import {
  VirtualizedChatMessages,
  VirtualizedChatMessagesSkeleton,
} from './virtualized-chat-messages';

const meta: Meta<typeof VirtualizedChatMessages> = {
  title: 'Components/Features/Chat/VirtualizedChatMessages',
  component: VirtualizedChatMessages,
  parameters: { layout: 'padded' },
  tags: ['autodocs'],
  decorators: [
    (Story) => (
      <div className="bg-background p-4 min-h-layout-page-sm">
        <Story />
      </div>
    ),
  ],
};

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

const mockMessages = [
  {
    id: '1',
    content: 'Hello world',
    sender: { username: 'User1' },
    created_at: new Date().toISOString(),
  },
  {
    id: '2',
    content: 'Hi there!',
    sender: { username: 'User2' },
    created_at: new Date().toISOString(),
  },
];

export const Default: Story = {
  name: 'Par défaut',
  args: {
    messages: mockMessages,
    hasNextPage: false,
    isFetching: false,
    fetchNextPage: () => {},
  },
};

export const Empty: Story = {
  name: 'Vide',
  args: {
    messages: [],
    hasNextPage: false,
    isFetching: false,
    fetchNextPage: () => {},
  },
};

export const Loading: Story = {
  name: 'Chargement',
  render: () => <VirtualizedChatMessagesSkeleton />,
};