Change chat container height to be relative to the parent's height

Author: ravikiranvm

packages/ui-components/src/components/assistant-ui/assistant-top-bar.tsx

@@ -59,7 +59,7 @@ const AssistantTopBar = ({
   return (
     <div
       className={cn(
-        'flex flex-col px-4 py-2 gap-[7px] flex-shrink-0 text-md dark:text-primary font-bold border-b border-gray-200',
+        'flex flex-col px-4 py-2 gap-1 flex-shrink-0 text-md dark:text-primary font-bold border-b border-gray-200',
       )}
     >
       <div className="flex justify-between items-center gap-2">

packages/ui-components/src/components/assistant-ui/assistant-ui-chat-container.tsx

@@ -18,7 +18,6 @@ type AssistantUiChatContainerProps = {
 } & ConnectionStatusProps &
   AssistantTopBarProps &
   ThreadProps & {
-    // Step settings specific props
     stepLogoUrl?: string;
     stepDisplayName?: string;
     stepIndex?: number;

packages/ui-components/src/components/assistant-ui/step-settings-assistant-ui-chat-container.tsx

@@ -15,8 +15,8 @@ import { AssistantUiChatContainer } from './assistant-ui-chat-container';
 import { ConnectionStatusProps } from './types';
 
 const COLLAPSED_HEIGHT = 57;
-const DOCKED_HEIGHT = 700;
 const EXPANDED_HEIGHT_OFFSET = 122;
+const DOCKED_HEIGHT_OFFSET = 40;
 const FULL_WIDTH_HEIGHT = 100;
 const EXPANDED_WIDTH_OFFSET = 40;
 const REGULAR_WIDTH = 450;
@@ -74,7 +74,7 @@ const StepSettingsAssistantUiChatContainer = ({
   if (containerSize === AI_CHAT_CONTAINER_SIZES.COLLAPSED) {
     height = COLLAPSED_HEIGHT;
   } else if (containerSize === AI_CHAT_CONTAINER_SIZES.DOCKED) {
-    height = DOCKED_HEIGHT;
+    height = parentHeight - DOCKED_HEIGHT_OFFSET;
   } else if (containerSize === AI_CHAT_CONTAINER_SIZES.EXPANDED) {
     height = parentHeight - EXPANDED_HEIGHT_OFFSET;
   } else {