feat: rtf

app/(dashboard)/reports/page.tsx

@@ -8,7 +8,8 @@ import { ListShell, EmptyRow } from "@/components/list-shell";
 import { Table, THead, TR, TH, TD } from "@/components/ui/table";
 import { Button } from "@/components/ui/button";
 import { Modal } from "@/components/ui/modal";
-import { Textarea } from "@/components/ui/input";
+import { RichTextarea } from "@/components/ui/rich-textarea";
+import { RichText } from "@/lib/rich-text";
 import { useConfirm } from "@/components/confirm";
 import { cn, fmtDate } from "@/lib/utils";
 
@@ -221,8 +222,8 @@ export default function ReportsPage() {
                           ✓ Resolved
                         </span>
                         {r.resolution_note ? (
-                          <p className="max-w-[220px] whitespace-pre-line text-right text-xs text-muted-foreground">
-                            {r.resolution_note}
+                          <p className="max-w-[220px] text-right text-xs text-muted-foreground">
+                            <RichText text={r.resolution_note} />
                           </p>
                         ) : null}
                         {r.target_removed ? undoButton(r) : null}
@@ -291,9 +292,9 @@ function ResolveModal({
       <div className="space-y-4">
         <label className="block space-y-1.5">
           <span className="text-sm font-medium">Resolution note</span>
-          <Textarea
+          <RichTextarea
             value={note}
-            onChange={(e) => setNote(e.target.value)}
+            onValueChange={setNote}
             rows={4}
             maxLength={2000}
             placeholder="What did you do / decide? (shown in the reports table)"