페이지 헤더 레이아웃 공통화

devfront/src/features/audit/AuditLogsPage.tsx

@@ -20,9 +20,6 @@ import { Button } from "../../components/ui/button";
 import {
   Card,
   CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
 } from "../../components/ui/card";
 import { Input } from "../../components/ui/input";
 import {
@@ -33,6 +30,7 @@ import {
   TableHeader,
   TableRow,
 } from "../../components/ui/table";
+import { PageHeader } from "../../../../common/core/components/page";
 import type { DevAuditLog } from "../../lib/devApi";
 import { fetchDevAuditLogs } from "../../lib/devApi";
 import { t } from "../../lib/i18n";
@@ -194,23 +192,15 @@ function AuditLogsPage() {
 
   return (
     <div className="space-y-6">
-      <Card className="glass-panel">
-        <CardHeader className="flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
-          <div>
-            <p className="text-xs uppercase tracking-[0.2em] text-muted-foreground">
-              {t("ui.dev.audit.registry.title", "Audit registry")}
-            </p>
-            <CardTitle className="text-3xl font-black tracking-tight">
-              {t("ui.dev.audit.title", "Audit Logs")}
-            </CardTitle>
-            <CardDescription>
-              {t(
-                "msg.dev.audit.subtitle",
-                "Shows DevFront activity history within current tenant/app scope.",
-              )}
-            </CardDescription>
-          </div>
-          <div className="flex items-center gap-2">
+      <PageHeader
+        eyebrow={t("ui.dev.audit.registry.title", "Audit registry")}
+        title={t("ui.dev.audit.title", "Audit Logs")}
+        description={t(
+          "msg.dev.audit.subtitle",
+          "Shows DevFront activity history within current tenant/app scope.",
+        )}
+        actions={
+          <>
             <Badge variant="muted">
               {t("msg.dev.audit.loaded_count", "Loaded {{count}} rows", {
                 count: logs.length,
@@ -231,9 +221,12 @@ function AuditLogsPage() {
               <Download size={16} />
               {t("ui.dev.clients.consents.export_csv", "Export CSV")}
             </Button>
-          </div>
-        </CardHeader>
-        <CardContent className="space-y-4">
+          </>
+        }
+      />
+
+      <Card className="glass-panel">
+        <CardContent className="space-y-4 pt-6">
           <form
             onSubmit={(e) => {
               e.preventDefault();