From d754c20158dde61b9fb1578d44c3dc9fbc4037e1 Mon Sep 17 00:00:00 2001 From: smolgrrr Date: Fri, 15 Sep 2023 17:06:37 +1000 Subject: [PATCH] add PoW sorted feed --- client/src/components/Home.tsx | 22 +++----- .../src/components/PostCard/CardContainer.tsx | 2 +- .../src/components/PostCard/NewThreadCard.tsx | 5 +- client/src/components/PostCard/PostCard.tsx | 55 ++++++++++++++++--- client/src/utils/content.ts | 22 ++++++++ client/src/{func => utils}/mine.ts | 0 6 files changed, 82 insertions(+), 24 deletions(-) create mode 100644 client/src/utils/content.ts rename client/src/{func => utils}/mine.ts (100%) diff --git a/client/src/components/Home.tsx b/client/src/components/Home.tsx index 4abb16b..63a3efd 100644 --- a/client/src/components/Home.tsx +++ b/client/src/components/Home.tsx @@ -3,14 +3,8 @@ import { relayInit } from 'nostr-tools'; import PostCard from './PostCard/PostCard'; import Header from './Header/Header'; import NewThreadCard from './PostCard/NewThreadCard'; - -// Define the Event interface -interface Event { - id: string; - content: string; - created_at: number; - // Add other fields if necessary -} +import { getPow } from '../utils/mine'; +import { Event } from 'nostr-tools'; const relay = relayInit('wss://nostr.lu.ke'); @@ -24,14 +18,16 @@ const Home = () => { const eventList = await relay.list([ { - ids: ['00'], kinds: [1], - limit: 10, + limit: 200, }, ]); + // Filter events with a difficulty greater than 10 + const filteredEvents = eventList.filter(event => getPow(event.id) > 2); + // Assuming eventList is of type Event[] - setEvents(eventList); + setEvents(filteredEvents); }); relay.on('error', () => { @@ -46,8 +42,8 @@ const Home = () => {
- {events.sort((a, b) => a.created_at - b.created_at).map((event, index) => ( - + {events.sort((a, b) => b.created_at - a.created_at).map((event, index) => ( + ))}
diff --git a/client/src/components/PostCard/CardContainer.tsx b/client/src/components/PostCard/CardContainer.tsx index cc0467b..ff84b3d 100644 --- a/client/src/components/PostCard/CardContainer.tsx +++ b/client/src/components/PostCard/CardContainer.tsx @@ -2,7 +2,7 @@ import { PropsWithChildren } from 'react'; export default function CardContainer({ children }: PropsWithChildren) { return ( -
+
{children}
); diff --git a/client/src/components/PostCard/NewThreadCard.tsx b/client/src/components/PostCard/NewThreadCard.tsx index c983687..f0e1ffb 100644 --- a/client/src/components/PostCard/NewThreadCard.tsx +++ b/client/src/components/PostCard/NewThreadCard.tsx @@ -2,10 +2,12 @@ import CardContainer from './CardContainer'; import { ArrowUpTrayIcon } from '@heroicons/react/24/outline'; import { useState } from 'react'; import { generatePrivateKey, getPublicKey, finishEvent, relayInit} from 'nostr-tools'; -import { minePow } from '../../func/mine'; +import { minePow } from '../../utils/mine'; const difficulty = 10 +export const relay = relayInit('wss://nostr.lu.ke') + const NewThreadCard = () => { const [comment, setComment] = useState(""); @@ -14,7 +16,6 @@ const NewThreadCard = () => { let sk = generatePrivateKey() let pk = getPublicKey(sk) - const relay = relayInit('wss://nostr.lu.ke') relay.on('connect', () => { console.log(`connected to ${relay.url}`) }) diff --git a/client/src/components/PostCard/PostCard.tsx b/client/src/components/PostCard/PostCard.tsx index c0e6e19..6f5b000 100644 --- a/client/src/components/PostCard/PostCard.tsx +++ b/client/src/components/PostCard/PostCard.tsx @@ -1,4 +1,7 @@ import CardContainer from './CardContainer'; +import { FolderIcon } from '@heroicons/react/24/outline'; +import { parseContent } from '../../utils/content'; +import { Event } from 'nostr-tools'; const colorCombos = [ 'from-red-400 to-yellow-500', @@ -22,9 +25,33 @@ function getRandomElement(array: string[]): string { const index = Math.floor(Math.random() * array.length); return array[index]; } -const randomCombo = getRandomElement(colorCombos); +const timeAgo = (unixTime: number) => { + const seconds = Math.floor((new Date().getTime() / 1000) - unixTime); + + if (seconds < 60) return `now`; + + const minutes = Math.floor(seconds / 60); + if (minutes < 60) return `${minutes}m`; -const PostCard = ({ content }: { content: string }) => { + const hours = Math.floor(minutes / 60); + if (hours < 24) return `${hours}h`; + + const days = Math.floor(hours / 24); + return `${days} days ago`; +}; + +const PostCard = ({ event}: { event: Event }) => { + // Replace 10 with the actual number of comments for each post + const numberOfComments = 10; + + const { comment, file } = parseContent(event); + + // const replyList = await relay.list([ + // { + // kinds: [1], + // limit: 200, + // }, + // ]); return ( <> @@ -32,14 +59,26 @@ const PostCard = ({ content }: { content: string }) => {
-
-
Anonymous
+
+
Anonymous
-
1 day ago
-
-
- {content} +
+
{timeAgo(event.created_at)}
+ + {numberOfComments} +
+
+ {comment} +
+ {file !== "" && ( +
+ +
+ )}
diff --git a/client/src/utils/content.ts b/client/src/utils/content.ts new file mode 100644 index 0000000..379dec3 --- /dev/null +++ b/client/src/utils/content.ts @@ -0,0 +1,22 @@ +import { Event } from 'nostr-tools' + +function extractMediaUrl(content: string){ + const regex = /(https?:\/\/\S+\.(?:jpg|png|jpeg|gif|mp4|webm|mov|webp))/i; + const match = content.match(regex); + if (match) { + return match[0]; + + } else { + return '' ; + } + } + +export function parseContent(event: Event) { + const file = extractMediaUrl(event.content) as string; + const contentWithoutFile = event.content.replace(file, ''); + + return { + comment: contentWithoutFile.trim(), + file + }; +} \ No newline at end of file diff --git a/client/src/func/mine.ts b/client/src/utils/mine.ts similarity index 100% rename from client/src/func/mine.ts rename to client/src/utils/mine.ts