From 71ea609175bb4cb31a1702f2591ed59213ccc789 Mon Sep 17 00:00:00 2001
From: akhisud3195 <akhileshs.s4@gmail.com>
Date: Fri, 4 Apr 2025 11:47:56 +0530
Subject: [PATCH] Add spacing after copilot cards

---
 .../copilot/components/messages.tsx           | 26 ++++++++++---------
 1 file changed, 14 insertions(+), 12 deletions(-)

diff --git a/apps/rowboat/app/projects/[projectId]/copilot/components/messages.tsx b/apps/rowboat/app/projects/[projectId]/copilot/components/messages.tsx
index bb061e23..da3b897c 100644
--- a/apps/rowboat/app/projects/[projectId]/copilot/components/messages.tsx
+++ b/apps/rowboat/app/projects/[projectId]/copilot/components/messages.tsx
@@ -71,8 +71,8 @@ function AssistantMessage({
     return (
         <div className="w-full">
             <div className="px-4 py-2.5 text-sm leading-relaxed text-gray-700 dark:text-gray-200">
-                <div className="flex flex-col gap-2">
-                    <div className="text-left">
+                <div className="flex flex-col gap-4">
+                    <div className="text-left flex flex-col gap-4">
                         {content.response.map((part, actionIndex) => {
                             if (part.type === "text") {
                                 return <MarkdownContent key={actionIndex} content={part.content} />;
@@ -152,17 +152,19 @@ export function Messages({
 
     return (
         <div className="h-full">
-            <div className="flex flex-col space-y-4 px-4 pt-4">
-                <div className="flex flex-col space-y-4">
-                    {messages.map((message, index) => (
-                        <div key={index}>
-                            {renderMessage(message, index)}
-                        </div>
-                    ))}
-                    {loadingResponse && <AssistantMessageLoading />}
-                </div>
-                <div ref={messagesEndRef} />
+            <div className="flex flex-col [&>*]:mb-4">
+                {messages.map((message, index) => (
+                    <div key={index} className="mb-4">
+                        {renderMessage(message, index)}
+                    </div>
+                ))}
+                {loadingResponse && (
+                    <div className="animate-pulse">
+                        <AssistantMessageLoading />
+                    </div>
+                )}
             </div>
+            <div ref={messagesEndRef} />
         </div>
     );
 }
\ No newline at end of file