From cb23be8e16ae68b4ba53d925cb1f6318c195f014 Mon Sep 17 00:00:00 2001
From: akhisud3195 <akhileshs.s4@gmail.com>
Date: Mon, 21 Jul 2025 15:52:11 +0530
Subject: [PATCH] Fix padding below prompt config

---
 .../[projectId]/entities/agent_config.tsx      |  2 +-
 .../[projectId]/workflow/entity_list.tsx       | 18 ++++++++++++------
 .../rowboat/components/common/panel-common.tsx |  9 +++++++--
 3 files changed, 20 insertions(+), 9 deletions(-)

diff --git a/apps/rowboat/app/projects/[projectId]/entities/agent_config.tsx b/apps/rowboat/app/projects/[projectId]/entities/agent_config.tsx
index 50ecbfc5..e977fc67 100644
--- a/apps/rowboat/app/projects/[projectId]/entities/agent_config.tsx
+++ b/apps/rowboat/app/projects/[projectId]/entities/agent_config.tsx
@@ -313,7 +313,7 @@ export function AgentConfig({
                                         />
                                     </div>
                                     {/* Examples Section */}
-                                    <div className="space-y-2">
+                                    <div className="space-y-2 mb-6">
                                         <div className="flex items-center gap-2">
                                             <label className={sectionHeaderStyles}>Examples</label>
                                             <button
diff --git a/apps/rowboat/app/projects/[projectId]/workflow/entity_list.tsx b/apps/rowboat/app/projects/[projectId]/workflow/entity_list.tsx
index 5c010c91..03c256e1 100644
--- a/apps/rowboat/app/projects/[projectId]/workflow/entity_list.tsx
+++ b/apps/rowboat/app/projects/[projectId]/workflow/entity_list.tsx
@@ -60,7 +60,10 @@ interface EmptyStateProps {
 }
 
 const EmptyState: React.FC<EmptyStateProps> = ({ entity, hasFilteredItems }) => (
-    <div className="flex items-center justify-center h-24 text-sm text-zinc-400 dark:text-zinc-500">
+    <div className={clsx(
+        "flex items-center justify-center h-24 text-sm text-zinc-400 dark:text-zinc-500",
+        entity === "prompts" && "pb-6"
+    )}>
         {hasFilteredItems ? "No tools to show" : `No ${entity} created`}
     </div>
 );
@@ -359,10 +362,10 @@ export function EntityList({
     };
 
     return (
-        <div ref={containerRef} className="flex flex-col h-full">
+        <div ref={containerRef} className="flex flex-col h-full min-h-0">
             <ResizablePanelGroup 
                 direction="vertical" 
-                className="h-full"
+                className="flex-1 min-h-0 flex flex-col"
                 style={{ gap: `${GAP_SIZE}px` }}
             >
                 {/* Agents Panel */}
@@ -370,12 +373,13 @@ export function EntityList({
                     defaultSize={getPanelSize('agents')}
                     minSize={expandedPanels.agents ? 20 : 8}
                     maxSize={100}
+                    className="flex flex-col min-h-0 h-full"
                 >
                     <Panel 
                         variant="entity-list"
                         tourTarget="entity-agents"
                         className={clsx(
-                            "h-full overflow-hidden",
+                            "flex flex-col min-h-0 h-full overflow-hidden",
                             !expandedPanels.agents && "h-[53px]!"
                         )}
                         title={
@@ -470,12 +474,13 @@ export function EntityList({
                     defaultSize={getPanelSize('tools')}
                     minSize={expandedPanels.tools ? 20 : 8}
                     maxSize={100}
+                    className="flex flex-col min-h-0 h-full"
                 >
                     <Panel 
                         variant="entity-list"
                         tourTarget="entity-tools"
                         className={clsx(
-                            "h-full overflow-hidden",
+                            "flex flex-col min-h-0 h-full overflow-hidden",
                             !expandedPanels.tools && "h-[53px]!"
                         )}
                         title={
@@ -601,12 +606,13 @@ export function EntityList({
                     defaultSize={getPanelSize('prompts')}
                     minSize={expandedPanels.prompts ? 20 : 8}
                     maxSize={100}
+                    className="flex flex-col min-h-0 h-full"
                 >
                     <Panel 
                         variant="entity-list"
                         tourTarget="entity-prompts"
                         className={clsx(
-                            "h-full overflow-hidden",
+                            "h-full",
                             !expandedPanels.prompts && "h-[53px]!"
                         )}
                         title={
diff --git a/apps/rowboat/components/common/panel-common.tsx b/apps/rowboat/components/common/panel-common.tsx
index 040d523b..435bb5e3 100644
--- a/apps/rowboat/components/common/panel-common.tsx
+++ b/apps/rowboat/components/common/panel-common.tsx
@@ -42,6 +42,7 @@ interface PanelProps {
     className?: string;
     onClick?: () => void;
     tourTarget?: string;
+    overflow?: 'hidden' | 'visible' | 'auto' | 'scroll' | undefined;
 }
 
 export function Panel({
@@ -55,19 +56,23 @@ export function Panel({
     className,
     onClick,
     tourTarget,
+    overflow,
 }: PanelProps) {
     const isEntityList = variant === 'entity-list';
     
     return <div 
         className={clsx(
-            "flex flex-col overflow-hidden rounded-xl border relative w-full",
+            "flex flex-col rounded-xl border relative w-full",
+            // Only apply overflow-hidden if no custom overflow is set (for backward compatibility)
+            overflow ? undefined : "overflow-hidden",
             variant === 'copilot' ? "border-blue-200 dark:border-blue-800" : "border-zinc-200 dark:border-zinc-800",
             "bg-white dark:bg-zinc-900",
             maxHeight ? "max-h-(--panel-height)" : "h-full",
             className
         )}
         style={{ 
-            '--panel-height': maxHeight
+            '--panel-height': maxHeight,
+            ...(overflow ? { overflow } : {})
         } as React.CSSProperties}
         onClick={onClick}
         data-tour-target={tourTarget}