From ad2025368ae4616db869e2ff36996063a0dc911e Mon Sep 17 00:00:00 2001
From: hozzijeong <ghwls0905@naver.com>
Date: Wed, 26 Jul 2023 21:25:17 +0900
Subject: [PATCH] =?UTF-8?q?test:=20CardBox=20=EC=8A=A4=ED=86=A0=EB=A6=AC?=
 =?UTF-8?q?=20=EC=9E=91=EC=84=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Reminder/CardBox/CardBox.stories.tsx      | 45 +++++++++++++++++++
 .../src/components/Reminder/CardBox/index.tsx |  6 +--
 2 files changed, 48 insertions(+), 3 deletions(-)
 create mode 100644 frontend/src/components/Reminder/CardBox/CardBox.stories.tsx

diff --git a/frontend/src/components/Reminder/CardBox/CardBox.stories.tsx b/frontend/src/components/Reminder/CardBox/CardBox.stories.tsx
new file mode 100644
index 000000000..e9c661d1a
--- /dev/null
+++ b/frontend/src/components/Reminder/CardBox/CardBox.stories.tsx
@@ -0,0 +1,45 @@
+import { ReminderExtendType } from 'types/api/reminder';
+import type { Meta, StoryObj } from '@storybook/react';
+import CardBox from '.';
+
+const meta: Meta<typeof CardBox> = {
+  component: CardBox,
+};
+
+export default meta;
+
+type Story = StoryObj<typeof CardBox>;
+
+export const NotHasDate: Story = {
+  render: () => {
+    const mockData: ReminderExtendType = {
+      petPlantId: 1,
+      image: 'https://images.unsplash.com/photo-1598983062491-5934ce558814',
+      nickName: '참새나무',
+      dictionaryPlantName: '알로카시아',
+      dDay: 0,
+      nextWaterDate: '2023-07-26',
+      date: '26',
+      status: 'exist',
+    };
+
+    return <CardBox data={mockData} notDate={true} />;
+  },
+};
+
+export const HasDate: Story = {
+  render: () => {
+    const mockData: ReminderExtendType = {
+      petPlantId: 1,
+      image: 'https://images.unsplash.com/photo-1598983062491-5934ce558814',
+      nickName: '참새나무',
+      dictionaryPlantName: '알로카시아',
+      dDay: 0,
+      nextWaterDate: '2023-07-26',
+      date: '26',
+      status: 'exist',
+    };
+
+    return <CardBox data={mockData} notDate={false} />;
+  },
+};
diff --git a/frontend/src/components/Reminder/CardBox/index.tsx b/frontend/src/components/Reminder/CardBox/index.tsx
index 3336074ed..a5aad2fe9 100644
--- a/frontend/src/components/Reminder/CardBox/index.tsx
+++ b/frontend/src/components/Reminder/CardBox/index.tsx
@@ -7,10 +7,10 @@ import ReminderCard from '../Card';
 
 interface CardBoxProps {
   data: ReminderExtendType;
-  hasDate: boolean;
+  notDate: boolean;
 }
 
-const CardBox = ({ data, hasDate }: CardBoxProps) => {
+const CardBox = ({ data, notDate }: CardBoxProps) => {
   const context = useContext(ReminderContext);
 
   const waterHandler = () => {
@@ -27,7 +27,7 @@ const CardBox = ({ data, hasDate }: CardBoxProps) => {
   return (
     <ReminderCardBox key={data.petPlantId}>
       <InfoBox>
-        {!hasDate && <DateLabel>{data.date}</DateLabel>}
+        {!notDate && <DateLabel>{data.date}</DateLabel>}
         <CheckButton type="button" onClick={waterHandler} />
       </InfoBox>
       <ReminderCard data={data} />