aljaz/landscape-template
1
0
Fork 0
mirror of https://github.com/aljazceru/landscape-template.git synced 2026-01-09 01:14:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

update: build story files for draftsContainer & storyForm

Browse Source
This commit is contained in:
MTG2000
2022-07-14 12:02:21 +03:00
parent 7cd6fc749c
commit f045ab8bf4
6 changed files with 58 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/features/Posts/pages/CreatePostPage/Components/DraftsContainer/DraftContainer.stories.tsx Normal file
View File

@@ -0,0 +1,30 @@
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { Post_Type } from 'src/graphql';
import { WithModals, WrapForm } from 'src/utils/storybook/decorators';
import { IStoryFormInputs } from '../../CreateStoryPage/CreateStoryPage';
import DraftsContainer from './DraftsContainer';
export default {
title: 'Posts/Create Post Page/Drafts Container',
component: DraftsContainer,
argTypes: {
backgroundColor: { control: 'color' },
},
decorators: [WithModals, WrapForm<IStoryFormInputs>({
defaultValues: {
tags: [],
cover_image: [],
}
})]
} as ComponentMeta<typeof DraftsContainer>;
const Template: ComponentStory<typeof DraftsContainer> = (args) => <div className="max-w-[1000px]"><DraftsContainer {...args as any} ></DraftsContainer></div>
export const Default = Template.bind({});
Default.args = {
type: Post_Type.Story
}

4
src/features/Posts/pages/CreatePostPage/Components/DraftsContainer/DraftsContainer.tsx
View File

@@ -94,7 +94,7 @@ export default function DraftsContainer({ type, onDraftLoad }: Props) {
<>
{(!myDraftsQuery.loading && myDraftsQuery.data?.getMyDrafts && myDraftsQuery.data.getMyDrafts.length > 0) &&
<div className="border-2 border-gray-200 rounded-16 p-16">
<div className="bg-white border-2 border-gray-200 rounded-16 p-16">
<p className="text-body2 font-bolder mb-16">Saved Drafts</p>
<ul className=''>
{myDraftsQuery.data.getMyDrafts.map(draft =>
@@ -107,7 +107,7 @@ export default function DraftsContainer({ type, onDraftLoad }: Props) {
{draft.title}
</p>
<div className="flex gap-4 text-body5">
<p className="text-gray-400">Last edited {getDateDifference(draft.updatedAt)} ago</p>
<p className="text-gray-400">Last edited {getDateDifference(draft.updatedAt, { dense: true })} ago</p>
<Button size='sm' color='none' className='text-blue-500 !p-0' onClick={() => deleteDraft(draft.id)}>Delete draft</Button>
</div>
</li>)}

10
src/features/Posts/pages/CreatePostPage/Components/StoryForm/StoryForm.stories.tsx
View File

@@ -1,5 +1,6 @@
import { ComponentStory, ComponentMeta } from '@storybook/react';
import { WithModals } from 'src/utils/storybook/decorators';
import { WithModals, WrapForm } from 'src/utils/storybook/decorators';
import { IStoryFormInputs } from '../../CreateStoryPage/CreateStoryPage';
import StoryForm from './StoryForm';
@@ -9,7 +10,12 @@ export default {
argTypes: {
backgroundColor: { control: 'color' },
},
decorators: [WithModals]
decorators: [WithModals, WrapForm<IStoryFormInputs>({
defaultValues: {
tags: [],
cover_image: [],
}
})]
} as ComponentMeta<typeof StoryForm>;