1 files changed, 33 insertions, 79 deletions
diff --git a/src/components/organisms/comments-list/comments-list.stories.tsx b/src/components/organisms/comments-list/comments-list.stories.ts
index afebfb7..24c05cb 100644
--- a/src/components/organisms/comments-list/comments-list.stories.tsx
+++ b/src/components/organisms/comments-list/comments-list.stories.ts
@@ -1,61 +1,21 @@
-import type { ComponentMeta, ComponentStory } from '@storybook/react';
+import type { Meta, StoryObj } from '@storybook/react';
+import type { CommentFormSubmit } from '../forms';
 import { type CommentData, CommentsList } from './comments-list';
 
-const saveComment = () => undefined;
-
-/**
- * CommentsList - Storybook Meta
- */
-export default {
-  title: 'Organisms/CommentsList',
+const meta = {
   component: CommentsList,
-  argTypes: {
-    comments: {
-      control: {
-        type: null,
-      },
-      description: 'An array of comments.',
-      type: {
-        name: 'object',
-        required: true,
-        value: {},
-      },
-    },
-    depth: {
-      control: {
-        type: 'number',
-        min: 0,
-        max: 4,
-      },
-      description: 'The maximum depth. Use `0` to hide replies.',
-      table: {
-        category: 'Options',
-        defaultValue: { summary: 0 },
-      },
-      type: {
-        name: 'number',
-        required: false,
-      },
-    },
-    onSubmit: {
-      control: {
-        type: null,
-      },
-      description: 'A callback function to save the comment form data.',
-      table: {
-        category: 'Events',
-      },
-      type: {
-        name: 'function',
-        required: false,
-      },
-    },
-  },
-} as ComponentMeta<typeof CommentsList>;
+  title: 'Organisms/CommentsList',
+} satisfies Meta<typeof CommentsList>;
+
+export default meta;
+
+type Story = StoryObj<typeof meta>;
 
-const Template: ComponentStory<typeof CommentsList> = (args) => (
-  <CommentsList {...args} />
-);
+const saveComment: CommentFormSubmit = () => {
+  console.log('Comment saved!');
+
+  return undefined;
+};
 
 const comments = [
   {
@@ -156,33 +116,27 @@ const comments = [
   },
 ] satisfies CommentData[];
 
-/**
- * Layout Stories - Without nested comments
- */
-export const WithoutReplies = Template.bind({});
-WithoutReplies.args = {
-  comments,
-  depth: 0,
-  onSubmit: saveComment,
+export const WithoutReplies: Story = {
+  args: {
+    comments,
+    depth: 0,
+    onSubmit: saveComment,
+  },
 };
 
-/**
- * Layout Stories - With nested comments
- */
-export const WithReplies = Template.bind({});
-WithReplies.args = {
-  comments,
-  depth: 2,
-  onSubmit: saveComment,
+export const WithReplies: Story = {
+  args: {
+    comments,
+    depth: 2,
+    onSubmit: saveComment,
+  },
 };
 
-/**
- * Layout Stories - With nested comments and forbidden replies
- */
-export const WithForbiddenReplies = Template.bind({});
-WithForbiddenReplies.args = {
-  areRepliesForbidden: true,
-  comments,
-  depth: 3,
-  onSubmit: saveComment,
+export const WithForbiddenReplies: Story = {
+  args: {
+    areRepliesForbidden: true,
+    comments,
+    depth: 3,
+    onSubmit: saveComment,
+  },
 };