From 418c72991a7d47c6d6007dbacb8c40bf89db619f Mon Sep 17 00:00:00 2001
From: tranminhquang <tranminhquang4421@gmail.com>
Date: Wed, 4 Jun 2025 14:51:34 +0700
Subject: [PATCH] Refactor layout and scrolling for chat and welcome screens

---
 frontend/src/App.tsx                         | 8 +-------
 frontend/src/components/ChatMessagesView.tsx | 2 +-
 frontend/src/components/WelcomeScreen.tsx    | 2 +-
 3 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 6e68e50..52d3313 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -154,12 +154,7 @@ export default function App() {
 
   return (
     <div className="flex h-screen bg-neutral-800 text-neutral-100 font-sans antialiased">
-      <main className="flex-1 flex flex-col overflow-hidden max-w-4xl mx-auto w-full">
-        <div
-          className={`flex-1 overflow-y-auto ${
-            thread.messages.length === 0 ? "flex" : ""
-          }`}
-        >
+      <main className="h-full w-full max-w-4xl mx-auto">
           {thread.messages.length === 0 ? (
             <WelcomeScreen
               handleSubmit={handleSubmit}
@@ -177,7 +172,6 @@ export default function App() {
               historicalActivities={historicalActivities}
             />
           )}
-        </div>
       </main>
     </div>
   );
diff --git a/frontend/src/components/ChatMessagesView.tsx b/frontend/src/components/ChatMessagesView.tsx
index 1792e6f..8b90a90 100644
--- a/frontend/src/components/ChatMessagesView.tsx
+++ b/frontend/src/components/ChatMessagesView.tsx
@@ -253,7 +253,7 @@ export function ChatMessagesView({
 
   return (
     <div className="flex flex-col h-full">
-      <ScrollArea className="flex-grow" ref={scrollAreaRef}>
+      <ScrollArea className="flex-1 overflow-y-auto" ref={scrollAreaRef}>
         <div className="p-4 md:p-6 space-y-2 max-w-4xl mx-auto pt-16">
           {messages.map((message, index) => {
             const isLast = index === messages.length - 1;
diff --git a/frontend/src/components/WelcomeScreen.tsx b/frontend/src/components/WelcomeScreen.tsx
index 8c0a2fa..b1015aa 100644
--- a/frontend/src/components/WelcomeScreen.tsx
+++ b/frontend/src/components/WelcomeScreen.tsx
@@ -15,7 +15,7 @@ export const WelcomeScreen: React.FC<WelcomeScreenProps> = ({
   onCancel,
   isLoading,
 }) => (
-  <div className="flex flex-col items-center justify-center text-center px-4 flex-1 w-full max-w-3xl mx-auto gap-4">
+  <div className="h-full flex flex-col items-center justify-center text-center px-4 flex-1 w-full max-w-3xl mx-auto gap-4">
     <div>
       <h1 className="text-5xl md:text-6xl font-semibold text-neutral-100 mb-3">
         Welcome.