import type { Meta, StoryObj } from '@storybook/angular';
import type { UploadStatus } from '@shared/upload/upload.machine';
import { DocumentChipComponent } from './document-chip.component';

const meta: Meta<DocumentChipComponent> = {
  title: 'Design System/Atoms/DocumentChip',
  component: DocumentChipComponent,
  render: (args) => ({
    props: args,
    // The .file/.file-name/.file-meta styling only applies inside ul.file-list > .file-container.
    template: `<ul class="file-list"><li class="file-container"><app-document-chip [fileName]="fileName" [status]="status" [fileSizeMb]="fileSizeMb" [previewUrl]="previewUrl" /></li></ul>`,
  }),
};
export default meta;
type Story = StoryObj<DocumentChipComponent>;

export const Complete: Story = {
  args: {
    fileName: 'diploma.pdf',
    fileSizeMb: 1.2,
    status: { type: 'complete', documentId: 'doc-1' } as UploadStatus,
  },
};

export const WithPreview: Story = {
  args: {
    fileName: 'diploma.pdf',
    fileSizeMb: 1.2,
    status: { type: 'complete', documentId: 'doc-1' } as UploadStatus,
    previewUrl: '/api/v1/uploads/doc-1/content',
  },
};

export const Failed: Story = {
  args: {
    fileName: 'diploma.pdf',
    fileSizeMb: 1.2,
    status: { type: 'failed', reason: 'Netwerkfout' } as UploadStatus,
  },
};
