From 89dfd21adb8688e375131481dac4355adeae8fdf Mon Sep 17 00:00:00 2001
From: Khairul Hidayat <khai@rul.sh>
Date: Fri, 18 Sep 2026 07:16:53 +0800
Subject: [PATCH] fix: overflow container fix

---
 ui/src/app/messages.tsx | 2 +-
 ui/src/app/page.tsx     | 4 ++--
 ui/vite.config.ts       | 3 +++
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/ui/src/app/messages.tsx b/ui/src/app/messages.tsx
index 3833ae4..4c40590 100644
--- a/ui/src/app/messages.tsx
+++ b/ui/src/app/messages.tsx
@@ -124,7 +124,7 @@ export default function MessagesSection({ chatId, maxCount = 50 }: Props) {
 
   return (
     <section
-      className={`flex min-w-0 flex-1 flex-col bg-muted ${chatId ? "flex" : "hidden md:flex"}`}
+      className={`flex min-w-0 h-full flex-1 flex-col bg-muted ${chatId ? "flex" : "hidden md:flex"}`}
     >
       <header className="flex items-center justify-between border-b border-border bg-card px-4 py-3 sm:px-6">
         <div className="flex min-w-0 items-center gap-3">
diff --git a/ui/src/app/page.tsx b/ui/src/app/page.tsx
index 0011784..7133b30 100644
--- a/ui/src/app/page.tsx
+++ b/ui/src/app/page.tsx
@@ -10,10 +10,10 @@ export default function Page() {
   const chatId = router.query.get("chatId");
 
   return (
-    <main className="bg-background text-foreground flex overflow-hidden h-screen max-h-dvh">
+    <main className="bg-background text-foreground flex overflow-hidden h-screen max-h-dvh items-stretch">
       {/* <div className="mx-auto flex h-dvh max-w-360 overflow-hidden bg-card shadow-xl sm:h-[calc(100dvh-2rem)] sm:rounded-2xl lg:h-[calc(100dvh-3rem)]"> */}
       <aside
-        className={`flex w-full shrink-0 flex-col border-r border-border bg-card md:w-85 lg:w-1/3 max-w-md ${chatId ? "hidden md:flex" : "flex"}`}
+        className={`flex w-full h-full shrink-0 flex-col border-r border-border bg-card md:w-85 lg:w-1/3 max-w-md ${chatId ? "hidden md:flex" : "flex"}`}
       >
         {/* <header className="flex items-center justify-between border-b border-border px-5 py-5">
             <div className="flex items-center gap-3">
diff --git a/ui/vite.config.ts b/ui/vite.config.ts
index 84e7707..1056576 100644
--- a/ui/vite.config.ts
+++ b/ui/vite.config.ts
@@ -6,6 +6,9 @@ import tailwindcss from "@tailwindcss/vite";
 // https://vite.dev/config/
 export default defineConfig({
   plugins: [react(), tailwindcss()],
+  server: {
+    allowedHosts: true,
+  },
   resolve: {
     alias: {
       "@": path.resolve(import.meta.dirname, "./src"),