feat: 저장한 제품이 없을 경우 처리 #204

Kernel360 · Feb 23, 2024 · e58442a · e58442a
1 parent 056f274
commit e58442a
Showing 1 changed file with 19 additions and 13 deletions.
diff --git a/src/app/favorite/page.tsx b/src/app/favorite/page.tsx
@@ -35,6 +35,8 @@ function FavoritePage() {
 
   const { favoriteList, hasNextPage, loadMore } = useFavoriteList();
 
+  // TODO: 저장한 제품이 없을 경우 디자인 필요
+
   return (
     <>
       <div className={cx('headerTitleContainer')}>
@@ -55,19 +57,23 @@ function FavoritePage() {
             />
           </div>
         </div>
-        <InfiniteScroll
-          dataLength={favoriteList?.length ?? 0}
-          next={loadMore}
-          hasMore={hasNextPage}
-          loader={<div className="loader" key={0}>Loading ...</div>}
-          inverse={false}
-        >
-          <div className={cx('productArticleWrapper')}>
-            {favoriteList.map((item) => {
-              return <ProductArticle key={item.productNo} itemData={item} />;
-            })}
-          </div>
-        </InfiniteScroll>
+        {favoriteList.length === 0
+          ? <p>저장한 제품이 없습니다.</p>
+          : (
+            <InfiniteScroll
+              dataLength={favoriteList?.length ?? 0}
+              next={loadMore}
+              hasMore={hasNextPage}
+              loader={<div className="loader" key={0}>Loading ...</div>}
+              inverse={false}
+            >
+              <div className={cx('productArticleWrapper')}>
+                {favoriteList.map((item) => {
+                  return <ProductArticle key={item.productNo} itemData={item} />;
+                })}
+              </div>
+            </InfiniteScroll>
+          )}
       </main>
       <BottomNav />
     </>