Refactor. 2차리뷰 받은것 반영

d-h-k/airbnb/#74

FE/airbnb-fe/src/components/Atoms/Modal/CheckModal/CalendarCarousel/Calendar.jsx

@@ -5,32 +5,37 @@ import YearMonth from './YearMonth';
 import DayViewTR from './DayViewTR';
 
 const Calendar = () => {
+  const centerPosition = -27.2;
   const [calRange, setCalRange] = useState([-1, 0, 1, 2]);
-  const [currentDistance, setCurrentDistance] = useState(-27.2); //가운데 = -27.2rem
+  const [currentDistance, setCurrentDistance] = useState(centerPosition);
   const [disabled, setDisabled] = useState(false);
   const oneMove = 25.3;
 
   const preventClick = () => {
-    setTimeout(() => {
-      setDisabled(false);
-    }, 200);
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        resolve(false);
+      }, 200);
+    });
   };
 
-  const handleLeftClick = () => {
+  const handleLeftClick = async () => {
     if (disabled) return;
     setDisabled(true);
-    preventClick();
+    const boolean = await preventClick();
+    setDisabled(boolean);
     setCurrentDistance((currentDistance) => currentDistance + oneMove);
     setCalRange((calRange) => {
       const nextRange = calRange.map((r) => r - 1);
       return nextRange;
     });
   };
 
-  const handleRightClick = () => {
+  const handleRightClick = async () => {
     if (disabled) return;
     setDisabled(true);
-    preventClick();
+    const boolean = await preventClick();
+    setDisabled(boolean);
     setCurrentDistance((currentDistance) => currentDistance - oneMove);
     setCalRange((calRange) => {
       const nextRange = calRange.map((r) => r + 1);
@@ -39,7 +44,7 @@ const Calendar = () => {
   };
 
   const onSlideEnd = () => {
-    setCurrentDistance(-27.2);
+    setCurrentDistance(centerPosition);
   };
 
   return (
@@ -49,6 +54,7 @@ const Calendar = () => {
         <YearMonthUL
           currentDistance={currentDistance}
           onTransitionEnd={() => onSlideEnd()}
+          centerPosition={centerPosition}
         >
           {calRange.map((range, idx) => (
             <YearMonthLI key={idx}>
@@ -66,6 +72,7 @@ const Calendar = () => {
         <CalTableWrapper
           currentDistance={currentDistance}
           onTransitionEnd={() => onSlideEnd()}
+          centerPosition={centerPosition}
         >
           {calRange.map((range, idx) => (
             <SingleCalendar key={idx} range={range} />
@@ -92,8 +99,8 @@ const CalendarTop = styled.div`
 const CalTableWrapper = styled.div`
   display: flex;
   transform: ${({ currentDistance }) => `translateX(${currentDistance}rem)`};
-  transition: ${({ currentDistance }) =>
-    currentDistance === -27.2 ? '' : '0.2s ease-in-out'};
+  transition: ${({ currentDistance, centerPosition }) =>
+    currentDistance === centerPosition ? '' : '0.2s ease-in-out'};
 `;
 const CalendarBottom = styled.div`
   display: flex;
@@ -107,8 +114,8 @@ const CalendarMiddle = styled.div`
 const YearMonthUL = styled.ul`
   display: flex;
   transform: ${({ currentDistance }) => `translateX(${currentDistance}rem)`};
-  transition: ${({ currentDistance }) =>
-    currentDistance === -27.2 ? '' : '0.2s ease-in-out'};
+  transition: ${({ currentDistance, centerPosition }) =>
+    currentDistance === centerPosition ? '' : '0.2s ease-in-out'};
 `;
 
 const YearMonthLI = styled.li`

FE/airbnb-fe/src/components/Atoms/Modal/PeopleModal/PeopleCard.jsx

@@ -6,9 +6,10 @@ import { SearchContext } from '../../Search';
 const PeopleCard = ({ type: peopleType }) => {
   const { peopleCount, peopleDispatch } = useContext(SearchContext);
   const peopleTypeContent = peopleTypeJson[peopleType];
+  const maxPeopleCount = 8;
 
-  const setCountDisable = () =>
-    peopleCount['adult'] + peopleCount['child'] >= 8;
+  const setCountDisable = (maxPeopleCount) =>
+    peopleCount['adult'] + peopleCount['child'] >= maxPeopleCount;
 
   const handleBabyClick = (type) => {
     if (type === 'baby') {
@@ -40,7 +41,7 @@ const PeopleCard = ({ type: peopleType }) => {
         </CountButton>
         <CountNumber>{peopleCount[peopleType]}</CountNumber>
         <CountButton
-          disabled={setCountDisable()}
+          disabled={setCountDisable(maxPeopleCount)}
           onClick={() => handleBabyClick(peopleType)}
         >
           +

FE/airbnb-fe/src/components/Atoms/Search/SearchBtn/index.jsx

@@ -34,7 +34,7 @@ const SearchBtn = () => {
             <SearchButtonSvg />
           </SearchSvg>
         </SearchSvgDiv>
-        {isModalClicked ? <SearchWordDiv>검색</SearchWordDiv> : null}
+        {isModalClicked && <SearchWordDiv>검색</SearchWordDiv>}
       </SearchBtnDiv>
     </Link>
   );