fix: prevent nesting of formatted text reactions

Usage of map was causing issues if the text reaction had special
characters.

Closes #205

js/desktop/src/features/particles/text-reaction-input.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useState } from "react";
 import { Send } from "lucide-react";
 import { useSuspendPlayback } from "@/hooks/use-suspend-playback";
+import { sanitizeReactionText } from "@/lib/firestore-particles";
 import { cn } from "@/lib/utils";
 
 const MAX_LENGTH = 40;
@@ -44,7 +45,9 @@ export function TextReactionInput({ open, onSubmit, onClose }: TextReactionInput
       <input
         ref={inputRef}
         value={value}
-        onChange={(e) => setValue(e.target.value.slice(0, MAX_LENGTH))}
+        onChange={(e) =>
+          setValue(sanitizeReactionText(e.target.value).slice(0, MAX_LENGTH))
+        }
         onBlur={onClose}
         onKeyDown={(e) => {
           if (e.key === "Enter") {