Merge pull request #157 from AmityCo/fix--category-cannot-load-and-so…

…rting-issue fix category cannot load
AmityCo · Oct 7, 2024 · 53ed3bd · 53ed3bd
2 parents 2a9e842 + 5419515
commit 53ed3bd
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 56 deletions.
diff --git a/example/ios/Podfile.lock b/example/ios/Podfile.lock
@@ -1,5 +1,5 @@
 PODS:
-  - amity-react-native-social-ui-kit (4.0.0-beta-13):
+  - amity-react-native-social-ui-kit (4.0.0-beta-15):
     - RCT-Folly (= 2021.07.22.00)
     - React-Core
   - ApiVideoLiveStream (1.4.1):
@@ -877,7 +877,7 @@ EXTERNAL SOURCES:
     :path: "../node_modules/react-native/ReactCommon/yoga"
 
 SPEC CHECKSUMS:
-  amity-react-native-social-ui-kit: fb1f7b715ce5649d0389b5000c2e03aa13c565d0
+  amity-react-native-social-ui-kit: 8459a53363296105a59f9fcd844f264e199e26f3
   ApiVideoLiveStream: 8f9dce7f6d15d5e4bb3c7a25e406bf2a36337a5a
   boost: 57d2868c099736d80fcd648bf211b4431e51a558
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "amity-react-native-social-ui-kit",
-  "version": "4.0.0-beta-14",
+  "version": "4.0.0-beta-15",
   "description": "Social UIKit",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -209,7 +209,7 @@
     ]
   },
   "dependencies": {
-    "@amityco/ts-sdk-react-native": "^6.30.0",
+    "@amityco/ts-sdk-react-native": "^6.30.4",
     "@amityco/video-broadcaster-react-native": "^1.0.0",
     "@amityco/video-player-react-native": "^1.0.0",
     "@devvie/bottom-sheet": "^0.3.0",

diff --git a/src/screens/CategorytList/index.tsx b/src/screens/CategorytList/index.tsx
@@ -1,10 +1,9 @@
 import { CategoryRepository } from '@amityco/ts-sdk-react-native';
-import React, { useEffect, useState, useCallback, useRef } from 'react';
+import React, { useEffect, useState, useRef } from 'react';
 import {
   FlatList,
   View,
   Text,
-  ActivityIndicator,
   Image,
   TouchableOpacity,
 } from 'react-native';
@@ -14,50 +13,37 @@ import useAuth from '../../hooks/useAuth';
 
 export default function CategoryList({ navigation }: any) {
   const { apiRegion } = useAuth();
-  const [categories, setCategories] = useState<Amity.Category[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [hasNextPage, setHasNextPage] = useState(false);
 
+  const [categoryObject, setCategoryObject] = useState<Amity.LiveCollection<Amity.Category>>();
+  const { data: categoryArr = [], onNextPage } = categoryObject ?? {};
   const styles = useStyles();
-  const onNextPageRef = useRef<(() => void) | null>(null);
-  const isFetchingRef = useRef(false);
+
+
   const onEndReachedCalledDuringMomentumRef = useRef(true);
   React.useLayoutEffect(() => {
-    // Set the headerRight component to a TouchableOpacity
     navigation.setOptions({
       headerLeft: () => <CloseButton />,
     });
   }, [navigation]);
   useEffect(() => {
     const loadCategories = async () => {
-      setLoading(true);
       try {
         const unsubscribe = CategoryRepository.getCategories(
-          { sortBy: 'name' },
-          ({ data, onNextPage, hasNextPage, loading }) => {
-            if (!loading) {
+          { sortBy: 'name', limit: 12 },
+          (data) => {
+            if (!data.loading) {
               if (data) {
-                const oldData = [...categories, ...data];
-                oldData.sort((a, b) => b.name.localeCompare(a.name));
-                setCategories(oldData);
+                setCategoryObject(data);
               }
-              setHasNextPage(hasNextPage);
-              onNextPageRef.current = onNextPage;
-              isFetchingRef.current = false;
-              unsubscribe();
             }
           }
         );
+        unsubscribe();
       } catch (error) {
         console.error('Failed to load categories:', error);
-        isFetchingRef.current = false;
-      } finally {
-        setLoading(false);
-      }
+      } 
     };
-
     loadCategories();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   const handleCategoryClick = (categoryId: string, categoryName: string) => {
     setTimeout(() => {
@@ -85,35 +71,17 @@ export default function CategoryList({ navigation }: any) {
     );
   };
 
-  const renderFooter = () => {
-    if (!loading) return null;
-    return (
-      <View style={styles.LoadingIndicator}>
-        <ActivityIndicator size="large" />
-      </View>
-    );
-  };
 
-  const handleEndReached = useCallback(() => {
-    if (
-      !isFetchingRef.current &&
-      hasNextPage &&
-      !onEndReachedCalledDuringMomentumRef.current
-    ) {
-      isFetchingRef.current = true;
-      onEndReachedCalledDuringMomentumRef.current = true;
-      onNextPageRef.current && onNextPageRef.current();
-    }
-  }, [hasNextPage]);
+  const handleEndReached=()=>{
+    onNextPage && onNextPage()
+  }
 
   return (
     <View style={styles.container}>
       <FlatList
-        data={categories}
+        data={categoryArr}
         renderItem={renderCategory}
         keyExtractor={(item) => item.categoryId.toString()}
-        ListFooterComponent={renderFooter}
-        // onEndReached={handleEndReached}
         onEndReached={handleEndReached}
         onMomentumScrollBegin={() =>
           (onEndReachedCalledDuringMomentumRef.current = false)

diff --git a/src/screens/Explore/index.tsx b/src/screens/Explore/index.tsx
@@ -51,7 +51,6 @@ export default function Explore() {
       { sortBy: 'name', limit: 8 },
       ({ data }) => {
         if (data) {
-          data.sort((a, b) => b.name.localeCompare(a.name));
           setCategoryList(data);
         }
       }

diff --git a/yarn.lock b/yarn.lock
@@ -2,10 +2,10 @@
 # yarn lockfile v1
 
 
-"@amityco/ts-sdk-react-native@^6.30.0":
-  version "6.30.2"
-  resolved "https://registry.yarnpkg.com/@amityco/ts-sdk-react-native/-/ts-sdk-react-native-6.30.2.tgz#c82c8f3c80549db4fb9f607901c388d20cd9dafb"
-  integrity sha512-QRmaeuY/m3zgwrT07TgYpuCEvxobvEorEdsT8XdV8aqgcOBn/3G4o+v7j4HmW98NIPfaM7qlnT6hVUn18dj7XA==
+"@amityco/ts-sdk-react-native@^6.30.4":
+  version "6.30.4"
+  resolved "https://registry.yarnpkg.com/@amityco/ts-sdk-react-native/-/ts-sdk-react-native-6.30.4.tgz#d260ae73ffc10c88ae1b86719be5e711e5b801ed"
+  integrity sha512-5P0/VcyvH9AaSII6Pk/ZRQUTzDG+uJDRuKRNV3CMYOjlotkYWLcoOwgik94oSoVZoTyKYwjvLBwTSiSlyXEByg==
   dependencies:
     "@react-native-async-storage/async-storage" "^1.17.7"
     "@react-native-community/netinfo" "^9.4.1"