From ba986021cdf52ceb50bcc27b9fa4287ab9c2a738 Mon Sep 17 00:00:00 2001
From: SaelixCode <dev@saelix.com>
Date: Thu, 26 Feb 2026 10:50:13 -0500
Subject: [PATCH] feat: enhance container status display with tooltip for
 detailed information

---
 frontend/src/components/EditorLayout.tsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/EditorLayout.tsx b/frontend/src/components/EditorLayout.tsx
index debef327..044bad8b 100644
--- a/frontend/src/components/EditorLayout.tsx
+++ b/frontend/src/components/EditorLayout.tsx
@@ -710,9 +710,18 @@ export default function EditorLayout() {
                                 <div key={container?.Id || Math.random()} className="flex items-center justify-between p-3 rounded-lg bg-muted/50">
                                   <div className="flex flex-col gap-1">
                                     <div className="flex items-center gap-2">
-                                      <Badge variant={getContainerBadge(container).variant} className="text-xs">
-                                        {getContainerBadge(container).text || 'unknown'}
-                                      </Badge>
+                                      <TooltipProvider>
+                                        <Tooltip>
+                                          <TooltipTrigger asChild>
+                                            <Badge variant={getContainerBadge(container).variant} className="text-xs cursor-help">
+                                              {getContainerBadge(container).text || 'unknown'}
+                                            </Badge>
+                                          </TooltipTrigger>
+                                          <TooltipContent>
+                                            <p>{container?.Status || 'No status details available'}</p>
+                                          </TooltipContent>
+                                        </Tooltip>
+                                      </TooltipProvider>
                                       <span className="text-xs text-muted-foreground">
                                         CPU: {containerStats[container?.Id]?.cpu || 'N/A'} | RAM: {containerStats[container?.Id]?.ram || 'N/A'}
                                       </span>