From f8fc300af2a47aacd7231b3397c64a7955ca0fff Mon Sep 17 00:00:00 2001
From: SamTheKorean <bumsuyi@gmail.com>
Date: Tue, 3 Dec 2024 23:32:54 -0500
Subject: [PATCH] update : adjust stories and test with new props

---
 src/components/Table/Table.stories.tsx | 98 ++++++++++++++++++++++++--
 src/components/Table/Table.test.tsx    | 12 ++--
 2 files changed, 98 insertions(+), 12 deletions(-)

diff --git a/src/components/Table/Table.stories.tsx b/src/components/Table/Table.stories.tsx
index 8a30c657..8b170927 100644
--- a/src/components/Table/Table.stories.tsx
+++ b/src/components/Table/Table.stories.tsx
@@ -1,39 +1,127 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import Table from "./Table";
 
+// Define meta for Table component with default args
 const meta: Meta<typeof Table> = {
   component: Table,
+  args: {
+    problems: [
+      {
+        id: 1,
+        title: "Two Sum",
+        difficulty: "Easy",
+      },
+      {
+        id: 128,
+        title: "Longest Consecutive Sequence",
+        difficulty: "Med.",
+      },
+      {
+        id: 133,
+        title: "Clone Graph",
+        difficulty: "Med.",
+      },
+      {
+        id: 295,
+        title: "Find Median From Data Stream",
+        difficulty: "Hard",
+      },
+    ],
+    solvedProblems: [
+      {
+        id: 1,
+        title: "Two Sum",
+        difficulty: "Easy",
+      },
+      {
+        id: 133,
+        title: "Clone Graph",
+        difficulty: "Med.",
+      },
+    ], // Default solved problems for this example
+  },
 };
 
 export default meta;
 
-export const Default: StoryObj<typeof Table> = {
+// Default story (uses default args)
+export const Default: StoryObj<typeof Table> = {};
+
+// Story for all problems marked as solved
+export const AllCompleted: StoryObj<typeof Table> = {
+  args: {
+    problems: [
+      {
+        id: 1,
+        title: "Two Sum",
+        difficulty: "Easy",
+      },
+      {
+        id: 128,
+        title: "Longest Consecutive Sequence",
+        difficulty: "Med.",
+      },
+      {
+        id: 133,
+        title: "Clone Graph",
+        difficulty: "Med.",
+      },
+      {
+        id: 295,
+        title: "Find Median From Data Stream",
+        difficulty: "Hard",
+      },
+    ],
+    solvedProblems: [
+      {
+        id: 1,
+        title: "Two Sum",
+        difficulty: "Easy",
+      },
+      {
+        id: 128,
+        title: "Longest Consecutive Sequence",
+        difficulty: "Med.",
+      },
+      {
+        id: 133,
+        title: "Clone Graph",
+        difficulty: "Med.",
+      },
+      {
+        id: 295,
+        title: "Find Median From Data Stream",
+        difficulty: "Hard",
+      },
+    ], // All problems are solved
+  },
+};
+
+// Story for no problems solved
+export const NoCompletedProblems: StoryObj<typeof Table> = {
   args: {
     problems: [
       {
         id: 1,
         title: "Two Sum",
         difficulty: "Easy",
-        completed: true,
       },
       {
         id: 128,
         title: "Longest Consecutive Sequence",
         difficulty: "Med.",
-        completed: false,
       },
       {
         id: 133,
         title: "Clone Graph",
         difficulty: "Med.",
-        completed: true,
       },
       {
         id: 295,
         title: "Find Median From Data Stream",
         difficulty: "Hard",
-        completed: false,
       },
     ],
+    solvedProblems: [], // No problems solved
   },
 };
diff --git a/src/components/Table/Table.test.tsx b/src/components/Table/Table.test.tsx
index fcbf0ead..14e0dbd8 100644
--- a/src/components/Table/Table.test.tsx
+++ b/src/components/Table/Table.test.tsx
@@ -7,11 +7,10 @@ const problems = [
     id: 128,
     title: "Longest Consecutive Sequence",
     difficulty: "Med.",
-    completed: true,
   },
-  { id: 1, title: "Two Sum", difficulty: "Easy", completed: true },
-  { id: 257, title: "Binary Tree Paths", difficulty: "Easy", completed: false },
-  { id: 133, title: "Clone Graph", difficulty: "Med.", completed: true },
+  { id: 1, title: "Two Sum", difficulty: "Easy" },
+  { id: 257, title: "Binary Tree Paths", difficulty: "Easy" },
+  { id: 133, title: "Clone Graph", difficulty: "Med." },
 ];
 
 const solvedProblems = [
@@ -19,10 +18,9 @@ const solvedProblems = [
     id: 128,
     title: "Longest Consecutive Sequence",
     difficulty: "Med.",
-    completed: true,
   },
-  { id: 257, title: "Binary Tree Paths", difficulty: "Easy", completed: false },
-  { id: 133, title: "Clone Graph", difficulty: "Med.", completed: true },
+  { id: 257, title: "Binary Tree Paths", difficulty: "Easy" },
+  { id: 133, title: "Clone Graph", difficulty: "Med." },
 ];
 
 test("renders table headers", () => {