diff --git a/src/components/common/ResultCard/ResultCard.tsx b/src/components/common/ResultCard/ResultCard.tsx index ec46b14..77edbb6 100644 --- a/src/components/common/ResultCard/ResultCard.tsx +++ b/src/components/common/ResultCard/ResultCard.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import { useParams } from 'react-router-dom'; import * as S from './ResultCard.styled'; import toDetail from 'assets/icons/icon-to-detail-black.svg'; import soup from 'assets/icons/icon-soup.svg'; @@ -22,6 +23,7 @@ type ResultCardProps = { const ResultCard = (props: ResultCardProps) => { const categories = splitCategory(props.categories); + const { id: roomId } = useParams(); const handleLinkClick = (event: React.MouseEvent) => { event.stopPropagation(); @@ -62,7 +64,7 @@ const ResultCard = (props: ResultCardProps) => { {props.pollNumber}/15명 - 전체 순위 보기 + 전체 순위 보기 ); }; diff --git a/src/pages/OverallRanking/OverallRanking.tsx b/src/pages/OverallRanking/OverallRanking.tsx index 5b1343d..07eedbb 100644 --- a/src/pages/OverallRanking/OverallRanking.tsx +++ b/src/pages/OverallRanking/OverallRanking.tsx @@ -8,11 +8,22 @@ import shareResult from 'assets/icons/icon-share-resut.svg'; import winner from 'assets/icons/icon-winner.svg'; import { useGetResult } from 'apis/query/useGetResult'; import splitCategory from 'util/splitCategory'; +import AsyncBoundary from 'components/common/AsyncBoundary'; +import Loading from 'pages/Loading/Loading'; +import Error from 'pages/Error/Error'; import { useRecoilState } from 'recoil'; import { roomIdData } from 'recoil/roomIdData'; import { randomListData } from 'recoil/randomListData'; -export default function OverallRanking() { +const OverallRankingWrapper = () => { + return ( + } suspenseFallback={}> + + + ); +}; + +function OverallRanking() { const [IsModalOn, setIsModalOn] = useState(false); const navigate = useNavigate(); const { id: roomId } = useParams(); @@ -66,10 +77,7 @@ export default function OverallRanking() {

-
- {item.title} -

{item.distance}m

-
+ {item.title}
{`# ${splitCategory(item.category)}`}
{item.distance}m @@ -91,3 +99,5 @@ export default function OverallRanking() { ); } + +export default OverallRankingWrapper; diff --git a/src/pages/Poll/Poll.tsx b/src/pages/Poll/Poll.tsx index 484eb0a..b17d4f9 100644 --- a/src/pages/Poll/Poll.tsx +++ b/src/pages/Poll/Poll.tsx @@ -11,10 +11,11 @@ import icon_share from 'assets/icons/icon-share.svg'; import { roomIdData } from 'recoil/roomIdData'; import { useRecoilValue } from 'recoil'; import { useVoteMutation } from 'apis/query/useVoteMutation'; +import Error from 'pages/Error/Error'; const PollWrapper = () => { return ( - ...error} suspenseFallback={}> + } suspenseFallback={}> ); @@ -37,8 +38,9 @@ const Poll = () => { // } }, [clickedIndexArray]); - const onSuccessFn = () => { - // navigate(`/random-menu/${roomId}/result`); + const onSuccessFn = (data: any) => { + navigate(`/random-menu/${roomId}/result`); + console.log(data); }; const handleSubmit = () => { diff --git a/src/pages/RandomList/RandomList.tsx b/src/pages/RandomList/RandomList.tsx index 41c3223..daf9aa9 100644 --- a/src/pages/RandomList/RandomList.tsx +++ b/src/pages/RandomList/RandomList.tsx @@ -10,12 +10,13 @@ import { randomListData } from 'recoil/randomListData'; import { roomIdData } from 'recoil/roomIdData'; import { useRetryMutation } from 'apis/query/useRetryMutation'; import { useResuggestOneMutation } from 'apis/query/useResuggestOneMutation'; +import Error from 'pages/Error/Error'; import BottomSheet from 'components/common/modal/BottomSheet'; import EndOfListAlert from 'components/common/modal/children/EndOfListAlert'; const RandomListWrapper = () => { return ( - ...error} suspenseFallback={}> + } suspenseFallback={}> ); diff --git a/src/pages/Result/Result.tsx b/src/pages/Result/Result.tsx index b356d89..45344e7 100644 --- a/src/pages/Result/Result.tsx +++ b/src/pages/Result/Result.tsx @@ -10,10 +10,21 @@ import Button from 'components/common/Button/Button'; import ShareBottomSheet from 'components/common/modal/ShareBottomSheet'; import shareResult from 'assets/icons/icon-share-result.svg'; import retry from 'assets/icons/icon-retry-orange.svg'; +import AsyncBoundary from 'components/common/AsyncBoundary'; +import Loading from 'pages/Loading/Loading'; +import Error from 'pages/Error/Error'; import { useRecoilState } from 'recoil'; import { randomListData } from 'recoil/randomListData'; import { roomIdData } from 'recoil/roomIdData'; +const ResultWrapper = () => { + return ( + } suspenseFallback={}> + + + ); +}; + const Result = () => { const [IsModalOn, setIsModalOn] = useState(false); const [text, setText] = useState('1등 음식점을 확인해보세요 👀'); @@ -130,4 +141,4 @@ const Result = () => { ); }; -export default Result; +export default ResultWrapper;