From 0557bd738534ff3e07154356eb30fc13913433ee Mon Sep 17 00:00:00 2001
From: Bhavik Patel <bhavikpatel13792@gmail.com>
Date: Thu, 5 Mar 2026 07:58:47 +0400
Subject: [PATCH] fix: restore @mention autocomplete visibility in task modal

- Increase MentionTextarea dropdown z-index to z-[60] so it renders
  above z-50 modals (was z-20, clipped by overflow-y-auto on modal)
- Replace plain textarea in broadcast section with MentionTextarea
  for consistent @mention support across all text inputs
- Add hint text to broadcast placeholder about @mention usage

Fixes #172
---
 src/components/panels/task-board-panel.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/panels/task-board-panel.tsx b/src/components/panels/task-board-panel.tsx
index e7dc395..74a6810 100644
--- a/src/components/panels/task-board-panel.tsx
+++ b/src/components/panels/task-board-panel.tsx
@@ -217,7 +217,7 @@ function MentionTextarea({
         className={className}
       />
       {open && filtered.length > 0 && (
-        <div className="absolute z-20 mt-1 w-full bg-surface-1 border border-border rounded-md shadow-xl max-h-56 overflow-y-auto">
+        <div className="absolute z-[60] mt-1 w-full bg-surface-1 border border-border rounded-md shadow-xl max-h-56 overflow-y-auto">
           {filtered.map((option, index) => (
             <button
               key={`${option.type}-${option.handle}-${option.recipient}`}
@@ -1062,12 +1062,13 @@ function TaskDetailModal({
                 <div className="text-xs text-muted-foreground mb-2">{broadcastStatus}</div>
               )}
               <form onSubmit={handleBroadcast} className="space-y-2">
-                <textarea
+                <MentionTextarea
                   value={broadcastMessage}
-                  onChange={(e) => setBroadcastMessage(e.target.value)}
+                  onChange={setBroadcastMessage}
                   className="w-full bg-surface-1 text-foreground border border-border rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-1 focus:ring-primary/50"
                   rows={2}
-                  placeholder="Send a message to all task subscribers..."
+                  placeholder="Send a message to all task subscribers... (use @ to mention)"
+                  mentionTargets={mentionTargets}
                 />
                 <div className="flex justify-end">
                   <button