refactor(components): replace Summary component with PostPreview

* rename component to PostPreview because Summary is an HTML element
and it could lead to confusion
* replace `title` and `titleLevel` with `heading` and `headingLvl`
because `title` is a native attribute
* rename `intro` prop to `excerpt`
* extract `cover` from `meta` prop
* rewrite meta type
* extract meta logic into a new component

1 files changed, 157 insertions, 0 deletions

diff --git a/src/components/organisms/post-preview/post-preview.stories.tsx b/src/components/organisms/post-preview/post-preview.stories.tsx
new file mode 100644
index 0000000..c22698f
--- /dev/null
+++ b/src/components/organisms/post-preview/post-preview.stories.tsx
@@ -0,0 +1,157 @@
+import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import NextImage from 'next/image';
+import { PostPreview } from './post-preview';
+
+/**
+ * PostPreview - Storybook Meta
+ */
+export default {
+  title: 'Organisms/PostPreview',
+  component: PostPreview,
+  argTypes: {
+    cover: {
+      description: 'The cover data.',
+      table: {
+        category: 'Options',
+      },
+      type: {
+        name: 'object',
+        required: false,
+        value: {},
+      },
+    },
+    excerpt: {
+      control: {
+        type: 'text',
+      },
+      description: 'The page excerpt.',
+      type: {
+        name: 'string',
+        required: true,
+      },
+    },
+    meta: {
+      description: 'The page metadata.',
+      type: {
+        name: 'object',
+        required: true,
+        value: {},
+      },
+    },
+    heading: {
+      control: {
+        type: 'text',
+      },
+      description: 'The page title',
+      type: {
+        name: 'string',
+        required: true,
+      },
+    },
+    headingLvl: {
+      control: {
+        type: 'number',
+        min: 1,
+        max: 6,
+      },
+      description: 'The page title level (hn)',
+      table: {
+        category: 'Options',
+        defaultValue: { summary: 2 },
+      },
+      type: {
+        name: 'number',
+        required: false,
+      },
+    },
+    url: {
+      control: {
+        type: 'text',
+      },
+      description: 'The page url.',
+      type: {
+        name: 'string',
+        required: true,
+      },
+    },
+  },
+} as ComponentMeta<typeof PostPreview>;
+
+const Template: ComponentStory<typeof PostPreview> = (args) => (
+  <PostPreview {...args} />
+);
+
+/**
+ * PostPreview Stories - Default
+ */
+export const Default = Template.bind({});
+Default.args = {
+  excerpt:
+    'Et vel amet minus. Inventore magnam et vel ea animi omnis qui. Dicta quos qui consequuntur aspernatur ullam non nam odio et. Incidunt fugit sequi. Neque sit vel tenetur libero sit aut quisquam est et. Nostrum autem et.',
+  heading: 'The post title',
+  url: '#post',
+};
+
+/**
+ * PostPreview Stories - WithCover
+ */
+export const WithCover = Template.bind({});
+WithCover.args = {
+  cover: (
+    <NextImage
+      alt=""
+      height={480}
+      src="https://picsum.photos/640/480"
+      width={640}
+    />
+  ),
+  excerpt:
+    'Et vel amet minus. Inventore magnam et vel ea animi omnis qui. Dicta quos qui consequuntur aspernatur ullam non nam odio et. Incidunt fugit sequi. Neque sit vel tenetur libero sit aut quisquam est et. Nostrum autem et.',
+  heading: 'The post title',
+  url: '#post',
+};
+
+/**
+ * PostPreview Stories - WithMeta
+ */
+export const WithMeta = Template.bind({});
+WithMeta.args = {
+  excerpt:
+    'Et vel amet minus. Inventore magnam et vel ea animi omnis qui. Dicta quos qui consequuntur aspernatur ullam non nam odio et. Incidunt fugit sequi. Neque sit vel tenetur libero sit aut quisquam est et. Nostrum autem et.',
+  heading: 'The post title',
+  meta: {
+    publicationDate: '06/11/2023',
+    thematics: [{ id: 1, name: 'Thematic 1', url: '#thematic' }],
+    wordsCount: 300,
+  },
+  url: '#post',
+};
+
+/**
+ * PostPreview Stories - WithCoverAndMeta
+ */
+export const WithCoverAndMeta = Template.bind({});
+WithCoverAndMeta.args = {
+  cover: (
+    <NextImage
+      alt=""
+      height={480}
+      src="https://picsum.photos/640/480"
+      width={640}
+    />
+  ),
+  excerpt:
+    'Et vel amet minus. Inventore magnam et vel ea animi omnis qui. Dicta quos qui consequuntur aspernatur ullam non nam odio et. Incidunt fugit sequi. Neque sit vel tenetur libero sit aut quisquam est et. Nostrum autem et.',
+  heading: 'The post title',
+  meta: {
+    publicationDate: '06/11/2023',
+    wordsCount: 300,
+    thematics: [{ id: 1, name: 'Thematic 1', url: '#thematic' }],
+    comments: {
+      count: 3,
+      postHeading: 'The post title',
+      url: '#comments',
+    },
+  },
+  url: '#post',
+};