From adc5124388ce164bfa44c4c74ebfef471800d4bb Mon Sep 17 00:00:00 2001 From: BFlat Date: Sat, 23 Dec 2023 16:56:16 +0700 Subject: [PATCH] lazylist update --- .../src/hooks/useLazyLists/useLazyLists.tsx | 5 ++ .../src/hooks/useLazyLists/useLazyListsv2.tsx | 76 ------------------- .../v2/view/pages/explore/tabs/WeightsTab.tsx | 11 ++- 3 files changed, 10 insertions(+), 82 deletions(-) delete mode 100644 packages/fakeyou.com/src/hooks/useLazyLists/useLazyListsv2.tsx diff --git a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx b/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx index 0471d736e6..eea6eacf4d 100644 --- a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx +++ b/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx @@ -63,6 +63,11 @@ export default function useLazyLists({ ...prevObj, [`${totalKeys}#${next}`]: res.results, }; + } else { + // Key exists, just update the existing data + const updatedObj = { ...prevObj }; + updatedObj[keyExists] = res.results; + return updatedObj; } }); nextSet(res.pagination.maybe_next || ""); diff --git a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyListsv2.tsx b/packages/fakeyou.com/src/hooks/useLazyLists/useLazyListsv2.tsx deleted file mode 100644 index fa9c62439c..0000000000 --- a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyListsv2.tsx +++ /dev/null @@ -1,76 +0,0 @@ -import { useEffect, useState } from "react"; - -interface Props { - addQueries?: any; - fetcher: any; - list: any; - listSet: any; - requestList?: boolean; -} - -export default function useLazyListsv2({ - addQueries, - fetcher, - list = [], - listSet, - requestList = false, -}: Props) { - const [filter, filterSet] = useState("all"); - const [next, nextSet] = useState(""); - const [sort, sortSet] = useState("newest"); - const [isLoading, setLoading] = useState(requestList); - const [isEnd, setEnd] = useState(false); - - useEffect(() => { - if (isLoading) { - fetcher( - "", - {}, - { - ...(next ? { cursor: next } : {}), - ...addQueries, - ...(filter !== "all" ? { filter_media_type: filter } : {}), - ...(sort !== "newest" ? { sort_ascending: true } : {}), - } - ).then((res: any) => { - if (res.results && res.pagination) { - listSet((prev: any) => [...prev, ...res.results]); - const hasMoreItems = res.pagination.maybe_next; - nextSet(hasMoreItems || ""); - setEnd(!hasMoreItems); - } else { - setEnd(true); - } - setLoading(false); - }); - } - }, [isLoading, fetcher, next, filter, sort, addQueries, listSet]); - - const getMore = () => { - if (next && !isLoading && !isEnd) { - setLoading(true); - } - }; - - const onChange = (event: { target: { name: string; value: any } }) => { - const { name, value } = event.target; - if (name === "filter") { - filterSet(value); - } else if (name === "sort") { - sortSet(value); - } - listSet([]); - nextSet(""); - setLoading(true); - setEnd(false); - }; - - return { - filter, - getMore, - list, - onChange, - isLoading, - isEnd, - }; -} diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx index 73c556e0b7..9602d4664d 100644 --- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/WeightsTab.tsx @@ -14,15 +14,14 @@ import { ListWeights } from "@storyteller/components/src/api/weights/ListWeights import { Weight } from "@storyteller/components/src/api/weights/GetWeight"; import InfiniteScroll from "react-infinite-scroll-component"; import { WeightCategory } from "@storyteller/components/src/api/_common/enums/WeightCategory"; -// import { useLazyLists } from "hooks"; -import useLazyListsv2 from "hooks/useLazyLists/useLazyListsv2"; +import { useLazyLists } from "hooks"; export default function WeightsTab() { const gridContainerRef = useRef(null); const [isLoading] = useState(false); const [list, listSet] = useState([]); - const weights = useLazyListsv2({ + const weights = useLazyLists({ fetcher: ListWeights, list, listSet, @@ -64,7 +63,7 @@ export default function WeightsTab() { <>
- {/* */} + /> {/* {selectedFilter === "tts" && (