From b097a29a61a13de6ff57247782b1c85bdb53460c Mon Sep 17 00:00:00 2001
From: viettranx <viettranx@gmail.com>
Date: Thu, 16 Apr 2026 10:37:31 +0700
Subject: [PATCH] fix(ui): heartbeat delivery Select full-width + popper
 positioning

Ensure Select triggers in heartbeat section use full available width
and render dropdown with popper positioning for consistent alignment.
---
 .../agents/agent-detail/heartbeat-delivery-section.tsx    | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/ui/web/src/pages/agents/agent-detail/heartbeat-delivery-section.tsx b/ui/web/src/pages/agents/agent-detail/heartbeat-delivery-section.tsx
index 48646002..2de5225d 100644
--- a/ui/web/src/pages/agents/agent-detail/heartbeat-delivery-section.tsx
+++ b/ui/web/src/pages/agents/agent-detail/heartbeat-delivery-section.tsx
@@ -41,10 +41,10 @@ export function HeartbeatDeliverySection({
               value={channel || "__none__"}
               onValueChange={(v) => { setChannel(v === "__none__" ? "" : v); setChatId(""); }}
             >
-              <SelectTrigger className="text-base md:text-sm">
+              <SelectTrigger className="w-full text-base md:text-sm">
                 <SelectValue placeholder={t("heartbeat.channelPlaceholder")} />
               </SelectTrigger>
-              <SelectContent>
+              <SelectContent position="popper">
                 <SelectItem value="__none__">{t("heartbeat.channelNone")}</SelectItem>
                 {channelNames.map((ch) => (
                   <SelectItem key={ch} value={ch}>{ch}</SelectItem>
@@ -70,10 +70,10 @@ export function HeartbeatDeliverySection({
             if (filtered.length > 0) {
               return (
                 <Select value={chatId || "__none__"} onValueChange={(v) => setChatId(v === "__none__" ? "" : v)}>
-                  <SelectTrigger className="text-base md:text-sm">
+                  <SelectTrigger className="w-full text-base md:text-sm">
                     <SelectValue placeholder={t("heartbeat.chatIdPlaceholder")} />
                   </SelectTrigger>
-                  <SelectContent>
+                  <SelectContent position="popper">
                     <SelectItem value="__none__">{t("heartbeat.channelNone")}</SelectItem>
                     {filtered.map((tgt) => (
                       <SelectItem key={tgt.chatId} value={tgt.chatId}>