added resources exhausted check to timeout

hydralauncher · Jun 24, 2024 · a13ac6a · a13ac6a
1 parent 68205a9
commit a13ac6a
Showing 1 changed file with 23 additions and 14 deletions.
diff --git a/src/renderer/src/pages/catalogue/catalogue.tsx b/src/renderer/src/pages/catalogue/catalogue.tsx
@@ -65,30 +65,32 @@ export function Catalogue() {
       cursor: cursorRef.current.toString(),
     });
 
-    resetInfiniteScroll()
+    resetInfiniteScroll();
 
     navigate(`/catalogue?${params.toString()}`);
   };
 
-  const resetInfiniteScroll = () =>{
-    cursorInfScrollRef.current = cursorRef.current + 24
-    setResultsExhausted(false)
-  }
+  const resetInfiniteScroll = () => {
+    cursorInfScrollRef.current = cursorRef.current + 24;
+    setResultsExhausted(false);
+  };
 
   const infiniteLoading = () => {
-    if(resultsExhausted) return
-    const isAtBottom = contentRef.current?.offsetHeight! + contentRef.current?.scrollTop! == contentRef.current?.scrollHeight
+    if (resultsExhausted || !contentRef.current) return;
+    const isAtBottom =
+      contentRef.current.offsetHeight + contentRef.current.scrollTop ==
+      contentRef.current.scrollHeight;
 
     if (isAtBottom) {
       setIsLoadingInfScroll(true);
       window.electron
         .getGames(24, cursorInfScrollRef.current)
         .then(({ results, cursor }) => {
           return new Promise((resolve) => {
-            if (results.length == 0) {
-              setResultsExhausted(true)
-            }
             setTimeout(() => {
+              if (results.length == 0) {
+                setResultsExhausted(true);
+              }
               cursorInfScrollRef.current += cursor;
               setSearchResults([...searchResults, ...results]);
               resolve(null);
@@ -99,7 +101,7 @@ export function Catalogue() {
           setIsLoadingInfScroll(false);
         });
     }
-  }
+  };
 
   return (
     <SkeletonTheme baseColor={vars.color.background} highlightColor="#444">
@@ -114,7 +116,10 @@ export function Catalogue() {
         }}
       >
         <Button
-          onClick={() => { resetInfiniteScroll(); navigate(-1) }}
+          onClick={() => {
+            resetInfiniteScroll();
+            navigate(-1);
+          }}
           theme="outline"
           disabled={cursor === 0 || isLoading}
         >
@@ -128,7 +133,11 @@ export function Catalogue() {
         </Button>
       </section>
 
-      <section ref={contentRef} className={styles.content} onScroll={infiniteLoading}>
+      <section
+        ref={contentRef}
+        className={styles.content}
+        onScroll={infiniteLoading}
+      >
         <section className={styles.cards}>
           {isLoading &&
             Array.from({ length: 12 }).map((_, index) => (
@@ -147,7 +156,7 @@ export function Catalogue() {
             </>
           )}
 
-        {isLoadingInfScroll &&
+          {isLoadingInfScroll &&
             Array.from({ length: 12 }).map((_, index) => (
               <Skeleton key={index} className={styles.cardSkeleton} />
             ))}