1-// CommentView.tsx — new component
1+import { useEffect, useState } from 'react'
6+ body: string // user input from API
13+function renderMarkdown(md: string): string {
15+ .replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
16+ .replace(/@(\w+)/g, '<a href="/u/$1">@$1</a>')
17+ .replace(/\n/g, '<br/>')
20+export function CommentView({ commentId }: Props) {
21+ const [comment, setComment] = useState<Comment | null>(null)
24+ fetch(`/api/comments/${commentId}`)
25+ .then((r) => r.json())
29+ if (!comment) return null
32+ <div className="comment">
33+ <strong>{comment.author}</strong>
36+ dangerouslySetInnerHTML={{ __html: renderMarkdown(comment.body) }}
38+ <small>#{commentId}</small>
