refactor(admin): simplify AdminHeader component by removing inline logic

src/features/admin/pages/RolesPage.client.js

@@ -5,6 +5,7 @@ import { useRouter } from 'next/navigation';
 import { Card, Table, Button, Badge } from '@zen/core/shared/components';
 import { PencilEdit01Icon, Cancel01Icon } from '@zen/core/shared/icons';
 import { useToast } from '@zen/core/toast';
+import AdminHeader from '../components/AdminHeader.js';
 
 const RolesPageClient = () => {
   const router = useRouter();
@@ -146,21 +147,15 @@ const RolesPage = () => {
 
   return (
     <div className="flex flex-col gap-4 sm:gap-6 lg:gap-8">
-      <div className="flex items-center justify-between">
-        <div>
-          <h1 className="text-lg sm:text-xl font-semibold text-neutral-900 dark:text-white">Rôles</h1>
-          <p className="mt-1 text-[13px] text-neutral-500 dark:text-neutral-400">
-            Gérez les rôles et leurs permissions
-          </p>
-        </div>
-        <Button
-          variant="primary"
-          size="sm"
-          onClick={() => router.push('/admin/roles/new')}
-        >
-          Nouveau rôle
-        </Button>
-      </div>
+      <AdminHeader
+        title="Rôles"
+        description="Gérez les rôles et leurs permissions"
+        action={
+          <Button variant="primary" size="sm" onClick={() => router.push('/admin/roles/new')}>
+            Nouveau rôle
+          </Button>
+        }
+      />
       <RolesPageClient />
     </div>
   );