Anvil/stories/organisms/FileTable.stories.ts

/* Stories for FileTable organism.
 * Copyright (C) 2024 André Jaenisch
 * SPDX-FileCopyrightText: 2024 André Jaenisch
 * SPDX-License-Identifier: AGPL-3.0-or-later
 *
 * This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */

import { withActions } from '@storybook/addon-actions/decorator';
import { withLinks } from '@storybook/addon-links';
import type { Meta, StoryObj } from '@storybook/svelte';

import FileTable from '$lib/components/organisms/FileTable.svelte';

const meta = {
	title: 'Organisms/FileTable',
	component: FileTable,
	tags: ['autodocs'],
	args: {
		sb: 'Templates/Profile'
	},
	argTypes: {
		onSubmit: { action: 'submit' },
		sb: { control: 'radio', options: ['Templates/Profile'] }
	},
	decorators: [withActions, withLinks]
} satisfies Meta<FileTable>;

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

export const NoProjects: Story = {
	args: {
		i18n: {
			heading: {
				lastUpdated: 'page.projects.table.heading.last_updated',
				name: 'page.projects.table.heading.name'
			},
			table: {
				updated: 'page.projects.file_table.updated'
			}
		},
		projects: []
	}
};

export const SingleProject: Story = {
	args: {
		i18n: {
			heading: {
				lastUpdated: 'page.projects.table.heading.last_updated',
				name: 'page.projects.table.heading.name'
			},
			table: {
				updated: 'page.projects.file_table.updated'
			}
		},
		projects: [
			{
				name: 'Project A',
				description:
					'This software project is a web-based application that will allow users to book appointments online.',
				avatar: 'https://example.com',
				// Date back three months
				lastUpdated: new Date(Date.now() - 3 * 30 * 24 * 60 * 60 * 1000),
				members: [
					{
						name: 'Person A',
						avatar: 'https://example.com',
						slug: 'a'
					},
					{
						name: 'Person B',
						avatar: 'https://example.com',
						slug: 'b'
					},
					{
						name: 'Person C',
						avatar: 'https://example.com',
						slug: 'c'
					}
				],
				tags: [
					{
						name: 'ActivityPub',
						link: '/tag/ActivityPub'
					},
					{
						name: 'css',
						link: '/tag/css'
					},
					{
						name: 'guile',
						link: '/tag/guile'
					}
				]
			}
		]
	}
};

export const MultipleProjects: Story = {
	args: {
		i18n: {
			heading: {
				lastUpdated: 'page.projects.table.heading.last_updated',
				name: 'page.projects.table.heading.name'
			},
			table: {
				updated: 'page.projects.file_table.updated'
			}
		},
		projects: [
			{
				name: 'Project A',
				description:
					'This software project is a web-based application that will allow users to book appointments online.',
				avatar: 'https://example.com',
				// Date back three months
				lastUpdated: new Date(Date.now() - 3 * 30 * 24 * 60 * 60 * 1000),
				members: [
					{
						name: 'Person A',
						avatar: 'https://example.com',
						slug: 'a'
					},
					{
						name: 'Person B',
						avatar: 'https://example.com',
						slug: 'b'
					},
					{
						name: 'Person C',
						avatar: 'https://example.com',
						slug: 'c'
					}
				],
				tags: [
					{
						name: 'ActivityPub',
						link: '/tag/ActivityPub'
					},
					{
						name: 'css',
						link: '/tag/css'
					},
					{
						name: 'guile',
						link: '/tag/guile'
					}
				]
			},
			{
				name: 'Project B',
				description:
					'This software project is a web-based application that will allow users to book appointments online.',
				avatar: 'https://example.com',
				// Date back three months
				lastUpdated: new Date(Date.now() - 3 * 30 * 24 * 60 * 60 * 1000),
				members: [
					{
						name: 'Person A',
						avatar: 'https://example.com',
						slug: 'a'
					},
					{
						name: 'Person B',
						avatar: 'https://example.com',
						slug: 'b'
					}
				],
				tags: [
					{
						name: 'ActivityPub',
						link: '/tag/ActivityPub'
					},
					{
						name: 'css',
						link: '/tag/css'
					},
					{
						name: 'guile',
						link: '/tag/guile'
					}
				]
			}
		]
	}
};