From b778cf6198680e3ec9970870d839bee7f6403bbf Mon Sep 17 00:00:00 2001 From: Ren Amamiya <123083837+reyamir@users.noreply.github.com> Date: Sun, 16 Apr 2023 08:31:40 +0700 Subject: [PATCH] fixed duplicate note in newsfeed and minor fixes --- src/app/newsfeed/following/page.tsx | 22 +++++++++---------- src/app/page.tsx | 2 +- src/components/eventCollector.tsx | 20 +++++++++-------- src/components/note/base.tsx | 14 ++++++------ src/components/note/comment.tsx | 6 ++--- src/components/note/extend.tsx | 6 ++--- src/components/note/parent.tsx | 8 +++---- src/components/note/preview/image.tsx | 6 ++--- src/components/note/{repost.tsx => quote.tsx} | 2 +- src/stores/note.tsx | 8 +++++++ 10 files changed, 51 insertions(+), 43 deletions(-) rename src/components/note/{repost.tsx => quote.tsx} (98%) diff --git a/src/app/newsfeed/following/page.tsx b/src/app/newsfeed/following/page.tsx index 82050d23..c2c1c484 100644 --- a/src/app/newsfeed/following/page.tsx +++ b/src/app/newsfeed/following/page.tsx @@ -4,19 +4,19 @@ import FormBase from '@components/form/base'; import { NoteBase } from '@components/note/base'; import { Placeholder } from '@components/note/placeholder'; -import { hasNewerNoteAtom } from '@stores/note'; +import { filteredNotesAtom, hasNewerNoteAtom, notesAtom } from '@stores/note'; import { dateToUnix } from '@utils/getDate'; -import { filterDuplicateParentID } from '@utils/transform'; import { ArrowUp } from 'iconoir-react'; -import { useAtom } from 'jotai'; -import { useCallback, useEffect, useRef, useState } from 'react'; +import { useAtom, useAtomValue, useSetAtom } from 'jotai'; +import { useCallback, useEffect, useRef } from 'react'; import { Virtuoso } from 'react-virtuoso'; export default function Page() { - const [data, setData] = useState([]); const [hasNewerNote, setHasNewerNote] = useAtom(hasNewerNoteAtom); + const setData = useSetAtom(notesAtom); + const data = useAtomValue(filteredNotesAtom); const virtuosoRef = useRef(null); const now = useRef(new Date()); @@ -45,7 +45,7 @@ export default function Page() { offset: offset.current, }); setData((data) => [...data, ...result]); - }, []); + }, [setData]); const loadMore = useCallback(async () => { const { getNotes } = await import('@utils/bindings'); @@ -57,14 +57,14 @@ export default function Page() { offset: offset.current, }); setData((data) => [...data, ...result]); - }, []); + }, [setData]); const loadLatest = useCallback(async () => { const { getLatestNotes } = await import('@utils/bindings'); // next query const result: any = await getLatestNotes({ date: dateToUnix(now.current) }); // update data - if (result.length > 0) { + if (Array.isArray(result)) { setData((data) => [...data, ...result]); } else { setData((data) => [...data, result]); @@ -72,8 +72,8 @@ export default function Page() { // hide newer trigger setHasNewerNote(false); // scroll to top - virtuosoRef.current.scrollToIndex({ index: 0 }); - }, [setHasNewerNote]); + virtuosoRef.current.scrollToIndex({ index: -1 }); + }, [setData, setHasNewerNote]); useEffect(() => { initialData().catch(console.error); @@ -94,7 +94,7 @@ export default function Page() { )} { - if (eose.current > relays.length - 7) { + if (eose.current > relays.length / 2) { router.replace('/newsfeed/following'); } else { eose.current += 1; diff --git a/src/components/eventCollector.tsx b/src/components/eventCollector.tsx index 2befeed7..0e0bb569 100644 --- a/src/components/eventCollector.tsx +++ b/src/components/eventCollector.tsx @@ -32,15 +32,17 @@ export default function EventCollector() { const { createPleb } = await import('@utils/bindings'); for (const tag of tags) { const pubkey = tag[1]; - const metadata: any = await fetchMetadata(pubkey); - - createPleb({ - pleb_id: pubkey + '-lume' + activeAccount.id.toString(), - pubkey: pubkey, - kind: 0, - metadata: metadata.content, - account_id: activeAccount.id, - }).catch(console.error); + fetchMetadata(pubkey) + .then((res: { content: string }) => { + createPleb({ + pleb_id: pubkey + '-lume' + activeAccount.id.toString(), + pubkey: pubkey, + kind: 0, + metadata: res.content, + account_id: activeAccount.id, + }).catch(console.error); + }) + .catch(console.error); } }, [activeAccount.id] diff --git a/src/components/note/base.tsx b/src/components/note/base.tsx index 2d120447..a3ec85f1 100644 --- a/src/components/note/base.tsx +++ b/src/components/note/base.tsx @@ -2,7 +2,7 @@ import NoteMetadata from '@components/note/metadata'; import { NoteParent } from '@components/note/parent'; import { ImagePreview } from '@components/note/preview/image'; import { VideoPreview } from '@components/note/preview/video'; -import { NoteRepost } from '@components/note/repost'; +import { NoteQuote } from '@components/note/quote'; import { UserExtend } from '@components/user/extend'; import { UserMention } from '@components/user/mention'; @@ -48,10 +48,10 @@ export const NoteBase = memo(function NoteBase({ event }: { event: any }) { parsedContent = reactStringReplace(parsedContent, /\#\[(\d+)\]/gm, (match, i) => { if (tags[match][0] === 'p') { // @-mentions - return ; + return ; } else if (tags[match][0] === 'e') { - // note-mentions - return ; + // note-quotes + return ; } else { return; } @@ -61,10 +61,10 @@ export const NoteBase = memo(function NoteBase({ event }: { event: any }) { return parsedContent; }, [event.content, event.tags]); - const getParent = useMemo(() => { + const parentNote = useMemo(() => { if (event.parent_id) { if (event.parent_id !== event.eventId && !event.content.includes('#[0]')) { - return ; + return ; } } @@ -90,7 +90,7 @@ export const NoteBase = memo(function NoteBase({ event }: { event: any }) { onClick={(e) => openThread(e)} className="relative z-10 m-0 flex h-min min-h-min w-full select-text flex-col border-b border-zinc-800 px-3 py-5 hover:bg-black/20" > - <>{getParent} + <>{parentNote}
openUserPage(e)}> diff --git a/src/components/note/comment.tsx b/src/components/note/comment.tsx index da739b18..ea21b47a 100644 --- a/src/components/note/comment.tsx +++ b/src/components/note/comment.tsx @@ -1,7 +1,7 @@ import NoteMetadata from '@components/note/metadata'; import { ImagePreview } from '@components/note/preview/image'; import { VideoPreview } from '@components/note/preview/video'; -import { NoteRepost } from '@components/note/repost'; +import { NoteQuote } from '@components/note/quote'; import { UserExtend } from '@components/user/extend'; import { UserMention } from '@components/user/mention'; @@ -46,8 +46,8 @@ export const NoteComment = memo(function NoteComment({ event }: { event: any }) // @-mentions return ; } else if (tags[match][0] === 'e') { - // note-mentions - return ; + // note-quotes + return ; } else { return; } diff --git a/src/components/note/extend.tsx b/src/components/note/extend.tsx index 255343b4..2469499d 100644 --- a/src/components/note/extend.tsx +++ b/src/components/note/extend.tsx @@ -1,7 +1,7 @@ import NoteMetadata from '@components/note/metadata'; import { ImagePreview } from '@components/note/preview/image'; import { VideoPreview } from '@components/note/preview/video'; -import { NoteRepost } from '@components/note/repost'; +import { NoteQuote } from '@components/note/quote'; import { UserLarge } from '@components/user/large'; import { UserMention } from '@components/user/mention'; @@ -46,8 +46,8 @@ export const NoteExtend = memo(function NoteExtend({ event }: { event: any }) { // @-mentions return ; } else if (tags[match][0] === 'e') { - // note-mentions - return ; + // note-quotes + return ; } else { return; } diff --git a/src/components/note/parent.tsx b/src/components/note/parent.tsx index 4661142b..2a95069e 100644 --- a/src/components/note/parent.tsx +++ b/src/components/note/parent.tsx @@ -1,7 +1,7 @@ import NoteMetadata from '@components/note/metadata'; import { ImagePreview } from '@components/note/preview/image'; import { VideoPreview } from '@components/note/preview/video'; -import { NoteRepost } from '@components/note/repost'; +import { NoteQuote } from '@components/note/quote'; import { RelayContext } from '@components/relaysProvider'; import { UserExtend } from '@components/user/extend'; import { UserMention } from '@components/user/mention'; @@ -117,10 +117,10 @@ export const NoteParent = memo(function NoteParent({ id }: { id: string }) { parsedContent = reactStringReplace(parsedContent, /\#\[(\d+)\]/gm, (match, i) => { if (tags[match][0] === 'p') { // @-mentions - return ; + return ; } else if (tags[match][0] === 'e') { - // note-mentions - return ; + // note-quotes + return ; } else { return; } diff --git a/src/components/note/preview/image.tsx b/src/components/note/preview/image.tsx index 2bc87f40..7f06c4a9 100644 --- a/src/components/note/preview/image.tsx +++ b/src/components/note/preview/image.tsx @@ -3,16 +3,14 @@ import { memo } from 'react'; export const ImagePreview = memo(function ImagePreview({ url }: { url: string }) { return ( -
+
{url}
diff --git a/src/components/note/repost.tsx b/src/components/note/quote.tsx similarity index 98% rename from src/components/note/repost.tsx rename to src/components/note/quote.tsx index b115a809..77059077 100644 --- a/src/components/note/repost.tsx +++ b/src/components/note/quote.tsx @@ -9,7 +9,7 @@ import destr from 'destr'; import { memo, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'; import reactStringReplace from 'react-string-replace'; -export const NoteRepost = memo(function NoteRepost({ id }: { id: string }) { +export const NoteQuote = memo(function NoteRepost({ id }: { id: string }) { const [pool, relays]: any = useContext(RelayContext); const [activeAccount]: any = useLocalStorage('activeAccount', {}); diff --git a/src/stores/note.tsx b/src/stores/note.tsx index 920ab931..f071bbb6 100644 --- a/src/stores/note.tsx +++ b/src/stores/note.tsx @@ -1,7 +1,15 @@ import { atom } from 'jotai'; import { atomWithReset } from 'jotai/utils'; +// notes +export const notesAtom = atom([]); +export const filteredNotesAtom = atom((get) => { + const notes = get(notesAtom); + return notes.filter((item, index) => index === notes.findIndex((other) => item.parent_id === other.parent_id)); +}); + // note content export const noteContentAtom = atomWithReset(''); + // notify user that connector has receive newer note export const hasNewerNoteAtom = atom(false);