From 42d46ac0e2d28c46dc01d7a78ea36dfa082420e9 Mon Sep 17 00:00:00 2001
From: michaelschal <35957947-michaelschal@users.noreply.replit.com>
Date: Tue, 12 Aug 2025 09:43:07 +0000
Subject: [PATCH] Improve reconciliation page with default 20 lines and dual
 pagination controls

Modify the reconciliation page to display 20 items by default and add pagination controls both above and below the table for enhanced usability.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: b163d4c0-de5e-4f4e-a9c0-aed4c7049718
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/1957c339-2757-4d1f-8e92-e9f71a1ce58e/b163d4c0-de5e-4f4e-a9c0-aed4c7049718/jsJ1WWO
---
 client/src/pages/BLReconciliation.tsx | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/BLReconciliation.tsx b/client/src/pages/BLReconciliation.tsx
index fa0daa1..4869cbd 100644
--- a/client/src/pages/BLReconciliation.tsx
+++ b/client/src/pages/BLReconciliation.tsx
@@ -543,7 +543,7 @@ export default function BLReconciliation() {
     totalPages,
     paginatedData: paginatedDeliveries,
     totalItems
-  } = usePagination(filteredDeliveries, 10);
+  } = usePagination(filteredDeliveries, 20);
 
   if (isLoading) {
     return (
@@ -657,6 +657,18 @@ export default function BLReconciliation() {
           </div>
         ) : (
           <div className="bg-white border border-gray-200 shadow-lg overflow-hidden">
+            {/* Pagination en haut */}
+            {totalItems > 0 && (
+              <Pagination
+                currentPage={currentPage}
+                totalPages={totalPages}
+                totalItems={totalItems}
+                itemsPerPage={itemsPerPage}
+                onPageChange={setCurrentPage}
+                onItemsPerPageChange={setItemsPerPage}
+                className="px-4 py-3 border-b border-gray-200"
+              />
+            )}
             <div className="overflow-x-auto">
               <table className="min-w-full divide-y divide-gray-200">
                 <thead className="bg-gray-50 border-b border-gray-200">
@@ -868,7 +880,7 @@ export default function BLReconciliation() {
             </table>
           </div>
           
-          {/* Pagination */}
+          {/* Pagination en bas */}
           {totalItems > 0 && (
             <Pagination
               currentPage={currentPage}
@@ -877,7 +889,7 @@ export default function BLReconciliation() {
               itemsPerPage={itemsPerPage}
               onPageChange={setCurrentPage}
               onItemsPerPageChange={setItemsPerPage}
-              className="mt-4 border-t border-gray-200 pt-4"
+              className="px-4 py-3 border-t border-gray-200 bg-gray-50"
             />
           )}
         </div>