()
+ const reviews: NostrEvent[] = []
+ let myReview: NostrEvent | null = null
+
+ events.sort((a, b) => compareEvents(b, a))
+ for (const evt of events) {
+ if (
+ mutePubkeySet.has(evt.pubkey) ||
+ pubkeySet.has(evt.pubkey) ||
+ (hideUntrustedNotes && !isUserTrusted(evt.pubkey))
+ ) {
+ continue
+ }
+ const stars = getStarsFromRelayReviewEvent(evt)
+ if (!stars) {
+ continue
+ }
+
+ pubkeySet.add(evt.pubkey)
+ if (evt.pubkey === pubkey) {
+ myReview = evt
+ } else {
+ reviews.push(evt)
+ }
+ }
+
+ setMyReview(myReview)
+ setReviews(reviews)
+ setInitialized(true)
+ }
+ init()
+ }, [relayUrl, pubkey, mutePubkeySet, hideUntrustedNotes, isUserTrusted])
+
+ const handleReviewed = (evt: NostrEvent) => {
+ setMyReview(evt)
+ setShowEditor(false)
+ }
+
+ return (
+
+
+
+
+
0 && 'underline cursor-pointer hover:text-foreground'
+ )}
+ onClick={() => {
+ if (count > 0) {
+ push(toRelayReviews(relayUrl))
+ }
+ }}
+ >
+ {t('{{count}} reviews', { count })}
+
+
+ {!showEditor && !myReview && (
+
+ )}
+
+
+ {showEditor &&
}
+
+ {myReview || reviews.length > 0 ? (
+
+ ) : !showEditor ? (
+
+ {initialized ? t('No reviews yet. Be the first to write one!') : t('Loading...')}
+
+ ) : null}
+
-
+
+
+ )}
+ {reviews.slice(0, 10).map((evt) => (
+ -
+
+
+ ))}
+ {reviews.length > 10 && (
+ -
+
push(toRelayReviews(relayUrl))}
+ >
+
{t('View more reviews')}
+
+ )}
+
+ {showPreviousAndNext && }
+ {showPreviousAndNext && }
+
+ )
+}
+
+function Item({ children }: { children: React.ReactNode }) {
+ return (
+
+ {children}
+
+ )
+}
diff --git a/src/components/RelayInfo/ReviewEditor.tsx b/src/components/RelayInfo/ReviewEditor.tsx
new file mode 100644
index 00000000..caa2b88d
--- /dev/null
+++ b/src/components/RelayInfo/ReviewEditor.tsx
@@ -0,0 +1,90 @@
+import { Button } from '@/components/ui/button'
+import { Textarea } from '@/components/ui/textarea'
+import { BIG_RELAY_URLS } from '@/constants'
+import { createRelayReviewDraftEvent } from '@/lib/draft-event'
+import { useNostr } from '@/providers/NostrProvider'
+import { Loader2, Star } from 'lucide-react'
+import { NostrEvent } from 'nostr-tools'
+import { useMemo, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { toast } from 'sonner'
+
+export default function ReviewEditor({
+ relayUrl,
+ onReviewed
+}: {
+ relayUrl: string
+ onReviewed: (evt: NostrEvent) => void
+}) {
+ const { t } = useTranslation()
+ const { publish } = useNostr()
+ const [stars, setStars] = useState(0)
+ const [hoverStars, setHoverStars] = useState(0)
+ const [review, setReview] = useState('')
+ const [submitting, setSubmitting] = useState(false)
+ const canSubmit = useMemo(() => stars > 0 && !!review.trim(), [stars, review])
+
+ const submit = async () => {
+ if (!canSubmit) return
+
+ setSubmitting(true)
+ try {
+ const draftEvent = createRelayReviewDraftEvent(relayUrl, review, stars)
+ const evt = await publish(draftEvent, { specifiedRelayUrls: [relayUrl, ...BIG_RELAY_URLS] })
+ onReviewed(evt)
+ } catch (error) {
+ if (error instanceof AggregateError) {
+ error.errors.forEach((e) => toast.error(`${t('Failed to review')}: ${e.message}`))
+ } else if (error instanceof Error) {
+ toast.error(`${t('Failed to review')}: ${error.message}`)
+ }
+ console.error(error)
+ return
+ } finally {
+ setSubmitting(false)
+ }
+ }
+
+ return (
+
+