refactor: ⚡ better isReady handling

Sekai-World · Apr 24, 2024 · 26b25b3 · 26b25b3
1 parent fcc2a6f
commit 26b25b3
Show file tree

Hide file tree

Showing 12 changed files with 71 additions and 100 deletions.
diff --git a/src/pages/card/CardList.tsx b/src/pages/card/CardList.tsx
@@ -250,10 +250,19 @@ const CardList: React.FC<unknown> = observer(() => {
 
   useLayoutEffect(() => {
     setIsReady(
-      Boolean(cardsCache && cardsCache.length) &&
-        Boolean(charas && charas.length)
+      !!cardsCache?.length &&
+        !!charas?.length &&
+        !!rarities?.length &&
+        !!episodes?.length &&
+        !!skills?.length
     );
-  }, [setIsReady, cardsCache, charas]);
+  }, [
+    rarities?.length,
+    episodes?.length,
+    skills?.length,
+    cardsCache?.length,
+    charas?.length,
+  ]);
 
   useEffect(() => {
     if (!isCurrEventLoading && !!currEvent) {
@@ -263,14 +272,10 @@ const CardList: React.FC<unknown> = observer(() => {
 
   const doFilter = useCallback(() => {
     if (
-      cardsCache &&
-      cardsCache.length &&
-      rarities &&
-      rarities.length &&
-      episodes &&
-      episodes.length &&
-      skills &&
-      skills.length
+      cardsCache?.length &&
+      rarities?.length &&
+      episodes?.length &&
+      skills?.length
     ) {
       let result = [...cardsCache];
       // do filter
@@ -355,19 +360,19 @@ const CardList: React.FC<unknown> = observer(() => {
       setPage(0);
     }
   }, [
+    attrSelected,
     cardsCache,
-    rarities,
+    characterSelected,
     episodes,
-    skills,
     isShowSpoiler,
-    characterSelected,
-    attrSelected,
-    supportUnitSelected,
+    rarities,
     raritySelected,
+    region,
     skillSelected,
+    skills,
     sortBy,
-    region,
     sortType,
+    supportUnitSelected,
   ]);
 
   const resetFilter = useCallback(() => {

diff --git a/src/pages/comic/ComicList.tsx b/src/pages/comic/ComicList.tsx
@@ -131,24 +131,24 @@ const ComicList: React.FC<unknown> = observer(() => {
   }, [t]);
 
   useEffect(() => {
-    if (tipsCache && tipsCache.length) {
+    if (tipsCache?.length) {
       const filtered = tipsCache.filter(
         (tip): tip is ITipInfoComic => "assetbundleName" in tip
       );
       setFilteredCache(filtered);
       setComics([]);
       setPage(0);
     }
-  }, [tipsCache, setComics, setPage, setFilteredCache]);
+  }, [tipsCache]);
 
   useEffect(() => {
     setComics((tips) => [...tips, ...getPaginatedTips(page, limit)]);
     setLastQueryFin(true);
   }, [page, limit, tipsCache, setLastQueryFin, getPaginatedTips]);
 
   useEffect(() => {
-    setIsReady(Boolean(tipsCache && tipsCache.length));
-  }, [setIsReady, tipsCache]);
+    setIsReady(!!tipsCache?.length);
+  }, [tipsCache?.length]);
 
   return (
     <Fragment>

diff --git a/src/pages/event/EventList.tsx b/src/pages/event/EventList.tsx
@@ -92,8 +92,8 @@ const EventList: React.FC<unknown> = observer(() => {
   }, [eventsCache, setPage, sortType, sortBy, isShowSpoiler]);
 
   useEffect(() => {
-    setIsReady(Boolean(eventsCache && eventsCache.length));
-  }, [setIsReady, eventsCache]);
+    setIsReady(!!eventsCache?.length);
+  }, [eventsCache?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/gacha/GachaList.tsx b/src/pages/gacha/GachaList.tsx
@@ -63,7 +63,7 @@ const GachaList: React.FC<unknown> = observer(() => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    if (!gachasCache || !gachasCache.length) return;
+    if (!gachasCache?.length) return;
     let sortedCache = [...gachasCache];
     if (region === "en") {
       // only show gacha after release (2021/12/7)
@@ -86,11 +86,11 @@ const GachaList: React.FC<unknown> = observer(() => {
     setSortedCache(sortedCache);
     setGachas([]);
     setPage(0);
-  }, [gachasCache, setPage, sortType, sortBy, isShowSpoiler, region]);
+  }, [gachasCache, isShowSpoiler, region, sortBy, sortType]);
 
   useEffect(() => {
-    setIsReady(Boolean(gachasCache && gachasCache.length));
-  }, [setIsReady, gachasCache]);
+    setIsReady(!!gachasCache?.length);
+  }, [gachasCache?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/honor/HonorList.tsx b/src/pages/honor/HonorList.tsx
@@ -80,12 +80,7 @@ const HonorList = () => {
   }, [t]);
 
   useEffect(() => {
-    if (
-      honorsCache &&
-      honorsCache.length &&
-      honorGroups &&
-      honorGroups.length
-    ) {
+    if (honorGroups?.length && honorsCache?.length) {
       let result = [...honorsCache];
       // do filter
       if (honorType) {
@@ -114,15 +109,7 @@ const HonorList = () => {
       setHonors([]);
       setPage(0);
     }
-  }, [
-    setPage,
-    honorsCache,
-    honorType,
-    honorGroups,
-    isHonorGroupOnce,
-    sortBy,
-    sortType,
-  ]);
+  }, [honorGroups, honorType, honorsCache, isHonorGroupOnce, sortBy, sortType]);
 
   useLayoutEffect(() => {
     setHonors((honors) => [
@@ -133,8 +120,8 @@ const HonorList = () => {
   }, [page, limit, setLastQueryFin, filteredCache]);
 
   useLayoutEffect(() => {
-    setIsReady(Boolean(honorsCache && honorsCache.length));
-  }, [honorsCache, setIsReady]);
+    setIsReady(!!honorsCache?.length && !!honorGroups?.length);
+  }, [honorsCache?.length, honorGroups?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/mission/beginner/BeginnerMissionList.tsx b/src/pages/mission/beginner/BeginnerMissionList.tsx
@@ -89,7 +89,7 @@ const BeginnerMissionList: React.FC<unknown> = () => {
   }, [t]);
 
   useEffect(() => {
-    if (beginnerMissionsCache && beginnerMissionsCache.length) {
+    if (beginnerMissionsCache?.length) {
       let result = [...beginnerMissionsCache];
       // do filter
       if (missionTypeSelected.length) {
@@ -109,14 +109,7 @@ const BeginnerMissionList: React.FC<unknown> = () => {
       setBeginnerMissions([]);
       setPage(0);
     }
-  }, [
-    beginnerMissionsCache,
-    setPage,
-    setSortedCache,
-    missionTypeSelected,
-    sortBy,
-    sortType,
-  ]);
+  }, [beginnerMissionsCache, missionTypeSelected, sortBy, sortType]);
 
   useEffect(() => {
     setBeginnerMissions((events) => [
@@ -127,8 +120,8 @@ const BeginnerMissionList: React.FC<unknown> = () => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    setIsReady(Boolean(beginnerMissionsCache && beginnerMissionsCache.length));
-  }, [setIsReady, beginnerMissionsCache]);
+    setIsReady(!!beginnerMissionsCache?.length);
+  }, [beginnerMissionsCache?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/mission/character/CharacterMissionList.tsx b/src/pages/mission/character/CharacterMissionList.tsx
@@ -82,10 +82,8 @@ const CharacterMissionList: React.FC<unknown> = () => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    setIsReady(
-      Boolean(characterMissionsCache && characterMissionsCache.length)
-    );
-  }, [setIsReady, characterMissionsCache]);
+    setIsReady(!!characterMissionsCache?.length && !!characterProfiles?.length);
+  }, [characterMissionsCache?.length, characterProfiles?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/mission/honor/TitleMissionList.tsx b/src/pages/mission/honor/TitleMissionList.tsx
@@ -305,7 +305,7 @@ const TitleMissionList: React.FC<unknown> = () => {
   }, [t]);
 
   useEffect(() => {
-    if (honorMissionsCache && honorMissionsCache.length) {
+    if (honorMissionsCache?.length) {
       let result = [...honorMissionsCache];
       // do filter
       if (missionTypeSelected.length) {
@@ -325,14 +325,7 @@ const TitleMissionList: React.FC<unknown> = () => {
       setHonorMissions([]);
       setPage(0);
     }
-  }, [
-    honorMissionsCache,
-    setPage,
-    setSortedCache,
-    missionTypeSelected,
-    sortBy,
-    sortType,
-  ]);
+  }, [honorMissionsCache, missionTypeSelected, sortBy, sortType]);
 
   useEffect(() => {
     setHonorMissions((events) => [
@@ -343,8 +336,8 @@ const TitleMissionList: React.FC<unknown> = () => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    setIsReady(Boolean(honorMissionsCache && honorMissionsCache.length));
-  }, [setIsReady, honorMissionsCache]);
+    setIsReady(!!honorMissionsCache?.length);
+  }, [honorMissionsCache?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/mission/normal/NormalMissionList.tsx b/src/pages/mission/normal/NormalMissionList.tsx
@@ -84,7 +84,7 @@ const NormalMissionList: React.FC<unknown> = () => {
   }, [t]);
 
   useEffect(() => {
-    if (normalMissionsCache && normalMissionsCache.length) {
+    if (normalMissionsCache?.length) {
       let result = [...normalMissionsCache];
       // do filter
       if (missionTypeSelected.length) {
@@ -104,14 +104,7 @@ const NormalMissionList: React.FC<unknown> = () => {
       setNormalMissions([]);
       setPage(0);
     }
-  }, [
-    normalMissionsCache,
-    setPage,
-    setSortedCache,
-    missionTypeSelected,
-    sortBy,
-    sortType,
-  ]);
+  }, [missionTypeSelected, normalMissionsCache, sortBy, sortType]);
 
   useEffect(() => {
     setNormalMissions((events) => [
@@ -122,8 +115,8 @@ const NormalMissionList: React.FC<unknown> = () => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    setIsReady(Boolean(normalMissionsCache && normalMissionsCache.length));
-  }, [setIsReady, normalMissionsCache]);
+    setIsReady(!!normalMissionsCache?.length);
+  }, [normalMissionsCache?.length]);
 
   const callback = useCallback(
     (

diff --git a/src/pages/music/MusicList.tsx b/src/pages/music/MusicList.tsx
@@ -149,8 +149,19 @@ const MusicList: React.FC<unknown> = observer(() => {
   }, [t]);
 
   useEffect(() => {
-    setIsReady(Boolean(musicsCache));
-  }, [setIsReady, musicsCache]);
+    setIsReady(
+      !!musicsCache?.length &&
+        !!musicTags?.length &&
+        !!musicVocals?.length &&
+        !!musicDiffis?.length
+    );
+  }, [
+    musicDiffis?.length,
+    musicTags?.length,
+    musicVocals?.length,
+    musicsCache?.length,
+    setIsReady,
+  ]);
 
   const doFilter = useCallback(() => {
     if (musicsCache && musicTags && musicVocals && musicDiffis) {

diff --git a/src/pages/stamp/StampList.tsx b/src/pages/stamp/StampList.tsx
@@ -93,7 +93,7 @@ const StampList: React.FC<unknown> = () => {
   }, [t]);
 
   useEffect(() => {
-    if (stampsCache && stampsCache.length) {
+    if (stampsCache?.length) {
       let cache = stampsCache;
       if (characterSelected.length) {
         cache = stampsCache.filter((s) =>
@@ -115,25 +115,16 @@ const StampList: React.FC<unknown> = () => {
       setStamps([]);
       setPage(0);
     }
-  }, [
-    characterSelected,
-    stampsCache,
-    setStamps,
-    setPage,
-    setFilteredCache,
-    sortType,
-    sortBy,
-    stampType,
-  ]);
+  }, [characterSelected, sortBy, sortType, stampType, stampsCache]);
 
   useEffect(() => {
     setStamps((stamps) => [...stamps, ...getPaginatedStamps(page, limit)]);
     setLastQueryFin(true);
   }, [page, limit, setLastQueryFin, getPaginatedStamps]);
 
   useEffect(() => {
-    setIsReady(Boolean(stampsCache && stampsCache.length));
-  }, [setIsReady, stampsCache]);
+    setIsReady(!!stampsCache?.length);
+  }, [stampsCache?.length]);
 
   const handleUpdateSortType = useCallback(
     (_, sort: string) => {

diff --git a/src/pages/virtual_live/VirtualLiveList.tsx b/src/pages/virtual_live/VirtualLiveList.tsx
@@ -73,7 +73,7 @@ const VirtualLiveList: React.FC<unknown> = observer(() => {
   }, [page, limit, setLastQueryFin, sortedCache]);
 
   useEffect(() => {
-    if (!virtualLivesCache) return;
+    if (!virtualLivesCache?.length) return;
     let sortedCache = [...virtualLivesCache];
     if (!isShowSpoiler) {
       sortedCache = sortedCache.filter(
@@ -95,11 +95,11 @@ const VirtualLiveList: React.FC<unknown> = observer(() => {
     setSortedCache(sortedCache);
     setVirtualLives([]);
     setPage(0);
-  }, [isShowSpoiler, setPage, sortBy, sortType, virtualLivesCache]);
+  }, [isShowSpoiler, sortBy, sortType, virtualLivesCache]);
 
   useEffect(() => {
-    setIsReady(Boolean(virtualLivesCache));
-  }, [setIsReady, virtualLivesCache]);
+    setIsReady(!!virtualLivesCache?.length);
+  }, [virtualLivesCache?.length]);
 
   const callback = useCallback(
     (