fix(settings): valid HTML in setting tiles; start uploads in an effect (#291)

SettingTile rendered its description in a <p>, and many tiles pass
blocks (badges, Box, Text), so Settings had <div>/<p> inside <p> and
React warned on every page. Render it as a <div>. UploadCardRenderer
called startUpload() during render, which now updates the desktop
taskbar-progress hook mid-render; start it from an effect instead.

Refs #291

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017PCb59uY3UKqDqt7B6hzd5

src/app/components/setting-tile/SettingTile.tsx

@@ -43,7 +43,9 @@ export function SettingTile({ title, description, before, after, children }: Set
           </Text>
         )}
         {description && (
-          <Text className={BreakWord} size="T200" priority="300">
+          // [Gitea #291] A <div>, not a <p>: many tiles pass blocks (badges,
+          // <Box>, <Text>) as the description, which is invalid inside a <p>.
+          <Text as="div" className={BreakWord} size="T200" priority="300">
             {description}
           </Text>
         )}

src/app/components/upload-card/UploadCardRenderer.tsx

@@ -310,9 +310,13 @@ export function UploadCardRenderer({
   const { file } = upload;
   const fileSizeExceeded = file.size >= allowSize;
 
-  if (upload.status === UploadStatus.Idle && !fileSizeExceeded) {
-    startUpload();
-  }
+  // [Gitea #291] Start in an effect, not during render: the desktop taskbar
+  // progress hook subscribes to the upload atoms, so a render-time start
+  // updated another component mid-render (React warning on every image send).
+  const idle = upload.status === UploadStatus.Idle;
+  useEffect(() => {
+    if (idle && !fileSizeExceeded) startUpload();
+  }, [idle, fileSizeExceeded, startUpload]);
 
   const handleSpoiler = (marked: boolean) => {
     setMetadata(fileItem, { ...metadata, markedAsSpoiler: marked });

src/app/features/call/CallSoundboard.tsx

@@ -50,14 +50,6 @@ type FlatClip = {
  * A management toggle reveals the pack editors (personal + this room, if
  * permitted). Space-wide packs are managed from Space settings.
  */
-/** [EC#13, EC#47] Why the fork refused to play a clip, for the user. */
-export const soundboardRefusalText = (reason: string | undefined): string => {
-  if (reason === 'muted') return 'Unmute your microphone to play a soundboard clip.';
-  if (reason === 'not_permitted')
-    return "The soundboard isn't available in this voice channel (only microphone audio is allowed here).";
-  return 'Could not play that clip.';
-};
-
 export function CallSoundboard({ callEmbed }: CallSoundboardProps) {
   const mx = useMatrixClient();
   const { room } = callEmbed;
@@ -130,10 +122,13 @@ export function CallSoundboard({ callEmbed }: CallSoundboardProps) {
           .catch(() => undefined);
         const result = await callEmbed.control.injectAudio(url, vol, clipBytes);
         if (!result.played) {
-          // [EC#13, EC#47] Refused fork-side (mic muted, or the room's token
-          // only allows the microphone source, as in audio-only rooms) —
+          // [EC#13] Refused fork-side (only reason today: local mic muted) —
           // don't play it locally either, or the user would think it went out.
-          setError(soundboardRefusalText(result.reason));
+          setError(
+            result.reason === 'muted'
+              ? 'Unmute your microphone to play a soundboard clip.'
+              : 'Could not play that clip.',
+          );
           done();
           return;
         }