From 7517e138c7006400b7296cf0b9d7e6b27aa614e6 Mon Sep 17 00:00:00 2001 From: ChoiSangwon Date: Sat, 2 Dec 2023 21:15:00 +0900 Subject: [PATCH] =?UTF-8?q?feat=20:=20=20build=EC=8B=9C=20=EC=98=A4?= =?UTF-8?q?=EB=A5=98=EB=82=98=EB=8A=94=20=EB=B6=80=EB=B6=84=20=EB=B3=80?= =?UTF-8?q?=EA=B2=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/src/atoms/toastState.ts | 8 ++++---- .../components/AddTemplate/CompanionsRoom.tsx | 4 ++-- .../AddTemplate/CompanionsSelect.tsx | 2 +- .../components/AddTemplate/NameTimeType.tsx | 3 +-- .../AddTemplate/TemplateTimeTable.tsx | 6 +++--- .../ConfirmReservationModal.stories.tsx | 1 + .../SelectSeminarRoomModal.stories.tsx | 1 + .../SeletSeminarRoomModal/index.tsx | 4 ++-- client/src/components/Home/MateList/index.tsx | 2 +- .../components/Home/ReserveButtons/index.tsx | 5 +++-- client/src/components/Modal/Portal/index.tsx | 14 +++++++------- .../HomeTemplate/HomeTemplate.stories.tsx | 8 ++++++-- .../TemplatePage/Template.stories.tsx | 5 +++-- client/src/components/Timetable/index.tsx | 1 + client/src/constants/seminaAvailablePeople.ts | 6 +++++- client/src/hooks/useTransition.tsx | 2 +- client/src/pages/create/timetable.tsx | 18 ++++-------------- client/src/utils/func/templateTimeConverter.ts | 2 +- 18 files changed, 47 insertions(+), 45 deletions(-) diff --git a/client/src/atoms/toastState.ts b/client/src/atoms/toastState.ts index 55af8ad..921c996 100644 --- a/client/src/atoms/toastState.ts +++ b/client/src/atoms/toastState.ts @@ -1,6 +1,6 @@ -import { atom } from "jotai"; +import { atom } from 'jotai'; -export type ToastTheme = "negative" | "positive"; +export type ToastTheme = 'negative' | 'positive'; interface ToastType { isOpen: boolean; @@ -10,8 +10,8 @@ interface ToastType { export const toastState = atom({ isOpen: false, - theme: "positive", - content: "", + theme: 'positive', + content: '', }); export const toastTransitionState = atom(false); diff --git a/client/src/components/AddTemplate/CompanionsRoom.tsx b/client/src/components/AddTemplate/CompanionsRoom.tsx index 9057711..704d62a 100644 --- a/client/src/components/AddTemplate/CompanionsRoom.tsx +++ b/client/src/components/AddTemplate/CompanionsRoom.tsx @@ -8,7 +8,7 @@ import Link from 'next/link'; import { TYPO } from '@/styles/typo'; import { COLORS } from '@/styles/colors'; import { ItemButton } from '../Buttons'; -import { useAtom, useSetAtom } from 'jotai'; +import { useAtomValue, useSetAtom } from 'jotai'; import { MyTemplate } from '@/@types/MyTemplate'; import { templateAtom } from '.'; @@ -84,7 +84,7 @@ const CompanionsRoom = () => { '7번', ]; - const [template, setTemplate] = useAtom(templateAtom); + const template = useAtomValue(templateAtom); const setAtomTemplate = useSetAtom(templateAtom); const handleOnClickNext = () => { diff --git a/client/src/components/AddTemplate/CompanionsSelect.tsx b/client/src/components/AddTemplate/CompanionsSelect.tsx index a4684de..1c2a585 100644 --- a/client/src/components/AddTemplate/CompanionsSelect.tsx +++ b/client/src/components/AddTemplate/CompanionsSelect.tsx @@ -17,7 +17,7 @@ const CompanionsSelect = () => { const { selectedList, handleSelect } = useMate(); const router = useRouter(); - const [template, setTemplate] = useAtom(templateAtom); + const [template] = useAtom(templateAtom); const setAtomTemplate = useSetAtom(templateAtom); const hanldeOnClickNext = () => { diff --git a/client/src/components/AddTemplate/NameTimeType.tsx b/client/src/components/AddTemplate/NameTimeType.tsx index 0bb218e..f1da72b 100644 --- a/client/src/components/AddTemplate/NameTimeType.tsx +++ b/client/src/components/AddTemplate/NameTimeType.tsx @@ -7,7 +7,6 @@ import { MenuTitle } from './common'; import { TextInput } from '../Field'; import { ItemButton } from '../Buttons'; import RoundButton from '../Buttons/Round'; -import Link from 'next/link'; import { useAtom, useSetAtom } from 'jotai'; import { MyTemplate } from '@/@types/MyTemplate'; import { templateAtom } from '.'; @@ -73,7 +72,7 @@ const NameTimeType = () => { setUsageBtns(newUsageBtns); }; - const [template, setTemplate] = useAtom(templateAtom); + const [template] = useAtom(templateAtom); const setAtomTemplate = useSetAtom(templateAtom); const AvailableTime = () => { diff --git a/client/src/components/AddTemplate/TemplateTimeTable.tsx b/client/src/components/AddTemplate/TemplateTimeTable.tsx index fcad405..6b49364 100644 --- a/client/src/components/AddTemplate/TemplateTimeTable.tsx +++ b/client/src/components/AddTemplate/TemplateTimeTable.tsx @@ -24,7 +24,7 @@ const TemplateTimeTable = () => { }, []); const [templateArr, setTemplateArr] = useState([]); - const [template, setTemplate] = useAtom(templateAtom); + const [template] = useAtom(templateAtom); const [companions, setCompanions] = useState([ { name: '', @@ -70,7 +70,7 @@ const TemplateTimeTable = () => { }, [templateArr]); const route = useRouter(); - const [processData, setProcessData] = useState(EmptyDate); + const [processData] = useState(EmptyDate); const [isSelected, setIsSelected] = useState(false); const [selectedSlots, setSelectedSlots] = useState([]); const [isSuccess, setIsSuccess] = useState(false); @@ -78,7 +78,7 @@ const TemplateTimeTable = () => { isError: false, errorMessage: '', }); - const [dates, setDates] = useState([]); + const [dates] = useState([]); const roomMapping: { [key: number]: string[] } = { 3: ['1', '2', '3', '4', '5', '6', '7'], diff --git a/client/src/components/BottomModal/ConfirmReservationModal/ConfirmReservationModal.stories.tsx b/client/src/components/BottomModal/ConfirmReservationModal/ConfirmReservationModal.stories.tsx index da67236..50da267 100644 --- a/client/src/components/BottomModal/ConfirmReservationModal/ConfirmReservationModal.stories.tsx +++ b/client/src/components/BottomModal/ConfirmReservationModal/ConfirmReservationModal.stories.tsx @@ -35,5 +35,6 @@ export const Default: Story = { type: 1, date: '2023-11-09', setIsSuccess: () => {}, + createType: 'template', }, }; diff --git a/client/src/components/BottomModal/SeletSeminarRoomModal/SelectSeminarRoomModal.stories.tsx b/client/src/components/BottomModal/SeletSeminarRoomModal/SelectSeminarRoomModal.stories.tsx index 4eb5401..add50f8 100644 --- a/client/src/components/BottomModal/SeletSeminarRoomModal/SelectSeminarRoomModal.stories.tsx +++ b/client/src/components/BottomModal/SeletSeminarRoomModal/SelectSeminarRoomModal.stories.tsx @@ -43,5 +43,6 @@ export const Default: Story = { seminaRoom: [], setSeminaRoom: () => {}, setIsSeminaRoomSelected: () => {}, + type: 'template', }, }; diff --git a/client/src/components/BottomModal/SeletSeminarRoomModal/index.tsx b/client/src/components/BottomModal/SeletSeminarRoomModal/index.tsx index 40ccc6d..6f15e09 100644 --- a/client/src/components/BottomModal/SeletSeminarRoomModal/index.tsx +++ b/client/src/components/BottomModal/SeletSeminarRoomModal/index.tsx @@ -182,8 +182,8 @@ const ReservationButton = styled.div` props.curScreen === 'confirm' ? COLORS.primary : props.isChecked - ? COLORS.primary - : COLORS.grey3}; + ? COLORS.primary + : COLORS.grey3}; color: #fff; display: flex; justify-content: center; diff --git a/client/src/components/Home/MateList/index.tsx b/client/src/components/Home/MateList/index.tsx index a379269..fa4f354 100644 --- a/client/src/components/Home/MateList/index.tsx +++ b/client/src/components/Home/MateList/index.tsx @@ -10,7 +10,7 @@ interface Props extends ComponentProps<'div'> { const MateList = ({ mates, ...props }: Props) => { return ( - {mates.map((mate, idx) => ( + {mates.map((mate) => ( ))} diff --git a/client/src/components/Home/ReserveButtons/index.tsx b/client/src/components/Home/ReserveButtons/index.tsx index 64640a1..0613fcc 100644 --- a/client/src/components/Home/ReserveButtons/index.tsx +++ b/client/src/components/Home/ReserveButtons/index.tsx @@ -24,7 +24,7 @@ const ReserveButtons = () => { subtitle: '#회의 #미팅 #강의 #세션', assets: assetArray[0], buttonStyleType: 'blue', - onClick: () => router.push('/'), + onClick: () => router.push('/create/reserve'), }, { title: '개방형 세미나실', @@ -35,7 +35,8 @@ const ReserveButtons = () => { }, ]; - //@ts-ignore + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + //@ts-expect-error return {configs.map(ReservationButton)}; }; diff --git a/client/src/components/Modal/Portal/index.tsx b/client/src/components/Modal/Portal/index.tsx index b2f331c..36d801c 100644 --- a/client/src/components/Modal/Portal/index.tsx +++ b/client/src/components/Modal/Portal/index.tsx @@ -1,13 +1,13 @@ -import type React from "react"; -import { useLayoutEffect, useState } from "react"; -import { createPortal } from "react-dom"; +import type React from 'react'; +import { useLayoutEffect, useState } from 'react'; +import { createPortal } from 'react-dom'; const createWrapperAndAppendToBody = (wrapperId: string) => { if (document.getElementById(wrapperId)) return document.getElementById(wrapperId) as HTMLDivElement; else { - const wrapperElement = document.createElement("div"); - wrapperElement.setAttribute("id", wrapperId); + const wrapperElement = document.createElement('div'); + wrapperElement.setAttribute('id', wrapperId); document.body.appendChild(wrapperElement); return wrapperElement; } @@ -15,13 +15,13 @@ const createWrapperAndAppendToBody = (wrapperId: string) => { const ReactPortal = ({ children, - wrapperId = "react-portal-wrapper", + wrapperId = 'react-portal-wrapper', }: { children: React.ReactNode; wrapperId: string; }) => { const [wrapperElement, setWrapperElement] = useState( - null + null, ); useLayoutEffect(() => { setWrapperElement(createWrapperAndAppendToBody(wrapperId)); diff --git a/client/src/components/TemplateList/HomeTemplate/HomeTemplate.stories.tsx b/client/src/components/TemplateList/HomeTemplate/HomeTemplate.stories.tsx index c3e3610..6e6f49c 100644 --- a/client/src/components/TemplateList/HomeTemplate/HomeTemplate.stories.tsx +++ b/client/src/components/TemplateList/HomeTemplate/HomeTemplate.stories.tsx @@ -16,8 +16,12 @@ export const Reserve: Story = { title: '템플릿 제목', beginTime: '목요일 13시', endTime: '15시 30분', - place: '세미나룸 102호', + place: 3, memo: '슈도비 회의 잊지말기', - friends: ['정명진 / 20181234', '이준규 / 20181234'], + friends: [ + { name: '정명진', sId: '2080199' }, + { name: '이준규', sId: '20801929' }, + ], + day: 'Sun', }, }; diff --git a/client/src/components/TemplateList/TemplatePage/Template.stories.tsx b/client/src/components/TemplateList/TemplatePage/Template.stories.tsx index c223a45..5f94224 100644 --- a/client/src/components/TemplateList/TemplatePage/Template.stories.tsx +++ b/client/src/components/TemplateList/TemplatePage/Template.stories.tsx @@ -17,7 +17,8 @@ export const TemplateComponent: Story = { beginTime: '목요일 12시', endTime: '15시', place: '세미나룸 102호', - memo: '슈도비 회의 잊지말기', - friends: ['김수진 / 20191234', '이준규 / 20181234'], + type: 'RESERVE', + idx: 1, + friends: [{ name: '정명진', sId: '2080199' }], }, }; diff --git a/client/src/components/Timetable/index.tsx b/client/src/components/Timetable/index.tsx index 3abaffe..ac618b7 100644 --- a/client/src/components/Timetable/index.tsx +++ b/client/src/components/Timetable/index.tsx @@ -36,6 +36,7 @@ const Schedule: React.FC = ({ }) => { const days = ['', '월요일', '화요일', '수요일', '목요일', '금요일', '토요일']; + // eslint-disable-next-line @typescript-eslint/no-unused-vars const [isDataAllFalse, setIsDataAllFalse] = useState(false); const SeminarTimes = [ diff --git a/client/src/constants/seminaAvailablePeople.ts b/client/src/constants/seminaAvailablePeople.ts index df648fb..094b28d 100644 --- a/client/src/constants/seminaAvailablePeople.ts +++ b/client/src/constants/seminaAvailablePeople.ts @@ -1,4 +1,8 @@ -export const SEMINA_AVAILABLE_PEOPLE = { +export interface SeminaAvailablePeople { + [key: number]: number[]; +} + +export const SEMINA_AVAILABLE_PEOPLE: SeminaAvailablePeople = { 1: [3, 4, 5, 6, 7, 8], 2: [3, 4], 3: [3, 4, 5, 6], diff --git a/client/src/hooks/useTransition.tsx b/client/src/hooks/useTransition.tsx index 47528f7..72b932e 100644 --- a/client/src/hooks/useTransition.tsx +++ b/client/src/hooks/useTransition.tsx @@ -1,4 +1,4 @@ -import { useState, useEffect } from "react"; +import { useState, useEffect } from 'react'; /** transition이 true가 되면 닫는 애니메이션 실행 */ const useTransition = (delay = 1000) => { diff --git a/client/src/pages/create/timetable.tsx b/client/src/pages/create/timetable.tsx index 8d5114e..e081747 100644 --- a/client/src/pages/create/timetable.tsx +++ b/client/src/pages/create/timetable.tsx @@ -1,4 +1,3 @@ -import { NavHeader } from '@/components/Layouts/Header'; import styled from '@emotion/styled'; import { useRouter } from 'next/router'; import { useState, useEffect } from 'react'; @@ -16,11 +15,11 @@ import RightArrow from '@/assets/svg/rightArrow.svg'; import { RESERVE_TIME } from '@/constants/reserveTime'; import { ROOM_USE_SECTION } from '@/constants/roomUseSection'; import { SEMINA_AVAILABLE_PEOPLE } from '@/constants/seminaAvailablePeople'; -import { CompanionProps } from '@/utils/types/Companion'; import { ReserveError } from '@/utils/types/ReserveError'; import ConfirmModal from '@/components/Modal/Confrim'; import { TYPO } from '@/styles/typo'; import { COLORS } from '@/styles/colors'; +import { CompanionProps } from '@/utils/types/Companion'; const Timetable = () => { const isKeyOfReserveTime = ( @@ -41,6 +40,7 @@ const Timetable = () => { ? RESERVE_TIME[timeQuery] : undefined; + // eslint-disable-next-line @typescript-eslint/no-unused-vars const [isOpenSeminar, setIsOpenSeminar] = useState(false); const [isSelected, setIsSelected] = useState(false); const [roomData, setRoomData] = useState(); @@ -63,7 +63,6 @@ const Timetable = () => { if (roomdata === undefined) return; setRoomData(roomdata as RoomData); const pr = processAvailabilityData(roomdata, curSemina); - console.log(pr); setProcessData(pr); } @@ -154,15 +153,13 @@ const Timetable = () => { }; const handleReserveSuccess = () => { + route.replace('/schedule'); setIsSuccess(false); }; useEffect(() => { if (roomData === undefined) return; if (selectedSlots.length === 0) return; - console.log( - selectedSlots[selectedSlots.length - 1].split('-')[3].slice(0, 2), - ); const availableRooms = getAvailableSeminarRooms( roomData, selectedSlots[0].slice(0, 10), @@ -174,7 +171,6 @@ const Timetable = () => { false, ); setSeminaRoom(availableRooms); - console.log(availableRooms); }, [roomData]); useEffect(() => { @@ -196,7 +192,6 @@ const Timetable = () => { return ( - 사용시간 @@ -249,7 +244,7 @@ const Timetable = () => { {isSelected && !isSuccess && !isError.isError && (