-
+
{formatDate(noteEvent.created_at * 1000, 'hh:mm aa')}{' '}
-
-
+
+
{formatDate(noteEvent.created_at * 1000, 'dd/MM/yyyy')}
-
+
)}
-
-
+
+
+
@@ -58,12 +60,18 @@ export const NoteWrapper = ({ noteEntity }: NoteWrapperProps) => {
{note.created_at && (
)}
+
+ {showNsfwPopup && (
+ This post is hidden as it's marked as NSFW
+ +
-
-
*/}
+
+ {comment.event.kind === NDKKind.Text && (
+ <>
+ {/* Quote Repost, Kind 1 */}
+ 0
-
-
-
- setShowQuoteRepostPopup(true)
+ : undefined
+ }
+ >
+
+
+ {showQuoteRepostPopup && (
+ + {quoteRepostEvents.length} +
+
+
+
+ setShowRepostPopup(true)
+ : undefined
+ }
+ >
+
+
+ {showRepostPopup && (
+ + {repostEvents.length} +
+
+
+
+ Hide full post
+
-
+ )}
+ {isNsfw && (
+ {isExpanded ? 'Hide' : 'View'} full post
+View full post
+
+
)}
diff --git a/src/components/comment/CommentsPopup.tsx b/src/components/comment/CommentsPopup.tsx
index d19e127..b7c4d80 100644
--- a/src/components/comment/CommentsPopup.tsx
+++ b/src/components/comment/CommentsPopup.tsx
@@ -1,5 +1,11 @@
import { formatDate } from 'date-fns'
-import { useBodyScrollDisable, useNDKContext, useReplies } from 'hooks'
+import {
+ useAppSelector,
+ useBodyScrollDisable,
+ useDidMount,
+ useNDKContext,
+ useReplies
+} from 'hooks'
import { nip19 } from 'nostr-tools'
import { ChangeEvent, useCallback, useEffect, useMemo, useState } from 'react'
import {
@@ -7,7 +13,9 @@ import {
useLoaderData,
useLocation,
useNavigate,
- useParams
+ useNavigation,
+ useParams,
+ useSubmit
} from 'react-router-dom'
import {
appRoutes,
@@ -24,8 +32,21 @@ import { Comment } from './Comment'
import { useComments } from 'hooks/useComments'
import { CommentContent } from './CommentContent'
import { Dots } from 'components/Spinner'
+import {
+ NDKEvent,
+ NDKFilter,
+ NDKKind,
+ NDKSubscriptionCacheUsage
+} from '@nostr-dev-kit/ndk'
+import { NoteQuoteRepostPopup } from 'components/Notes/NoteQuoteRepostPopup'
+import { NoteRepostPopup } from 'components/Notes/NoteRepostPopup'
+import _ from 'lodash'
-export const CommentsPopup = () => {
+interface CommentsPopupProps {
+ title: string
+}
+
+export const CommentsPopup = ({ title }: CommentsPopupProps) => {
const { naddr } = useParams()
const location = useLocation()
const { ndk } = useNDKContext()
@@ -43,12 +64,14 @@ export const CommentsPopup = () => {
? `${appRoutes.feed}/`
: undefined
const { event } = useLoaderData() as CommentsLoaderResult
+ const eTags = event.getMatchingTags('e')
+ const lastETag = _.last(eTags)
const {
size,
parent: replyEvent,
isComplete,
root: rootEvent
- } = useReplies(event.tagValue('e'))
+ } = useReplies(lastETag?.[1])
const isRoot = event.tagValue('a') === event.tagValue('A')
const [profile, setProfile] = useStateNSFW
@@ -119,7 +216,7 @@ export const CommentsPopup = () => {
([])
+ const [isFetching, setIsFetching] = useState(false)
+ const [isLoadMoreVisible, setIsLoadMoreVisible] = useState(true)
+ const [showing, setShowing] = useState(SHOWING_STEP)
+
+ const filterKey = 'filter-feed-2'
+ const [filterOptions] = useLocalStorage(
+ filterKey,
+ DEFAULT_FILTER_OPTIONS
+ )
+
+ useEffect(() => {
+ setIsFetching(true)
+ setIsLoadMoreVisible(true)
+
+ const filter: NDKFilter = {
+ authors: [profilePubkey],
+ kinds: [NDKKind.Text, NDKKind.Repost],
+ limit: 50
+ }
+
+ ndk
+ .fetchEvents(filter, {
+ closeOnEose: true,
+ cacheUsage: NDKSubscriptionCacheUsage.PARALLEL
+ })
+ .then((ndkEventSet) => {
+ const ndkEvents = Array.from(ndkEventSet)
+ setNotes(ndkEvents)
+ })
+ .finally(() => {
+ setIsFetching(false)
+ })
+ }, [ndk, profilePubkey])
+
+ const filteredNotes = useMemo(() => {
+ let _notes = notes || []
+ _notes = _notes.filter((n) => {
+ if (n.kind === NDKKind.Text) {
+ // Filter out the replies (Kind 1 events with e tags are replies to other kind 1 events)
+ return n.getMatchingTags('e').length === 0
+ }
+ // Filter repost events if the option is set to hide reposts
+ return !(
+ n.kind === NDKKind.Repost &&
+ filterOptions.repost === RepostFilter.Hide_Repost
+ )
+ })
+
+ _notes = _notes.sort((a, b) => (b.created_at ?? 0) - (a.created_at ?? 0))
+
+ showing > 0 && _notes.splice(showing)
+ return _notes
+ }, [filterOptions.repost, notes, showing])
+
+ const handleLoadMore = () => {
+ const LOAD_MORE_STEP = SHOWING_STEP * 2
+ setShowing((prev) => prev + SHOWING_STEP)
+ const lastNote = notes[notes.length - 1]
+ const filter: NDKFilter = {
+ authors: [profilePubkey],
+ kinds: [NDKKind.Text, NDKKind.Repost],
+ limit: LOAD_MORE_STEP
+ }
+
+ filter.until = lastNote.created_at
+
+ setIsFetching(true)
+ ndk
+ .fetchEvents(filter, {
+ closeOnEose: true,
+ cacheUsage: NDKSubscriptionCacheUsage.PARALLEL
+ })
+ .then((ndkEventSet) => {
+ setNotes((prevNotes) => {
+ const newNotes = Array.from(ndkEventSet)
+ const combinedNotes = [...prevNotes, ...newNotes]
+ const uniqueBlogs = Array.from(
+ new Set(combinedNotes.map((b) => b.id))
+ )
+ .map((id) => combinedNotes.find((b) => b.id === id))
+ .filter((b) => b !== undefined)
+
+ if (newNotes.length < LOAD_MORE_STEP) {
+ setIsLoadMoreVisible(false)
+ }
+
+ return uniqueBlogs
+ })
+ })
+ .finally(() => {
+ setIsFetching(false)
+ })
+ }
+
+ return (
+ <>
+
diff --git a/src/types/note.ts b/src/types/note.ts
index 5e2f179..a6c6204 100644
--- a/src/types/note.ts
+++ b/src/types/note.ts
@@ -1,6 +1,29 @@
+import { NostrEvent } from '@nostr-dev-kit/ndk'
+
export interface NoteSubmitForm {
content: string
nsfw: boolean
}
export interface NoteSubmitFormErrors extends Partial {}
+
+export type NoteAction =
+ | {
+ intent: 'submit'
+ data: NoteSubmitForm
+ }
+ | {
+ intent: 'repost'
+ note1: string
+ data: NostrEvent
+ }
+
+export type NoteSubmitActionResult =
+ | {
+ type: 'timeout'
+ action: NoteAction
+ }
+ | {
+ type: 'validation'
+ formErrors: NoteSubmitFormErrors
+ }
diff --git a/src/utils/comments.ts b/src/utils/comments.ts
index 74c4438..db9668b 100644
--- a/src/utils/comments.ts
+++ b/src/utils/comments.ts
@@ -104,3 +104,5 @@ export function handleCommentSubmit(
}
}
}
+
+export const NOTE_DRAFT_CACHE_KEY = 'draft-note'
diff --git a/src/utils/url.ts b/src/utils/url.ts
index c64815c..058ce09 100644
--- a/src/utils/url.ts
+++ b/src/utils/url.ts
@@ -60,6 +60,11 @@ export const isValidImageUrl = (url: string) => {
return regex.test(url)
}
+export const isValidVideoUrl = (url: string) => {
+ const regex = /\.(mp4|mkv|webm|mov)$/
+ return regex.test(url)
+}
+
export const isReachable = async (url: string) => {
try {
const response = await fetch(url, { method: 'HEAD' })
-
Comment replies
+{title}
{
setShowQuoteRepostPopup(false)}
+ />
+ )}
+
+ {/* Repost, Kind 6 */}
+ setShowRepostPopup(false)}
+ />
+ )}
+
+ )}
{typeof profile?.lud16 !== 'undefined' &&
profile.lud16 !== '' && (filterKey, {
- ...DEFAULT_FILTER_OPTIONS
- })
+
const { ndk } = useNDKContext()
const [notes, setNotes] = useState([])
+ const [discoveredNotes, setDiscoveredNotes] = useState([])
const [isFetching, setIsFetching] = useState(false)
const [isLoadMoreVisible, setIsLoadMoreVisible] = useState(true)
const [showing, setShowing] = useState(SHOWING_STEP)
+ const filterKey = 'filter-feed-2'
+ const [filterOptions] = useLocalStorage(
+ filterKey,
+ DEFAULT_FILTER_OPTIONS
+ )
+
useEffect(() => {
if (!userPubkey) return
setIsFetching(true)
setIsLoadMoreVisible(true)
+ let sub: NDKSubscription
+
const filter: NDKFilter = {
authors: [...followList, userPubkey],
kinds: [NDKKind.Text, NDKKind.Repost],
@@ -47,60 +55,98 @@ export const FeedTabPosts = () => {
cacheUsage: NDKSubscriptionCacheUsage.PARALLEL
})
.then((ndkEventSet) => {
- const ndkEvents = Array.from(ndkEventSet)
+ const ndkEvents = Array.from(ndkEventSet).sort(
+ (a, b) => (b.created_at ?? 0) - (a.created_at ?? 0)
+ )
setNotes(ndkEvents)
+ const firstNote = ndkEvents[0]
+ const filter: NDKFilter = {
+ authors: [...followList, userPubkey],
+ kinds: [NDKKind.Text, NDKKind.Repost],
+ since: firstNote.created_at
+ }
+ sub = ndk.subscribe(filter, {
+ closeOnEose: false,
+ cacheUsage: NDKSubscriptionCacheUsage.PARALLEL
+ })
+ sub.on('event', (ndkEvent) => {
+ setDiscoveredNotes((prev) => {
+ // Skip existing
+ if (
+ prev.find(
+ (e) =>
+ e.id === ndkEvent.id ||
+ ndkEvents.findIndex((n) => n.id === ndkEvent.id) === -1
+ )
+ ) {
+ return [...prev]
+ }
+
+ return [...prev, ndkEvent]
+ })
+ })
+ sub.start()
})
.finally(() => {
setIsFetching(false)
})
+
+ return () => {
+ if (sub) sub.stop()
+ }
}, [followList, ndk, userPubkey])
const filteredNotes = useMemo(() => {
let _notes = notes || []
- // Filter nsfw (Hide_NSFW option)
- _notes = _notes.filter(
- (n) =>
- !(
- filterOptions.nsfw === NSFWFilter.Hide_NSFW &&
- n.tagValue('L') === 'content-warning'
- )
- )
-
// Filter source
- _notes = _notes.filter(
- (n) =>
- !(
- filterOptions.source === window.location.host &&
- n
- .getMatchingTags('l')
- .some((l) => l[1] === window.location.host && l[2] === 'source')
- )
- )
+ // TODO: Enable source/client filter
+ // _notes = _notes.filter(
+ // (n) =>
+ // !(
+ // filterOptions.source === window.location.host &&
+ // n
+ // .getMatchingTags('l')
+ // .some((l) => l[1] === window.location.host && l[2] === 'source')
+ // )
+ // )
- // Filter reply events
- _notes = _notes.filter((n) => n.getMatchingTags('e').length === 0)
+ _notes = _notes.filter((n) => {
+ if (n.kind === NDKKind.Text) {
+ // Filter out the replies (Kind 1 events with e tags are replies to other kind 1 events)
+ return n.getMatchingTags('e').length === 0
+ }
+ // Filter repost events if the option is set to hide reposts
+ return !(
+ n.kind === NDKKind.Repost &&
+ filterOptions.repost === RepostFilter.Hide_Repost
+ )
+ })
_notes = _notes.sort((a, b) => (b.created_at ?? 0) - (a.created_at ?? 0))
showing > 0 && _notes.splice(showing)
return _notes
- }, [filterOptions.nsfw, filterOptions.source, notes, showing])
+ }, [filterOptions.repost, notes, showing])
+
+ const newNotes = useMemo(
+ () => discoveredNotes.filter((d) => !notes.some((n) => n.id === d.id)),
+ [discoveredNotes, notes]
+ )
if (!userPubkey) return null
const handleLoadMore = () => {
const LOAD_MORE_STEP = SHOWING_STEP * 2
setShowing((prev) => prev + SHOWING_STEP)
- const lastNote = filteredNotes[filteredNotes.length - 1]
+ const lastNote = notes[notes.length - 1]
const filter: NDKFilter = {
authors: [...followList, userPubkey],
kinds: [NDKKind.Text, NDKKind.Repost],
- limit: LOAD_MORE_STEP
+ limit: LOAD_MORE_STEP,
+ until: lastNote.created_at
}
- filter.until = lastNote.created_at
-
setIsFetching(true)
ndk
.fetchEvents(filter, {
@@ -129,9 +175,42 @@ export const FeedTabPosts = () => {
})
}
+ const discoveredCount = newNotes.length
+ const handleDiscoveredClick = () => {
+ // Combine newly discovred with the notes
+ // Skip events already in notes
+ setNotes((prev) => {
+ return [...newNotes, ...prev]
+ })
+ // Increase showing by the discovered count
+ setShowing((prev) => prev + discoveredCount)
+ setDiscoveredNotes([])
+ }
+
return (
<>
@@ -870,3 +879,133 @@ const ProfileTabBlogs = () => {
)
}
+
+const ProfileTabPosts = () => {
+ const SHOWING_STEP = 20
+ const { profilePubkey } = useLoaderData() as ProfilePageLoaderResult
+ const { ndk } = useNDKContext()
+ const [notes, setNotes] = useState
-
-
*/}
+ {event.kind === NDKKind.Text && (
+ <>
+ {/* Quote Repost, Kind 1 */}
+ 0
-
-
-
- setShowQuoteRepostPopup(true)
+ }
+ >
+
+
+ {showQuoteRepostPopup && (
+
+ {isLoading ?
+
+
+ setShowRepostPopup(true)
+ }
+ >
+
+
+ {showRepostPopup && (
+
+ {isLoading ?
+
+
+
+
+
{isFetching &&
diff --git a/src/pages/feed/action.ts b/src/pages/feed/action.ts
index d87f6fb..7fc4fc9 100644
--- a/src/pages/feed/action.ts
+++ b/src/pages/feed/action.ts
@@ -1,11 +1,23 @@
-import { NDKEvent, NDKKind } from '@nostr-dev-kit/ndk'
+import NDK, { NDKEvent, NDKKind, NostrEvent } from '@nostr-dev-kit/ndk'
import { NDKContextType } from 'contexts/NDKContext'
import { ActionFunctionArgs, redirect } from 'react-router-dom'
import { toast } from 'react-toastify'
import { getFeedNotePageRoute } from 'routes'
import { store } from 'store'
-import { NoteSubmitForm, NoteSubmitFormErrors } from 'types'
-import { log, LogType, now } from 'utils'
+import {
+ NoteAction,
+ NoteSubmitForm,
+ NoteSubmitFormErrors,
+ TimeoutError
+} from 'types'
+import {
+ log,
+ LogType,
+ NOTE_DRAFT_CACHE_KEY,
+ now,
+ removeLocalStorageItem,
+ timeout
+} from 'utils'
export const feedPostRouteAction =
(ndkContext: NDKContextType) =>
@@ -32,39 +44,36 @@ export const feedPostRouteAction =
return null
}
- const formSubmit = (await request.json()) as NoteSubmitForm
- const formErrors = validateFormData(formSubmit)
-
- if (Object.keys(formErrors).length) return formErrors
-
- const content = decodeURIComponent(formSubmit.content!)
- const currentTimeStamp = now()
-
- const ndkEvent = new NDKEvent(ndkContext.ndk, {
- kind: NDKKind.Text,
- created_at: currentTimeStamp,
- content: content,
- tags: [
- ['L', 'source'],
- ['l', window.location.host, 'source']
- ],
- pubkey: hexPubkey
- })
-
+ let action: NoteAction | undefined
try {
- if (formSubmit.nsfw) ndkEvent.tags.push(['L', 'content-warning'])
+ action = (await request.json()) as NoteAction
+ switch (action.intent) {
+ case 'submit':
+ return await handleActionSubmit(
+ ndkContext.ndk,
+ action.data,
+ hexPubkey
+ )
- await ndkEvent.sign()
- const note1 = ndkEvent.encode()
- const publishedOnRelays = await ndkEvent.publish()
- if (publishedOnRelays.size === 0) {
- toast.error('Failed to publish note on any relay')
- return null
- } else {
- toast.success('Note published successfully')
- return redirect(getFeedNotePageRoute(note1))
+ case 'repost':
+ return await handleActionRepost(
+ ndkContext.ndk,
+ action.data,
+ action.note1
+ )
+
+ default:
+ throw new Error('Unsupported feed action. Intent missing.')
}
} catch (error) {
+ if (action && error instanceof TimeoutError) {
+ log(true, LogType.Error, 'Failed to publish note. Try again initiated')
+ const result = {
+ type: 'timeout',
+ action
+ }
+ return result
+ }
log(true, LogType.Error, 'Failed to publish note', error)
toast.error('Failed to publish note')
return null
@@ -80,3 +89,61 @@ const validateFormData = (formSubmit: NoteSubmitForm): NoteSubmitFormErrors => {
return errors
}
+
+async function handleActionSubmit(
+ ndk: NDK,
+ data: NoteSubmitForm,
+ pubkey: string
+) {
+ const formErrors = validateFormData(data)
+
+ if (Object.keys(formErrors).length)
+ return {
+ type: 'validation',
+ formErrors
+ }
+
+ const content = decodeURIComponent(data.content!)
+ const currentTimeStamp = now()
+
+ const ndkEvent = new NDKEvent(ndk, {
+ kind: NDKKind.Text,
+ created_at: currentTimeStamp,
+ content: content,
+ tags: [
+ ['L', 'source'],
+ ['l', window.location.host, 'source']
+ ],
+ pubkey
+ })
+
+ if (data.nsfw) ndkEvent.tags.push(['L', 'content-warning'])
+
+ await ndkEvent.sign()
+ const note1 = ndkEvent.encode()
+ const publishedOnRelays = await Promise.race([
+ ndkEvent.publish(),
+ timeout(30000)
+ ])
+ if (publishedOnRelays.size === 0) {
+ toast.error('Failed to publish note on any relay')
+ return null
+ } else {
+ toast.success('Note published successfully')
+ removeLocalStorageItem(NOTE_DRAFT_CACHE_KEY)
+ return redirect(getFeedNotePageRoute(note1))
+ }
+}
+async function handleActionRepost(ndk: NDK, data: NostrEvent, note1: string) {
+ const ndkEvent = new NDKEvent(ndk, data)
+ await ndkEvent.sign()
+
+ const publishedOnRelays = await ndkEvent.publish()
+ if (publishedOnRelays.size === 0) {
+ toast.error('Failed to publish note on any relay')
+ return null
+ } else {
+ toast.success('Note published successfully')
+ return redirect(getFeedNotePageRoute(note1))
+ }
+}
diff --git a/src/pages/profile/index.tsx b/src/pages/profile/index.tsx
index 478257c..b1ff7e7 100644
--- a/src/pages/profile/index.tsx
+++ b/src/pages/profile/index.tsx
@@ -1,4 +1,9 @@
-import { NDKFilter, NDKKind } from '@nostr-dev-kit/ndk'
+import {
+ NDKEvent,
+ NDKFilter,
+ NDKKind,
+ NDKSubscriptionCacheUsage
+} from '@nostr-dev-kit/ndk'
import { LoadingSpinner } from 'components/LoadingSpinner'
import { ModCard } from 'components/ModCard'
import { ModFilter } from 'components/Filters/ModsFilter'
@@ -19,10 +24,12 @@ import { toast } from 'react-toastify'
import { appRoutes } from 'routes'
import {
BlogCardDetails,
+ FeedPostsFilter,
FilterOptions,
ModDetails,
ModeratedFilter,
NSFWFilter,
+ RepostFilter,
SortBy,
UserRelaysType
} from 'types'
@@ -42,6 +49,8 @@ import { CheckboxField } from 'components/Inputs'
import { ProfilePageLoaderResult } from './loader'
import { BlogCard } from 'components/BlogCard'
import { BlogsFilter } from 'components/Filters/BlogsFilter'
+import { FeedFilter } from 'components/Filters/FeedFilter'
+import { Note } from 'components/Notes/Note'
export const ProfilePage = () => {
const {
@@ -451,7 +460,7 @@ export const ProfilePage = () => {
)}
{tab === 1 &&
+
+ )}
+ There are no posts to show
+
+
+ {!isFetching && isLoadMoreVisible && filteredNotes.length > 0 && (
+
+ {filteredNotes.map((note) => (
+
+
+
+
+ )}
+
+ )
+}
diff --git a/src/routes/index.tsx b/src/routes/index.tsx
index bd90666..a5ed0a4 100644
--- a/src/routes/index.tsx
+++ b/src/routes/index.tsx
@@ -109,7 +109,7 @@ export const routerWithNdkContext = (context: NDKContextType) =>
children: [
{
path: ':nevent',
- element: