Merge pull request #300 from Team-Ampersand/fix/calendar

🔀 calendar 날짜 표시 이슈
Team-Ampersand · Oct 25, 2024 · 5467206 · 5467206
2 parents 695371a + 7ed7207
commit 5467206
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 17 deletions.
diff --git a/.github/workflows/DOTORI_CI.yml b/.github/workflows/DOTORI_CI.yml
@@ -32,7 +32,7 @@ jobs:
         webhook: ${{ secrets.WEBHOOK_CI }}
         title: "🎉 Dotori Client CI 🐿"
         description: "CI success"
-        content: "<@${{ secrets.ID1 }}> <@${{ secrets.ID2 }}> <@${{ secrets.ID3 }}> <@${{ secrets.ID4 }}>\n확인부탁드려용~"
+        content: "<@${{ secrets.ID1 }}> <@${{ secrets.ID2 }}>\n확인부탁드려용~"
         username: DOTORI V2 CI bot
         url: "https://github.com/Team-Ampersand/Dotori-client-v2"
         color: 4CAF50

diff --git a/src/components/Common/atoms/Calendar/index.tsx b/src/components/Common/atoms/Calendar/index.tsx
@@ -30,7 +30,7 @@ const CalendarBox = ({
           if (!(value instanceof Date)) return;
           setSelectedDate?.(value);
         }}
-        onActiveStartDateChange={({value}) => {
+        onActiveStartDateChange={({ value }) => {
           if (!(value instanceof Date)) return;
           setSelectedDate?.(value);
         }}

diff --git a/src/components/Penalty/molecules/PenaltyRecordModal/index.tsx b/src/components/Penalty/molecules/PenaltyRecordModal/index.tsx
@@ -1,9 +1,7 @@
-import * as S from './style';
 import { ModalOverayWrapper } from 'components/Common/atoms/Wrappers/ModalOverayWrapper/style';
 import ModalHeader from 'components/Common/atoms/ModalHeader';
 import { XmarkIcon, CalendarIcon, PlusIcon } from 'assets/svg';
 import { useState } from 'react';
-import PenaltyRecordMenuModal from '../PenaltyRecordMenuModal';
 import { useRecoilState } from 'recoil';
 import {
   calendarModalState,
@@ -18,16 +16,22 @@ import { toast } from 'react-toastify';
 import { returnPenaltyValuesKorean } from 'assets/data/PenaltyValuesData';
 import { mutate } from 'swr';
 import { penaltyController } from 'utils/Libs/requestUrls';
-import CalendarBox from 'components/Common/atoms/Calendar';
 import { getDate } from 'utils/getDate';
+import dynamic from 'next/dynamic';
+import PenaltyRecordMenuModal from '../PenaltyRecordMenuModal';
+import * as S from './style';
+
+const Calendar = dynamic(() => import('components/Common/atoms/Calendar'), {
+  ssr: false,
+});
 
 const PenaltyRecordModal = () => {
   const role = getRole();
   const [penaltyStu, setPenaltyStu] = useRecoilState(penaltyStudent);
   const [penaltySelect, setPenaltySelect] = useRecoilState(penaltySelected);
   const [penaltyRecordInfoModal, setPenaltyRecordInfoModal] = useState(false);
   const [penaltyRecordModal, setPenaltyRecordModal] = useRecoilState(
-    penaltyRecordModalState
+    penaltyRecordModalState,
   );
   const [date] = useRecoilState(selectedDate);
   const [calendarModal, setCalenderModal] = useRecoilState(calendarModalState);
@@ -37,7 +41,7 @@ const PenaltyRecordModal = () => {
   const handleDelete = (
     state: string[],
     setState: (state: string[]) => void,
-    select: string
+    select: string,
   ) => {
     setState([...state.filter((i) => i !== select)]);
   };
@@ -51,7 +55,7 @@ const PenaltyRecordModal = () => {
       role,
       penaltyStu.map((i) => i.stuNum),
       penaltySelect,
-      `${year}-${month}-${day}`
+      `${year}-${month}-${day}`,
     ).then(() => {
       setPenaltyRecordModal(false);
       setPenaltySelect([]);
@@ -88,7 +92,7 @@ const PenaltyRecordModal = () => {
                       setCalenderModal(false);
                     }}
                   >
-                    <CalendarBox setModal={setCalenderModal} />
+                    <Calendar setModal={setCalenderModal} />
                   </ModalOverayWrapper>
                 )}
               </>

diff --git a/src/components/Song/organisms/SongModal/index.tsx b/src/components/Song/organisms/SongModal/index.tsx
@@ -5,16 +5,19 @@ import {
   filterModal,
 } from 'recoilAtoms/recoilAtomContainer';
 import { ResponseOverayWrapper } from 'components/Common/atoms/Wrappers/ModalOverayWrapper/style';
-
-import CalendarBox from 'components/Common/atoms/Calendar';
 import SongForm from 'components/Song/molecules/SongForm';
+import dynamic from 'next/dynamic';
 
 type SongModalProps = {
   selectedDate: Date;
   setSelectedDate: React.Dispatch<React.SetStateAction<Date>>;
   setNoticeModal: React.Dispatch<React.SetStateAction<boolean>>;
 };
 
+const Calendar = dynamic(() => import('components/Common/atoms/Calendar'), {
+  ssr: false,
+});
+
 const SongModal = ({
   selectedDate,
   setSelectedDate,
@@ -39,7 +42,7 @@ const SongModal = ({
       <div onClick={(e) => e.stopPropagation()}>
         {modal &&
           (calendarModal ? (
-            <CalendarBox
+            <Calendar
               selectedDate={selectedDate}
               setSelectedDate={setSelectedDate}
             />

diff --git a/src/components/Song/organisms/SongRightLayer/index.tsx b/src/components/Song/organisms/SongRightLayer/index.tsx
@@ -1,7 +1,11 @@
-import CalendarBox from 'components/Common/atoms/Calendar';
 import SongForm from 'components/Song/molecules/SongForm';
+import dynamic from 'next/dynamic';
 import * as S from './style';
 
+const Calendar = dynamic(() => import('components/Common/atoms/Calendar'), {
+  ssr: false,
+});
+
 interface SongRightLayerProps {
   selectedDate: Date;
   setSelectedDate: React.Dispatch<React.SetStateAction<Date>>;
@@ -16,10 +20,7 @@ const SongRightLayer = ({
   return (
     <S.Layer>
       <SongForm selectedDate={selectedDate} setNoticeModal={setNoticeModal} />
-      <CalendarBox
-        selectedDate={selectedDate}
-        setSelectedDate={setSelectedDate}
-      />
+      <Calendar selectedDate={selectedDate} setSelectedDate={setSelectedDate} />
     </S.Layer>
   );
 };