From f7786861f5fb5d56dec55706c71517bc1e4f3730 Mon Sep 17 00:00:00 2001 From: Victor Date: Tue, 30 Jan 2024 23:23:22 -0800 Subject: [PATCH 1/2] initial back to top button --- .../src/hooks/useLazyLists/useLazyLists.tsx | 14 ++++++++++++-- .../src/v2/view/pages/explore/tabs/MediaTab.tsx | 5 ++++- .../src/v2/view/pages/explore/tabs/WeightsTab.tsx | 3 ++- 3 files changed, 18 insertions(+), 4 deletions(-) diff --git a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx b/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx index 66111ff0b9..66ef5480ec 100644 --- a/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx +++ b/packages/fakeyou.com/src/hooks/useLazyLists/useLazyLists.tsx @@ -32,7 +32,8 @@ export default function useLazyLists({ const { pathname, search: locSearch } = useLocation(); const history = useHistory(); const urlQueries = new URLSearchParams(locSearch); - const [next, nextSet] = useState(urlQueries.get("cursor") || ""); + const urlCursor = urlQueries.get("cursor"); + const [next, nextSet] = useState(urlCursor || ""); const [previous, previousSet] = useState(""); // I am not used for anything yet :) const [sort, sortSet] = useState(urlQueries.get("sort_ascending") === "true"); const [status, statusSet] = useState( @@ -61,6 +62,13 @@ export default function useLazyLists({ statusSet(FetchStatus.ready); }; + const reset = () => { + listSet([]); // Reset list on filter/sort change + nextSet(""); + previousSet(""); + statusSet(FetchStatus.ready); + } + useEffect(() => { const queries = { ...(next ? { cursor: next } : {}), @@ -98,7 +106,7 @@ export default function useLazyLists({ } }); nextSet(res.pagination.maybe_next || ""); - previousSet(res.pagination.maybe_next); + previousSet(res.pagination.maybe_previous); } }); } @@ -127,10 +135,12 @@ export default function useLazyLists({ next, onChange, previous, + reset, sort, sortSet, status, statusSet, totalKeys, + urlCursor }; } diff --git a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx index 92ca0b7cec..2f5adc56db 100644 --- a/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx +++ b/packages/fakeyou.com/src/v2/view/pages/explore/tabs/MediaTab.tsx @@ -2,7 +2,7 @@ import React, { useRef, useState } from "react"; import { useLocation } from "react-router-dom"; import MasonryGrid from "components/common/MasonryGrid/MasonryGrid"; import MediaCards from "components/common/Card/MediaCards"; -import { TempSelect } from "components/common"; +import { Button, TempSelect } from "components/common"; import { faArrowDownWideShort, faFilter, @@ -59,6 +59,8 @@ export default function MediaTab() { // { value: "mostliked", label: "Most Liked" }, ]; + console.log("💎",media.urlCursor); + return ( <>
@@ -82,6 +84,7 @@ export default function MediaTab() { }} />
+ { media.urlCursor ?