veza/apps/web/src/components/data/Table.stories.tsx

import type { Meta, StoryObj } from '@storybook/react-vite';
import { Table, type TableColumn } from './Table';

type SampleRow = { id: string; name: string; age: number; email: string };

const sampleColumns: TableColumn<SampleRow>[] = [
  { key: 'name', header: 'Nom', sortable: true },
  { key: 'age', header: 'Âge', sortable: true },
  { key: 'email', header: 'Email', sortable: false },
];

const sampleData: SampleRow[] = [
  { id: '1', name: 'Alice', age: 28, email: 'alice@example.com' },
  { id: '2', name: 'Bob', age: 32, email: 'bob@example.com' },
  { id: '3', name: 'Charlie', age: 24, email: 'charlie@example.com' },
];

const meta: Meta = {
  title: 'Data/Table',
  component: Table,
  tags: ['autodocs'],
  parameters: {
    layout: 'padded',
  },
};

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

export const Default: Story = {
  args: {
    columns: sampleColumns,
    data: sampleData,
    emptyMessage: 'Aucune donnée disponible',
  },
};

export const Empty: Story = {
  args: {
    columns: sampleColumns,
    data: [],
    emptyMessage: 'Aucune donnée disponible',
  },
};

export const Paginated: Story = {
  args: {
    columns: sampleColumns,
    data: Array.from({ length: 25 }, (_, i) => ({
      id: String(i + 1),
      name: `User ${i + 1}`,
      age: 20 + i,
      email: `user${i + 1}@example.com`,
    })),
    paginated: true,
    itemsPerPage: 10,
    emptyMessage: 'Aucune donnée disponible',
  },
};

export const Selectable: Story = {
  args: {
    columns: sampleColumns,
    data: sampleData,
    selectable: true,
    emptyMessage: 'Aucune donnée disponible',
  },
};