diff --git a/components/calendar/CalendarLayout.tsx b/components/calendar/CalendarLayout.tsx index 2bf69d7b5..f306208a0 100644 --- a/components/calendar/CalendarLayout.tsx +++ b/components/calendar/CalendarLayout.tsx @@ -69,6 +69,7 @@ const CalendarLayout = ({ 'private', currentDate ); + const scheduleData = [...PublicSchedule, ...PrivateSchedule]; const handleNavigate = (date: Date) => { setCurrentDate(date); diff --git a/components/calendar/CustomCalendar.tsx b/components/calendar/CustomCalendar.tsx index 0fc9f8d26..33b436cfa 100644 --- a/components/calendar/CustomCalendar.tsx +++ b/components/calendar/CustomCalendar.tsx @@ -7,14 +7,17 @@ const CustomCalendar = styled.div` justify-content: center; align-items: center; position: relative; + overflow: auto; .rbc-calendar { width: 95%; - height: 100%; background-color: white; - padding: 2rem 1rem 1rem 1rem; - position: absolute; - overflow: auto; + padding: 1rem; + position: relative; + display: flex; + flex-direction: column; + height: 85vh; + overflow: hidden; } .rbc-header { @@ -35,6 +38,8 @@ const CustomCalendar = styled.div` } .rbc-month-view { + flex-grow: 1; + overflow-y: auto; border-left: none; border-right: none; border-top: 1px solid #e8ebfc; diff --git a/components/calendar/sidebar/CalendarSidebar.tsx b/components/calendar/sidebar/CalendarSidebar.tsx index 3b73daafb..394aa2444 100644 --- a/components/calendar/sidebar/CalendarSidebar.tsx +++ b/components/calendar/sidebar/CalendarSidebar.tsx @@ -60,6 +60,13 @@ const CalendarSidebar = ({ ...updateGroup, title: value!, }, + () => { + setUpdatedPrivateGroups((prev) => + prev.map((group) => + group.id === id ? { ...group, title: value || '' } : group + ) + ); + }, (error: string) => { setSnackbar({ toastName: 'post error', @@ -84,6 +91,13 @@ const CalendarSidebar = ({ ...updateGroup, backgroundColor: value!, }, + () => { + setUpdatedPrivateGroups((prev) => + prev.map((group) => + group.id === id ? { ...group, title: value || '' } : group + ) + ); + }, (error: string) => { setSnackbar({ toastName: 'post error', @@ -105,7 +119,12 @@ const CalendarSidebar = ({ 'DELETE', `custom/${id}`, deleteGroup, - (error: string) => { + () => { + setUpdatedPrivateGroups((prev) => + prev.filter((group) => group.id !== id) + ); + }, + () => { setSnackbar({ toastName: 'post error', severity: 'error', @@ -115,8 +134,8 @@ const CalendarSidebar = ({ } ); } - return prev.filter((group) => group.id !== id); } + return prev; }); }; diff --git a/pages/calendar/index.tsx b/pages/calendar/index.tsx index 6a9d72593..4b340f7e9 100644 --- a/pages/calendar/index.tsx +++ b/pages/calendar/index.tsx @@ -155,6 +155,9 @@ const CalendarPage: NextPage = () => { filterList: ScheduleFilter ) => { return schedules.filter((schedule) => { + if (schedule.status === 'DELETE') { + return false; + } const isPublicMatch = filterList.public.includes( schedule.classification! ); diff --git a/styles/calendar/Calendar.module.scss b/styles/calendar/Calendar.module.scss index f05cbdd80..bc2f40f8a 100644 --- a/styles/calendar/Calendar.module.scss +++ b/styles/calendar/Calendar.module.scss @@ -14,7 +14,7 @@ max-width: 100%; height: 100%; flex-direction: row; - // overflow: hidden; + // overflow: scroll; background-color: #f9f9fc; border-radius: 0.5rem; } @@ -23,7 +23,9 @@ position: relative; display: flex; width: 100%; - margin: 4rem 2rem 2.5rem; + // height: 100%; + margin: 1.5rem; + overflow: scroll; background-color: white; border-radius: 0.5rem; box-shadow: 0 0 10px #ebedf6; diff --git a/styles/calendar/modal/AddSelect.module.scss b/styles/calendar/modal/AddSelect.module.scss index 989eb9094..284e80c1e 100644 --- a/styles/calendar/modal/AddSelect.module.scss +++ b/styles/calendar/modal/AddSelect.module.scss @@ -5,6 +5,7 @@ z-index: 5; width: 120px; padding: 5px; + cursor: default; background-color: #f3f3ff; border-radius: 5px; box-shadow: rgba(99, 99, 99, 0.2) 0px 4px 4px 0px;