fix: 추천 목록이 없으면 안보이도록 수정

Kusitms-28th-Meet-Up-B · Nov 23, 2023 · bb125f7 · bb125f7
1 parent cee962e
commit bb125f7
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 56 deletions.
diff --git a/src/pages/DetailProgram/RecommendAccom.tsx b/src/pages/DetailProgram/RecommendAccom.tsx
@@ -1,25 +1,17 @@
-import Loading from '@/components/Loading/Loading';
 import RecommendCard from '@/components/RecommendCard/RecommendCard';
 import { H1 } from '@/style/fonts/StyledFonts';
 import { RecommendDataType } from '@/types';
 import styled from 'styled-components';
 
 interface RecommendAccomProps {
   resultList: RecommendDataType[];
-  isLoading: boolean;
 }
 
-const RecommendAccom = ({ resultList, isLoading }: RecommendAccomProps) => {
+const RecommendAccom = ({ resultList }: RecommendAccomProps) => {
   return (
     <Container>
       <H1 $fontColor="var(--color_gray900)">숙소 추천</H1>
-      {isLoading ? (
-        <LoadingWrapper>
-          <Loading />
-        </LoadingWrapper>
-      ) : (
-        <RecommendCard resultList={resultList} />
-      )}
+      <RecommendCard resultList={resultList} />
     </Container>
   );
 };
@@ -34,8 +26,3 @@ const Container = styled.div`
   margin-bottom: 193px;
   text-align: left;
 `;
-
-const LoadingWrapper = styled.div`
-  background-color: red;
-  position: relative;
-`;
diff --git a/src/pages/DetailProgram/RecommendSpot.tsx b/src/pages/DetailProgram/RecommendSpot.tsx
@@ -1,25 +1,17 @@
-import Loading from '@/components/Loading/Loading';
 import RecommendCard from '@/components/RecommendCard/RecommendCard';
 import { H1 } from '@/style/fonts/StyledFonts';
 import { RecommendDataType } from '@/types';
 import styled from 'styled-components';
 
 interface RecommendSpotProps {
   resultList: RecommendDataType[];
-  isLoading: boolean;
 }
 
-const RecommendSpot = ({ resultList, isLoading }: RecommendSpotProps) => {
+const RecommendSpot = ({ resultList }: RecommendSpotProps) => {
   return (
     <Container>
       <H1 $fontColor="var(--color_gray900)">여행지 추천</H1>
-      {isLoading ? (
-        <LoadingWrapper>
-          <Loading />
-        </LoadingWrapper>
-      ) : (
-        <RecommendCard resultList={resultList} />
-      )}
+      <RecommendCard resultList={resultList} />
     </Container>
   );
 };
@@ -34,8 +26,3 @@ const Container = styled.div`
   padding-bottom: 16px;
   text-align: left;
 `;
-
-const LoadingWrapper = styled.div`
-  background-color: red;
-  position: relative;
-`;
diff --git a/src/pages/DetailProgram/index.tsx b/src/pages/DetailProgram/index.tsx
@@ -32,16 +32,14 @@ const DetailProgram = () => {
     programId,
     writerVersion,
   });
-  const { data: recommendSpotList, isLoading: spotListLoading } =
-    useGetRegionTour({
-      programId,
-      writerVersion,
-    });
-  const { data: recommendAccomList, isLoading: accomListLoading } =
-    useGetRegionLodgment({
-      programId,
-      writerVersion,
-    });
+  const { data: recommendSpotList } = useGetRegionTour({
+    programId,
+    writerVersion,
+  });
+  const { data: recommendAccomList } = useGetRegionLodgment({
+    programId,
+    writerVersion,
+  });
   const userInfo = useRecoilValue(UserAtom);
   const navigate = useNavigate();
 
@@ -96,22 +94,12 @@ const DetailProgram = () => {
           <div>
             <BackgroundLine />
             <CommonInner>
-              <RecommendSpot
-                resultList={
-                  recommendSpotList && recommendSpotList.length > 0
-                    ? recommendSpotList
-                    : []
-                }
-                isLoading={spotListLoading}
-              />
-              <RecommendAccom
-                resultList={
-                  recommendAccomList && recommendAccomList.length > 0
-                    ? recommendAccomList
-                    : []
-                }
-                isLoading={accomListLoading}
-              />
+              {recommendSpotList && recommendSpotList.length > 0 && (
+                <RecommendSpot resultList={recommendSpotList} />
+              )}
+              {recommendAccomList && recommendAccomList.length > 0 && (
+                <RecommendAccom resultList={recommendAccomList} />
+              )}
             </CommonInner>
             <HoneyTipButton />
           </div>