From 463143187427d10258b3c9f0232bbd7e874fd9e7 Mon Sep 17 00:00:00 2001 From: smolgrrr Date: Tue, 31 Oct 2023 11:09:35 +1100 Subject: [PATCH] more work --- client/src/components/Header/Header.tsx | 2 +- client/src/components/Home.tsx | 2 +- client/src/components/Modals/LinkPreview.tsx | 19 ++++++----- client/src/components/Thread/ReplyCard.tsx | 7 ++-- client/src/components/Thread/Thread.tsx | 29 ++++++++++++++-- client/src/utils/subscriptions.ts | 36 +++++++++++++++++++- 6 files changed, 76 insertions(+), 19 deletions(-) diff --git a/client/src/components/Header/Header.tsx b/client/src/components/Header/Header.tsx index e878924..001204b 100644 --- a/client/src/components/Header/Header.tsx +++ b/client/src/components/Header/Header.tsx @@ -6,7 +6,7 @@ export default function Header() {
- + The Anon Operation
diff --git a/client/src/components/Home.tsx b/client/src/components/Home.tsx index 2d89dee..17fb4b4 100644 --- a/client/src/components/Home.tsx +++ b/client/src/components/Home.tsx @@ -8,7 +8,7 @@ import { uniqBy } from '../utils/utils'; const Home = () => { const [events, setEvents] = useState([]); - const [filterDifficulty, setFilterDifficulty] = useState(localStorage.getItem('filterDifficulty') || '12'); + const [filterDifficulty, setFilterDifficulty] = useState(localStorage.getItem('filterDifficulty') || '21'); const onEvent = (event: Event) => { setEvents((prevEvents) => [...prevEvents, event]); diff --git a/client/src/components/Modals/LinkPreview.tsx b/client/src/components/Modals/LinkPreview.tsx index e334557..7ef41ba 100644 --- a/client/src/components/Modals/LinkPreview.tsx +++ b/client/src/components/Modals/LinkPreview.tsx @@ -2,19 +2,20 @@ import { getLinkPreview } from 'link-preview-js'; import { useState, useEffect } from 'react'; +//Need to move this all server side const LinkModal = ({ url }: { url: string}) => { const [linkPreview, setLinkPreview] = useState(null); useEffect(() => { - getLinkPreview(url) - .then((preview) => setLinkPreview(preview as LinkPreview)) - .catch((error) => console.error(error)); - - }, [url]); - - if (!linkPreview) { - return <>; // or some loading state - } + getLinkPreview(url) + .then((preview) => setLinkPreview(preview as LinkPreview)) + .catch((error) => console.error(error)); + + }, [url]); + + if (!linkPreview) { + return {url}; // or some loading state + } return (
diff --git a/client/src/components/Thread/ReplyCard.tsx b/client/src/components/Thread/ReplyCard.tsx index c839871..818f01d 100644 --- a/client/src/components/Thread/ReplyCard.tsx +++ b/client/src/components/Thread/ReplyCard.tsx @@ -58,18 +58,15 @@ const timeAgo = (unixTime: number) => { const ReplyCard = ({ event, metadata, replyCount, repliedTo }: { event: Event, metadata: Event | null, replyCount: number, repliedTo: Event[] }) => { const { comment, file } = parseContent(event); const colorCombo = getColorFromHash(event.pubkey, colorCombos); - const [events, setEvents] = useState([]); + // const [events, setEvents] = useState([]); let metadataParsed = null; if (metadata !== null) { metadataParsed = getMetadata(metadata); } - const replyPubkeys = event.tags.filter(tag => tag[0] === 'p'); + // const replyPubkeys = event.tags.filter(tag => tag[0] === 'p'); - useEffect(() => { - console.log(repliedTo) - }, []); return ( <> diff --git a/client/src/components/Thread/Thread.tsx b/client/src/components/Thread/Thread.tsx index e748ccb..072304a 100644 --- a/client/src/components/Thread/Thread.tsx +++ b/client/src/components/Thread/Thread.tsx @@ -1,7 +1,7 @@ import { useParams } from 'react-router-dom'; import { useState } from "react"; import { Event, nip19 } from "nostr-tools" -import { subNote } from '../../utils/subscriptions'; +import { subNote, subNotesOnce } from '../../utils/subscriptions'; import { useEffect } from 'react'; import { uniqBy } from '../../utils/utils'; import { DocumentTextIcon, FolderPlusIcon } from '@heroicons/react/24/outline'; @@ -21,6 +21,8 @@ const Thread = () => { let decodeResult = nip19.decode(id as string); const [showForm, setShowForm] = useState(false); const [postType, setPostType] = useState(""); + const [hasRun, setHasRun] = useState(false); + const [preOPEvents, setPreOPEvents] = useState(['']); // Define your callback function for subGlobalFeed const onEvent = (event: Event, relay: string) => { @@ -35,6 +37,7 @@ const Thread = () => { } // Subscribe to global feed when the component mounts // Optionally, return a cleanup function to unsubscribe when the component unmounts + return () => { // Your cleanup code here }; @@ -42,6 +45,16 @@ const Thread = () => { const uniqEvents = events.length > 0 ? uniqBy(events, "id") : []; + useEffect(() => { + if (!hasRun && events.length > 0) { + let OPNoteEvents = events[0].tags.filter(tag => tag[0] === 'e').map(tag => tag[1]); + console.log(OPNoteEvents); + setHasRun(true); + setPreOPEvents(OPNoteEvents) + subNotesOnce(OPNoteEvents, onEvent) + } + }, [uniqEvents, hasRun]); + const getMetadataEvent = (event: Event) => { const metadataEvent = uniqEvents.find(e => e.pubkey === event.pubkey && e.kind === 0); if (metadataEvent) { @@ -58,6 +71,13 @@ const Thread = () => { return uniqEvents.filter(e => event.tags.some(tag => tag[0] === 'p' && tag[1] === e.pubkey)); } + const earlierEvents = uniqEvents + .filter(event => + event.kind === 1 && + preOPEvents.includes(event.id) + ) + .sort((a, b) => (b.created_at as any) - (a.created_at as any)); + if (!uniqEvents[0]) { return ( <> @@ -85,6 +105,11 @@ const Thread = () => { <>
+ {earlierEvents + .filter(event => event.kind === 1) + .sort((a, b) => a.created_at - b.created_at).map((event, index) => ( + + ))}
{
{/* This is the white line separator */} - {uniqEvents + {uniqEvents .slice(1) .filter(event => event.kind === 1) .sort((a, b) => a.created_at - b.created_at).map((event, index) => ( diff --git a/client/src/utils/subscriptions.ts b/client/src/utils/subscriptions.ts index d36f053..1ef1f8f 100644 --- a/client/src/utils/subscriptions.ts +++ b/client/src/utils/subscriptions.ts @@ -202,4 +202,38 @@ export const subNoteOnce = ( }); pubkeys.clear(); }, 2000); -}; \ No newline at end of file +}; + +/** quick subscribe to a note id (nip-19) */ +export const subNotesOnce = ( + eventIds: string[], + onEvent: SubCallback, +) => { + const pubkeys = new Set(); + sub({ + cb: (evt, relay) => { + pubkeys.add(evt.pubkey); + onEvent(evt, relay); + }, + filter: { + ids: eventIds, + kinds: [1], + limit: 1, + }, + unsub: true, + }); + + setTimeout(() => { + // get profile info + sub({ + cb: onEvent, + filter: { + authors: Array.from(pubkeys), + kinds: [0], + limit: pubkeys.size, + }, + unsub: true, + }); + pubkeys.clear(); + }, 2000); +}; \ No newline at end of file