From f91d49940f532e646ed479bc04c133f9fd705ed6 Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Tue, 12 Aug 2025 20:14:24 +0000
Subject: [PATCH] Improve scrolling behavior on pages with large data tables

Adjusted container elements to enable vertical scrolling specifically within data tables, fixing an issue where overall page scrolling was obstructed.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: cc8ba926-557c-4bf1-a2ea-ceabbcf38824
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/cc8ba926-557c-4bf1-a2ea-ceabbcf38824/qCIP3bO
---
 client/src/pages/CustomerOrders.tsx | 6 ++++--
 client/src/pages/Dashboard.tsx      | 2 +-
 client/src/pages/Deliveries.tsx     | 4 ++--
 client/src/pages/Orders.tsx         | 4 ++--
 4 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/client/src/pages/CustomerOrders.tsx b/client/src/pages/CustomerOrders.tsx
index 9381433..5c2210d 100644
--- a/client/src/pages/CustomerOrders.tsx
+++ b/client/src/pages/CustomerOrders.tsx
@@ -674,7 +674,7 @@ export default function CustomerOrders() {
   } = usePagination(sortedOrders, 10);
 
   return (
-    <div className="flex-1 overflow-y-auto">
+    <div className="flex-1">
       <div className="p-6 space-y-6">
       {/* Header */}
       <div className="bg-white border-b border-gray-200 p-6 shadow-sm -m-6 mb-6">
@@ -753,7 +753,8 @@ export default function CustomerOrders() {
           {isLoading ? (
             <div>Chargement...</div>
           ) : (
-            <Table>
+            <div className="max-h-96 overflow-y-auto">
+              <Table>
               <TableHeader>
                 <TableRow>
                   <TableHead>Client</TableHead>
@@ -867,6 +868,7 @@ export default function CustomerOrders() {
                 ))}
               </TableBody>
             </Table>
+            </div>
           )}
           
           {/* Pagination */}
diff --git a/client/src/pages/Dashboard.tsx b/client/src/pages/Dashboard.tsx
index 50dcea4..de2d83f 100644
--- a/client/src/pages/Dashboard.tsx
+++ b/client/src/pages/Dashboard.tsx
@@ -218,7 +218,7 @@ export default function Dashboard() {
   };
 
   return (
-    <div className="flex-1 overflow-y-auto">
+    <div className="flex-1">
       <div className="p-6 space-y-6">
       {/* Header */}
       <div className="flex items-center justify-between">
diff --git a/client/src/pages/Deliveries.tsx b/client/src/pages/Deliveries.tsx
index 8eb73df..8ec43ae 100644
--- a/client/src/pages/Deliveries.tsx
+++ b/client/src/pages/Deliveries.tsx
@@ -255,7 +255,7 @@ export default function Deliveries() {
   const canValidate = permissions.canValidate('deliveries');
 
   return (
-    <div className="flex-1 overflow-y-auto">
+    <div className="flex-1">
       <div className="p-6 space-y-6">
       {/* Header */}
       <div className="bg-white border-b border-gray-200 p-6 shadow-sm -m-6 mb-6">
@@ -340,7 +340,7 @@ export default function Deliveries() {
           </div>
         ) : (
           <div className="bg-white border border-gray-200 shadow-lg overflow-hidden rounded-xl">
-            <div className="overflow-x-auto">
+            <div className="overflow-x-auto max-h-96 overflow-y-auto">
               <table className="w-full">
                 <thead className="bg-gray-50 border-b border-gray-200">
                     <tr>
diff --git a/client/src/pages/Orders.tsx b/client/src/pages/Orders.tsx
index d336410..134c06b 100644
--- a/client/src/pages/Orders.tsx
+++ b/client/src/pages/Orders.tsx
@@ -226,7 +226,7 @@ export default function Orders() {
   const canDelete = permissions.canDelete('orders');
 
   return (
-    <div className="flex-1 overflow-y-auto">
+    <div className="flex-1">
       <div className="p-6 space-y-6">
       {/* Header */}
       <div className="bg-white border-b border-gray-200 p-6 shadow-sm -m-6 mb-6">
@@ -309,7 +309,7 @@ export default function Orders() {
           </div>
         ) : (
           <div className="bg-white border border-gray-200 shadow-lg overflow-hidden rounded-xl">
-            <div className="overflow-x-auto">
+            <div className="overflow-x-auto max-h-96 overflow-y-auto">
               <table className="w-full">
                 <thead className="bg-gray-50 border-b border-gray-200">
                     <tr>