import type { Meta, StoryObj } from '@storybook/react';
import { FileGrid } from './FileGrid';
import { mockCloudFiles } from './mockFiles';

const meta: Meta<typeof FileGrid> = {
  title: 'Components/Features/Studio/CloudFileBrowser/FileGrid',
  component: FileGrid,
  tags: ['autodocs'],
  decorators: [
    (Story) => (
      <div className="max-w-layout-content bg-kodo-background p-4">
        <Story />
      </div>
    ),
  ],
  argTypes: {
    onFileClick: { action: 'fileClick' },
    onToggleSelect: { action: 'toggleSelect' },
  },
};

export default meta;

type Story = StoryObj<typeof FileGrid>;

export const Default: Story = {
  args: {
    files: mockCloudFiles,
    selectedIds: [],
    onFileClick: () => {},
    onToggleSelect: () => {},
  },
};

export const WithSelection: Story = {
  args: {
    ...Default.args,
    selectedIds: ['1', '4'],
  },
};

export const Loading: Story = {
  args: {
    ...Default.args,
    files: [],
    isLoading: true,
  },
};

export const Empty: Story = {
  args: {
    ...Default.args,
    files: [],
  },
};