Anvil/stories/templates/Projects.stories.ts

/* Stories for Projects template.
 * 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 type { Meta, StoryObj } from '@storybook/svelte';

import Projects from '$lib/components/templates/Projects.svelte';

const meta = {
	title: 'Templates/Projects',
	component: Projects,
	tags: ['autodocs']
} satisfies Meta<Projects>;

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

export const NoProjects: Story = {
	args: {
		data: {
			projects: []
		}
	}
};

export const SingleProject: Story = {
	args: {
		data: {
			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: {
		data: {
			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'
						}
					]
				}
			]
		}
	}
};