Kieran/snort
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

don't reload for you feed on refresh

Browse Source
This commit is contained in:
Martti Malmi 2024-02-16 13:17:05 +02:00
parent 5e1af603b7
commit ce5fbf0819
4 changed files with 29 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/app/src/Components/Feed/Timeline.tsx
View File

@ -6,6 +6,7 @@ import { useCallback, useMemo, useState } from "react";
import { DisplayAs, DisplayAsSelector } from "@/Components/Feed/DisplayAsSelector";
import { TimelineRenderer } from "@/Components/Feed/TimelineRenderer";
import useTimelineFeed, { TimelineFeed, TimelineSubject } from "@/Feed/TimelineFeed";
import useHistoryState from "@/Hooks/useHistoryState";
import useLogin from "@/Hooks/useLogin";
import { dedupeByPubkey } from "@/Utils";
@ -27,13 +28,15 @@ export interface TimelineProps {
*/
const Timeline = (props: TimelineProps) => {
const login = useLogin();
const feedOptions = useMemo(() => {
return {
const [openedAt] = useHistoryState(Math.floor(Date.now() / 1000), "openedAt");
const feedOptions = useMemo(
() => ({
method: props.method,
window: props.window,
now: props.now,
};
}, [props]);
now: props.now ?? openedAt,
}),
[props],
);
const feed: TimelineFeed = useTimelineFeed(props.subject, feedOptions);
const displayAsInitial = props.displayAs ?? login.feedDisplayAs ?? "list";
const [displayAs, setDisplayAs] = useState<DisplayAs>(displayAsInitial);

4
packages/app/src/Components/Feed/TimelineFollows.tsx
View File

@ -7,6 +7,7 @@ import { Link } from "react-router-dom";
import { DisplayAs, DisplayAsSelector } from "@/Components/Feed/DisplayAsSelector";
import { TimelineRenderer } from "@/Components/Feed/TimelineRenderer";
import useTimelineFeed, { TimelineFeedOptions, TimelineSubject } from "@/Feed/TimelineFeed";
import useHistoryState from "@/Hooks/useHistoryState";
import useLogin from "@/Hooks/useLogin";
import { dedupeByPubkey } from "@/Utils";
@ -27,6 +28,7 @@ const TimelineFollows = (props: TimelineFollowsProps) => {
const login = useLogin();
const displayAsInitial = props.displayAs ?? login.feedDisplayAs ?? "list";
const [displayAs, setDisplayAs] = useState<DisplayAs>(displayAsInitial);
const [openedAt] = useHistoryState(Math.floor(Date.now() / 1000), "openedAt");
const subject = useMemo(
() =>
({
@ -41,7 +43,7 @@ const TimelineFollows = (props: TimelineFollowsProps) => {
}) as TimelineSubject,
[login.follows.item, login.tags.item],
);
const feed = useTimelineFeed(subject, { method: "TIME_RANGE" } as TimelineFeedOptions);
const feed = useTimelineFeed(subject, { method: "TIME_RANGE", now: openedAt } as TimelineFeedOptions);
// TODO allow reposts:
const postsOnly = useCallback(

2
packages/app/src/Components/ScrollToTop.tsx
View File

@ -3,7 +3,7 @@ import { useLocation, useNavigationType } from "react-router-dom";
export default function ScrollToTop() {
const { pathname } = useLocation();
const navigationType = useNavigationType(); // This hook is available in React Router v6
const navigationType = useNavigationType();
useEffect(() => {
if (navigationType !== "POP") {

23
packages/app/src/Pages/Root/ForYouTab.tsx
View File

@ -1,13 +1,14 @@
import { EventKind, NostrEvent, RequestBuilder, TaggedNostrEvent } from "@snort/system";
import { memo, useEffect, useMemo, useState } from "react";
import { FormattedMessage } from "react-intl";
import { Link } from "react-router-dom";
import { Link, useNavigationType } from "react-router-dom";
import { Relay } from "@/Cache";
import { DisplayAs, DisplayAsSelector } from "@/Components/Feed/DisplayAsSelector";
import { TimelineRenderer } from "@/Components/Feed/TimelineRenderer";
import { TaskList } from "@/Components/Tasks/TaskList";
import useTimelineFeed, { TimelineFeedOptions, TimelineSubject } from "@/Feed/TimelineFeed";
import useHistoryState from "@/Hooks/useHistoryState";
import useLogin from "@/Hooks/useLogin";
import messages from "@/Pages/messages";
import { System } from "@/system";
@ -64,9 +65,12 @@ export const ForYouTab = memo(function ForYouTab() {
const displayAsInitial = feedDisplayAs ?? "list";
const [displayAs, setDisplayAs] = useState<DisplayAs>(displayAsInitial);
const { publicKey } = useLogin();
const navigationType = useNavigationType();
const [openedAt] = useHistoryState(Math.floor(Date.now() / 1000), "openedAt");
if (!reactionsRequested && publicKey) {
reactionsRequested = true;
// on first load, ask relays for reactions to events by follows
getReactedByFollows(follows.item);
}
@ -86,11 +90,15 @@ export const ForYouTab = memo(function ForYouTab() {
[login.follows.item, login.tags.item],
);
// also get "follows" feed so data is loaded from relays and there's a fallback if "for you" feed is empty
const latestFeed = useTimelineFeed(subject, { method: "TIME_RANGE" } as TimelineFeedOptions);
const latestFeed = useTimelineFeed(subject, { method: "TIME_RANGE", now: openedAt } as TimelineFeedOptions);
const filteredLatestFeed = useMemo(() => {
// no replies
return latestFeed.main?.filter((ev: NostrEvent) => !ev.tags.some((tag: string[]) => tag[0] === "e")) ?? [];
}, [latestFeed.main]);
return (
latestFeed.main?.filter((ev: NostrEvent) => {
// no replies
return !ev.tags.some((tag: string[]) => tag[0] === "e");
}) ?? []
);
}, [latestFeed.main, subject]);
const getFeed = () => {
if (!publicKey) {
@ -115,7 +123,10 @@ export const ForYouTab = memo(function ForYouTab() {
};
useEffect(() => {
if (forYouFeed.events.length < 10 || Date.now() - forYouFeed.created_at > 1000 * 60 * 2) {
if (
forYouFeed.events.length < 10 ||
(navigationType !== "POP" && Date.now() - forYouFeed.created_at > 1000 * 60 * 2)
) {
getFeed();
}
}, []);