From fb86287634c5f5d6b994350fb3cb57ca7508ffab Mon Sep 17 00:00:00 2001
From: namdaeun <nde40345@gmail.com>
Date: Wed, 31 Jul 2024 21:34:25 +0900
Subject: [PATCH] =?UTF-8?q?#187=20refactor:=20=EB=B3=80=EC=88=98=EB=AA=85?=
 =?UTF-8?q?=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/page/archiving/index/ArchivingPage.tsx    | 23 +++++++++----------
 .../archiving/index/hook/common/useDate.ts    |  8 +++----
 2 files changed, 15 insertions(+), 16 deletions(-)

diff --git a/src/page/archiving/index/ArchivingPage.tsx b/src/page/archiving/index/ArchivingPage.tsx
index b38d86d2..0ab8d2ce 100644
--- a/src/page/archiving/index/ArchivingPage.tsx
+++ b/src/page/archiving/index/ArchivingPage.tsx
@@ -13,7 +13,7 @@ import { alignBlocks, getLastDayOfMonth } from '@/page/archiving/index/util/bloc
 
 import { useState } from 'react';
 
-import AddIc from '@/common/asset/svg/add_btn.svg?react';
+import Add from '@/common/asset/svg/add_btn.svg?react';
 import Button from '@/common/component/Button/Button';
 import Flex from '@/common/component/Flex/Flex';
 import Modal from '@/common/component/Modal/Modal';
@@ -54,16 +54,15 @@ const ArchivingPage = () => {
 
   const sideBarRef = useOutsideClick(handleClose, 'TimeBlock');
 
-  const { currentDate, currentYear, selectedMonth, setSelectedMonth, handlePrevYear, handleNextYear, endDay } =
-    useDate();
+  const { currentYear, selectedMonthType, setSelectedMonthType, handlePrevYear, handleNextYear, endDay } = useDate();
 
-  const selectedMonthNumber = parseInt(selectedMonth.split('월')[0]);
+  const selectedMonth = parseInt(selectedMonthType.split('월')[0]);
 
-  const { data } = useGetTimeBlockQuery(+teamId, 'executive', currentYear, selectedMonthNumber);
+  const { data } = useGetTimeBlockQuery(+teamId, 'executive', currentYear, selectedMonth);
 
   const [selectedBlock, setSelectedBlock] = useState<Block>();
   const timeBlocks: Block[] = data?.timeBlocks || [];
-  const blockFloors = alignBlocks(timeBlocks, endDay, selectedMonth, currentYear);
+  const blockFloors = alignBlocks(timeBlocks, endDay, selectedMonthType, currentYear);
 
   // 블록 생성 모달 관련 코드
   const { isOpen, openModal, closeModal, setCurrentContent, currentContent } = useModal();
@@ -91,8 +90,8 @@ const ArchivingPage = () => {
         <YearHeader handlePrevYear={handlePrevYear} handleNextYear={handleNextYear} currentYear={currentYear} />
         <Flex css={contentStyle}>
           <MonthHeader
-            currentMonth={selectedMonth}
-            onMonthClick={(month) => setSelectedMonth(month)}
+            currentMonth={selectedMonthType}
+            onMonthClick={(month) => setSelectedMonthType(month)}
             selectedBlock={selectedBlock}
           />
           <div id="block_area" css={daySectionStyle}>
@@ -104,14 +103,14 @@ const ArchivingPage = () => {
               const startMonth = blockStartDate.getUTCMonth() + 1;
               const endMonth = blockEndDate.getUTCMonth() + 1;
 
-              const firstDayOfMonth = new Date(Date.UTC(currentYear, selectedMonthNumber - 1, 1));
+              const firstDayOfMonth = new Date(Date.UTC(currentYear, selectedMonth - 1, 1));
               const lastDayOfMonth = getLastDayOfMonth(firstDayOfMonth);
 
-              if (blockStartDate.getFullYear() !== currentYear || startMonth !== selectedMonthNumber) {
+              if (blockStartDate.getFullYear() !== currentYear || startMonth !== selectedMonth) {
                 startDate = firstDayOfMonth;
               }
 
-              if (blockEndDate.getFullYear() !== currentYear || endMonth !== selectedMonthNumber) {
+              if (blockEndDate.getFullYear() !== currentYear || endMonth !== selectedMonth) {
                 endDate = lastDayOfMonth;
               }
 
@@ -137,7 +136,7 @@ const ArchivingPage = () => {
             variant="action"
             css={buttonStyle(selectedBlock)}
             onClick={() => openModal(<BlockModal onNext={handleNext} />)}>
-            <AddIc width={24} height={24} />
+            <Add width={24} height={24} />
             블록 생성
           </Button>
         </Flex>
diff --git a/src/page/archiving/index/hook/common/useDate.ts b/src/page/archiving/index/hook/common/useDate.ts
index 26e96d02..7ef3c2cb 100644
--- a/src/page/archiving/index/hook/common/useDate.ts
+++ b/src/page/archiving/index/hook/common/useDate.ts
@@ -8,8 +8,8 @@ export const useDate = () => {
   const currentDate = new Date();
 
   const [currentYear, setCurrentYear] = useState(currentDate.getFullYear());
-  const [selectedMonth, setSelectedMonth] = useState<MonthType>(`${currentDate.getMonth() + 1}월` as MonthType);
-  const dateOfMonth = getMonthDate(selectedMonth, currentYear);
+  const [selectedMonthType, setSelectedMonthType] = useState<MonthType>(`${currentDate.getMonth() + 1}월` as MonthType);
+  const dateOfMonth = getMonthDate(selectedMonthType, currentYear);
   const endDay = endOfMonth(dateOfMonth);
 
   const handlePrevYear = () => {
@@ -23,8 +23,8 @@ export const useDate = () => {
   return {
     currentDate,
     currentYear,
-    selectedMonth,
-    setSelectedMonth,
+    selectedMonthType,
+    setSelectedMonthType,
     handlePrevYear,
     handleNextYear,
     dateOfMonth,