From c78b68ca4fdfa69a1ef7a3017488b6149d5a6f28 Mon Sep 17 00:00:00 2001
From: soufiane <soufiane.baali99@gmail.com>
Date: Mon, 1 Dec 2025 20:59:50 +0100
Subject: [PATCH] refactor: use shared Pagination component in admin pages
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Replace inline pagination in TicketManagement with Pagination component
- Replace inline pagination in UserManagement with Pagination component
- Reduces duplication from 2.8% to 2.49%

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 components/admin/TicketManagement.tsx | 27 +++++++--------------------
 components/admin/UserManagement.tsx   | 26 +++++++-------------------
 2 files changed, 14 insertions(+), 39 deletions(-)

diff --git a/components/admin/TicketManagement.tsx b/components/admin/TicketManagement.tsx
index 99a4c39..13b82f9 100644
--- a/components/admin/TicketManagement.tsx
+++ b/components/admin/TicketManagement.tsx
@@ -3,7 +3,7 @@
 import { useState, useEffect, useCallback } from 'react';
 import { adminService } from '@/services/admin.service';
 import { Ticket } from '@/types';
-import { StatusBadge } from '@/components/ui';
+import { StatusBadge, Pagination } from '@/components/ui';
 
 export default function TicketManagement() {
   const [tickets, setTickets] = useState<Ticket[]>([]);
@@ -312,25 +312,12 @@ export default function TicketManagement() {
       </div>
 
       {/* Pagination */}
-      <div className="flex justify-center gap-2 mt-4">
-        <button
-          onClick={() => setPage((p) => Math.max(1, p - 1))}
-          disabled={page === 1}
-          className="px-4 py-2 border rounded disabled:opacity-50 disabled:cursor-not-allowed"
-        >
-          Précédent
-        </button>
-        <span className="px-4 py-2">
-          Page {page} sur {totalPages}
-        </span>
-        <button
-          onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
-          disabled={page === totalPages}
-          className="px-4 py-2 border rounded disabled:opacity-50 disabled:cursor-not-allowed"
-        >
-          Suivant
-        </button>
-      </div>
+      <Pagination
+        currentPage={page}
+        totalPages={totalPages}
+        onPageChange={setPage}
+        showPageNumbers={false}
+      />
 
 
       {/* Modal détails ticket */}
diff --git a/components/admin/UserManagement.tsx b/components/admin/UserManagement.tsx
index 6e41331..e8520f1 100644
--- a/components/admin/UserManagement.tsx
+++ b/components/admin/UserManagement.tsx
@@ -4,6 +4,7 @@ import { useState, useEffect, useCallback, useMemo } from 'react';
 import { useRouter } from 'next/navigation';
 import { adminService } from '@/services/admin.service';
 import { User, CreateEmployeeData, UpdateUserData, PaginatedResponse } from '@/types';
+import { Pagination } from '@/components/ui';
 
 export default function UserManagement() {
   const router = useRouter();
@@ -263,25 +264,12 @@ export default function UserManagement() {
       </div>
 
       {/* Pagination */}
-      <div className="flex justify-center gap-2 mt-4">
-        <button
-          onClick={() => setPage((p) => Math.max(1, p - 1))}
-          disabled={page === 1}
-          className="px-4 py-2 border rounded disabled:opacity-50 disabled:cursor-not-allowed"
-        >
-          Précédent
-        </button>
-        <span className="px-4 py-2">
-          Page {page} sur {totalPages}
-        </span>
-        <button
-          onClick={() => setPage((p) => Math.min(totalPages, p + 1))}
-          disabled={page === totalPages}
-          className="px-4 py-2 border rounded disabled:opacity-50 disabled:cursor-not-allowed"
-        >
-          Suivant
-        </button>
-      </div>
+      <Pagination
+        currentPage={page}
+        totalPages={totalPages}
+        onPageChange={setPage}
+        showPageNumbers={false}
+      />
 
       {/* Modal créer employé */}
       {isCreateEmployeeModalOpen && (