fix: add stories for Projects
I noticed that I missed stories for one or two projects in Storybook. Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>
This commit is contained in:
André Jaenisch
parent
769e3bcab3
commit
91f6e24280
3 changed files with 274 additions and 6 deletions
|
|
@ -22,10 +22,6 @@ You should have received a copy of the GNU Affero General Public License along w
|
|||
import History from '../molecules/History.svelte';
|
||||
import Project from '../molecules/Project.svelte';
|
||||
|
||||
const i18n = {
|
||||
heading: 'page.profile.heading'
|
||||
};
|
||||
|
||||
/**
|
||||
* Translation keys.
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -23,4 +23,140 @@ const meta = {
|
|||
export default meta;
|
||||
type Story = StoryObj<typeof meta>;
|
||||
|
||||
export const Plain: Story = {};
|
||||
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'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -23,4 +23,140 @@ const meta = {
|
|||
export default meta;
|
||||
type Story = StoryObj<typeof meta>;
|
||||
|
||||
export const Plain: Story = {};
|
||||
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'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in a new issue