feat: translation (#389)

This commit is contained in:
Cody Tseng 2025-06-23 23:52:21 +08:00 committed by GitHub
parent e2e115ebeb
commit df9066eae0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
43 changed files with 1466 additions and 47 deletions

View file

@ -1,4 +1,4 @@
import { useFetchEvent } from '@/hooks'
import { useFetchEvent, useTranslatedEvent } from '@/hooks'
import { createFakeEvent, isSupportedKind } from '@/lib/event'
import { toNjump, toNote } from '@/lib/link'
import { isValidPubkey } from '@/lib/pubkey'
@ -13,14 +13,20 @@ import ContentPreview from '../ContentPreview'
import UserAvatar from '../UserAvatar'
export default function Highlight({ event, className }: { event: Event; className?: string }) {
const comment = useMemo(() => event.tags.find((tag) => tag[0] === 'comment')?.[1], [event])
const translatedEvent = useTranslatedEvent(event.id)
const comment = useMemo(
() => (translatedEvent?.tags ?? event.tags).find((tag) => tag[0] === 'comment')?.[1],
[event, translatedEvent]
)
return (
<div className={cn('text-wrap break-words whitespace-pre-wrap space-y-4', className)}>
{comment && <Content event={createFakeEvent({ content: comment })} />}
<div className="flex gap-4">
<div className="w-1 flex-shrink-0 my-1 bg-primary/60 rounded-md" />
<div className="italic whitespace-pre-line">{event.content}</div>
<div className="italic whitespace-pre-line">
{translatedEvent?.content ?? event.content}
</div>
</div>
<HighlightSource event={event} />
</div>

View file

@ -14,6 +14,7 @@ import { FormattedTimestamp } from '../FormattedTimestamp'
import ImageGallery from '../ImageGallery'
import NoteOptions from '../NoteOptions'
import ParentNotePreview from '../ParentNotePreview'
import TranslateButton from '../TranslateButton'
import UserAvatar from '../UserAvatar'
import Username from '../Username'
import Highlight from './Highlight'
@ -65,7 +66,10 @@ export default function Note({
</div>
</div>
</div>
{size === 'normal' && <NoteOptions event={event} className="shrink-0 [&_svg]:size-5" />}
<div className="flex items-center">
<TranslateButton event={event} className={size === 'normal' ? '' : 'pr-0'} />
{size === 'normal' && <NoteOptions event={event} className="shrink-0 [&_svg]:size-5" />}
</div>
</div>
{parentEventId && (
<ParentNotePreview