Merge pull request #76 from Bibumhada/feat/75-change-function-of-bott…

…om--sheet-buttons

75 [Frontend] Fix: 추천 식당 없을 경우의 바텀시트 버튼 기능 수정

src/components/common/modal/children/EndOfListAlertBottomSheet.tsx

@@ -2,22 +2,20 @@ import React from 'react';
 import logo from 'assets/images/logo.svg';
 import Button from 'components/common/Button/Button';
 import * as S from './EndOfListAlertBottomSheet.styled';
-import { useNavigate } from 'react-router-dom';
 
-const EndOfListAlertBottomSheet = ({ onClickGetNewRestaurantList }: { onClickGetNewRestaurantList: React.MouseEventHandler<HTMLButtonElement> }) => {
-  const navigate = useNavigate();
-
-  const handleToLocationPage = () => {
-    navigate('/');
-  };
+type EndOfListAlertBottomSheetProps = {
+  onClickGetNewRestaurantList: React.MouseEventHandler<HTMLButtonElement>;
+  onClickCloseModal: React.MouseEventHandler<HTMLButtonElement>;
+};
 
+const EndOfListAlertBottomSheet = ({ onClickGetNewRestaurantList, onClickCloseModal }: EndOfListAlertBottomSheetProps) => {
   return (
     <S.Layout>
       <S.Logo src={logo} alt="오늘의 메뉴 로고" />
       <S.Title>오늘 준비한 메뉴 추천은 여기까지에요!</S.Title>
       <S.ButtonLayout>
-        <Button onClick={handleToLocationPage}>처음으로</Button>
-        <Button $variant="orange" onClick={onClickGetNewRestaurantList}>
+        <Button onClick={onClickGetNewRestaurantList}>초기화</Button>
+        <Button $variant="orange" onClick={onClickCloseModal}>
           이어서 고르기
         </Button>
       </S.ButtonLayout>

src/pages/RandomList/RandomList.tsx

@@ -103,7 +103,10 @@ const RandomList = () => {
     }
   };
 
-  const handleGetNewRestaurantList = () => {
+  const handleGetNewRestaurantList = (event: React.MouseEvent<HTMLButtonElement>) => {
+    event.stopPropagation();
+    event.preventDefault();
+    setIsAlertModalOn(false);
     if (roomId) {
       retryListRoom(
         { roomId },
@@ -139,7 +142,7 @@ const RandomList = () => {
       </S.Layout>
       {isAlertModalOn && (
         <BottomSheet handleModalClose={handleModalClose}>
-          <EndOfListAlertBottomSheet onClickGetNewRestaurantList={handleGetNewRestaurantList} />
+          <EndOfListAlertBottomSheet onClickGetNewRestaurantList={handleGetNewRestaurantList} onClickCloseModal={() => setIsAlertModalOn(false)} />
         </BottomSheet>
       )}
     </>