✨ #79 플랜수정 삭제 조건 변경

Read-bird · Jan 21, 2024 · b15127e · b15127e
2 parents 534effd + 05245dc
commit b15127e
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 14 deletions.
diff --git a/src/components/templates/HomeTemplate/Plan/Dots/Dots.tsx b/src/components/templates/HomeTemplate/Plan/Dots/Dots.tsx
@@ -7,9 +7,9 @@ import { PlanModalTemplate } from '@components/templates/PlanModalTemplate';
 import { colors } from '@style/global-style';
 import { Alert } from '@utils/Alert';
 import { convertError } from '@utils/errors';
+import { isPastDate } from '@utils/function';
 import { AxiosError } from 'axios';
-import dayjs from 'dayjs';
-import { MouseEvent, useCallback, useMemo, useState } from 'react';
+import { MouseEvent, useCallback, useState } from 'react';
 import { useFormContext } from 'react-hook-form';
 import { useDispatch } from 'react-redux';
 import styled from 'styled-components';
@@ -24,7 +24,6 @@ type TProps = {
 
 export const Dots = ({ planId, userId, selectDate, isProgress, endDate }: TProps) => {
   const [isOpen, setOpen] = useState<number | null>(null);
-  const isSame = useMemo(() => dayjs(selectDate).isSame(new Date(), 'date'), [selectDate]);
   const [isEditModal, setIsEditModal] = useState(false);
   const dispatch = useDispatch();
   const { setValue } = useFormContext<TRegisterFormValue>();
@@ -36,12 +35,9 @@ export const Dots = ({ planId, userId, selectDate, isProgress, endDate }: TProps
   const handleClickOpenModal = useCallback(
     (e: MouseEvent<SVGElement>) => {
       e.stopPropagation();
-
-      if (isSame && isProgress) {
-        setOpen((prev) => (prev === planId ? null : planId));
-      }
+      setOpen((prev) => (prev === planId ? null : planId));
     },
-    [planId, isSame, isProgress]
+    [planId]
   );
 
   const handleClickOpenEdit = useCallback(() => {
@@ -96,12 +92,14 @@ export const Dots = ({ planId, userId, selectDate, isProgress, endDate }: TProps
         iconKey="dots"
         size={25}
         color={colors.darkGray}
-        cursor={isSame && isProgress ? 'pointer' : 'default'}
+        cursor={'pointer'}
         onClick={handleClickOpenModal}
       />
       <MiniModal className="dots" isOpen={isOpen === planId} handleClick={handleClose}>
         <Button onClick={handleClickRemove(planId, userId)}>삭제</Button>
-        <Button onClick={handleClickOpenEdit}>수정</Button>
+        {(isProgress || isPastDate(new Date(), selectDate)) && (
+          <Button onClick={handleClickOpenEdit}>수정</Button>
+        )}
       </MiniModal>
 
       <PlanModalTemplate

diff --git a/src/components/templates/HomeTemplate/Plan/Plan.tsx b/src/components/templates/HomeTemplate/Plan/Plan.tsx
@@ -7,7 +7,7 @@ import { Spacing } from '@components/common/Spacing';
 import { Dday } from '@components/templates/HomeTemplate/Plan/Dday';
 import { Dots } from '@components/templates/HomeTemplate/Plan/Dots';
 import { Stamp } from '@components/templates/HomeTemplate/Plan/Stamp';
-import dayjs from 'dayjs';
+import { isSameDate } from '@utils/function';
 import { useCallback } from 'react';
 import { FormProvider, useForm } from 'react-hook-form';
 import { useDispatch, useSelector } from 'react-redux';
@@ -26,6 +26,7 @@ export const Plan = (props: TProps) => {
     endDate,
     startDate,
     recordStatus,
+    planStatus,
     author,
     publisher
   } = props;
@@ -98,7 +99,7 @@ export const Plan = (props: TProps) => {
             planId={planId}
             userId={userInfo?.id ?? null}
             selectDate={currentDate}
-            isProgress={recordStatus === ERecordStatus.inProgress}
+            isProgress={planStatus === ERecordStatus.inProgress}
             endDate={endDate}
           />
         </FormProvider>
@@ -108,7 +109,7 @@ export const Plan = (props: TProps) => {
           selectDate={currentDate}
           maxPage={Number(currentPage) + Number(target)}
           currentPage={currentPage}
-          dday={dayjs(endDate).format('YYYY-MM-DD') === dayjs().format('YYYY-MM-DD')}
+          dday={isSameDate(new Date(), endDate)}
           openSuccess={openSuccess}
           openFailed={openFailed}
         />

diff --git a/src/utils/function.ts b/src/utils/function.ts
@@ -64,7 +64,7 @@ export const debounce = (callback: (...args: any[]) => void, time: number) => {
 };
 
 // 날짜가 동일한지 확인
-export const isSameDate = (currentDate: string, compareDate: string) => {
+export const isSameDate = (currentDate: string | Date, compareDate: string | Date) => {
   const current = new Date(currentDate);
   const compare = new Date(compareDate);
 
@@ -83,6 +83,7 @@ export const isSameDate = (currentDate: string, compareDate: string) => {
   return true;
 };
 
+// 현재 날짜가 비교할 날짜보다 작은가?
 export const isPastDate = (currentDate: string | Date, compareDate: string | Date) => {
   const current = new Date(currentDate);
   const compare = new Date(compareDate);