Move "history and notifications" pane to bottom

client/src/App.tsx

@@ -355,8 +355,7 @@ const App = () => {
         onConnect={connectMcpServer}
       />
       <div className="flex-1 flex flex-col overflow-hidden">
-        <div className="flex-1 overflow-auto flex">
-          <div className="flex-1">
+        <div className="flex-1 overflow-auto">
           {mcpClient ? (
             <Tabs defaultValue="resources" className="w-full p-4">
               <TabsList className="mb-4 p-0">
@@ -468,13 +467,14 @@ const App = () => {
             </div>
           )}
         </div>
-        </div>
-      </div>
+        <div className="h-1/3 min-h-[200px] border-t border-border">
           <HistoryAndNotifications
             requestHistory={requestHistory}
             serverNotifications={notifications}
           />
         </div>
+      </div>
+    </div>
   );
 };
 

client/src/components/History.tsx

@@ -29,8 +29,8 @@ const HistoryAndNotifications = ({
   };
 
   return (
-    <div className="w-64 bg-card shadow-md p-4 overflow-hidden flex flex-col h-full">
-      <div className="flex-1 overflow-y-auto mb-4 border-b pb-4">
+    <div className="bg-card p-4 overflow-hidden flex h-full">
+      <div className="flex-1 overflow-y-auto px-4 border-r">
         <h2 className="text-lg font-semibold mb-4">History</h2>
         {requestHistory.length === 0 ? (
           <p className="text-sm text-gray-500 italic">No history yet</p>
@@ -107,7 +107,7 @@ const HistoryAndNotifications = ({
           </ul>
         )}
       </div>
-      <div className="flex-1 overflow-y-auto">
+      <div className="flex-1 overflow-y-auto px-4">
         <h2 className="text-lg font-semibold mb-4">Server Notifications</h2>
         {serverNotifications.length === 0 ? (
           <p className="text-sm text-gray-500 italic">No notifications yet</p>