feat(tasks): dictate into a task's detail notes

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

frontend/src/features/triage/TaskDetailModal.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useCallback } from 'react';
+import React, { useState, useEffect, useCallback, useRef } from 'react';
 import {
   X,
   Check,
@@ -24,6 +24,7 @@ import { columnDotClass } from './ManageColumnsModal';
 import { UserAutocomplete } from '../UserAutocomplete';
 import { api, triggerHaptic } from '../../lib/api';
 import { MarkdownViewer } from '../../lib/markdown';
+import { VoiceInputButton } from '../../components/VoiceInputButton';
 import { addDays, joinDue, splitDue } from '../../lib/due';
 
 interface TaskDetailModalProps {
@@ -90,6 +91,11 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
     el.style.height = 'auto';
     el.style.height = `${el.scrollHeight + 2}px`;
   }, []);
+  // Dictated text changes the draft without an input event, so the field grows here as well
+  const notesRef = useRef<HTMLTextAreaElement | null>(null);
+  useEffect(() => {
+    if (isEditingNotes) growNotes(notesRef.current);
+  }, [notesDraft, isEditingNotes, growNotes]);
 
   const [newSubtaskTitle, setNewSubtaskTitle] = useState('');
   const [newTagDraft, setNewTagDraft] = useState('');
@@ -814,18 +820,31 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
                 <FileText className="w-3.5 h-3.5 text-accent" />
                 <span>Detailnotizen:</span>
               </label>
-              {!readOnly && !isEditingNotes && task.notes && (
-                <button
-                  type="button"
-                  onClick={() => {
-                    setNotesDraft(task.notes || '');
-                    setIsEditingNotes(true);
-                  }}
-                  className="text-[11px] text-accent hover:underline"
-                >
-                  Bearbeiten
-                </button>
-              )}
+              <div className="flex items-center gap-2">
+                {!readOnly && !isEditingNotes && task.notes && (
+                  <button
+                    type="button"
+                    onClick={() => {
+                      setNotesDraft(task.notes || '');
+                      setIsEditingNotes(true);
+                    }}
+                    className="text-[11px] text-accent hover:underline"
+                  >
+                    Bearbeiten
+                  </button>
+                )}
+                {/* Dictate into the notes: opens the field and appends; saved with "Notiz speichern" */}
+                {!readOnly && (
+                  <VoiceInputButton
+                    value={isEditingNotes ? notesDraft : task.notes || ''}
+                    onChange={(text) => {
+                      setNotesDraft(text);
+                      setIsEditingNotes(true);
+                    }}
+                    focusRef={notesRef}
+                  />
+                )}
+              </div>
             </div>
 
             {isEditingNotes ? (
@@ -836,7 +855,10 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
                   placeholder="Detailnotizen eingeben… (Markdown unterstützt)"
                   rows={6}
                   autoFocus
-                  ref={growNotes}
+                  ref={(el) => {
+                    notesRef.current = el;
+                    growNotes(el);
+                  }}
                   onInput={(e) => growNotes(e.currentTarget)}
                   className="w-full input-field p-2.5 text-xs font-mono leading-relaxed resize-none min-h-[100px] lg:min-h-[260px] overflow-hidden"
                 />