Merge pull request 'feature/df-consent' (#343) from feature/df-consent into dev

Reviewed-on: baron/baron-sso#343

backend/internal/handler/auth_handler.go

@@ -3423,6 +3423,12 @@ func (h *AuthHandler) ListLinkedRps(c *fiber.Ctx) error {
 					continue
 				}
 
+				// 삭제된 권한일 경우
+				status := "inactive"
+				if dc.DeletedAt.Valid {
+					status = "revoked"
+				}
+
 				// Hydra에서 클라이언트 정보 조회 (메타데이터용)
 				client, err := h.Hydra.GetClient(c.Context(), dc.ClientID)
 				if err != nil {
@@ -3432,7 +3438,7 @@ func (h *AuthHandler) ListLinkedRps(c *fiber.Ctx) error {
 						linkedRpSummary: linkedRpSummary{
 							ID:     dc.ClientID,
 							Name:   dc.ClientID,
-							Status: "inactive",
+							Status: status,
 							Scopes: dc.GrantedScopes,
 						},
 						lastAuth: dc.UpdatedAt,
@@ -3458,7 +3464,7 @@ func (h *AuthHandler) ListLinkedRps(c *fiber.Ctx) error {
 						Name:   name,
 						Logo:   extractHydraClientLogo(client.Metadata),
 						URL:    clientURL,
-						Status: "inactive",
+						Status: status,
 						Scopes: dc.GrantedScopes,
 					},
 					lastAuth: dc.UpdatedAt,

backend/internal/handler/dev_handler.go

@@ -93,15 +93,17 @@ type clientEndpoints struct {
 }
 
 type consentSummary struct {
-	Subject         string    `json:"subject"`
+	Subject         string     `json:"subject"`
-	UserName        string    `json:"userName,omitempty"`
+	UserName        string     `json:"userName,omitempty"`
-	ClientID        string    `json:"clientId"`
+	ClientID        string     `json:"clientId"`
-	ClientName      string    `json:"clientName,omitempty"`
+	ClientName      string     `json:"clientName,omitempty"`
-	GrantedScopes   []string  `json:"grantedScopes"`
+	GrantedScopes   []string   `json:"grantedScopes"`
-	AuthenticatedAt string    `json:"authenticatedAt,omitempty"`
+	AuthenticatedAt string     `json:"authenticatedAt,omitempty"`
-	CreatedAt       time.Time `json:"createdAt"`
+	CreatedAt       time.Time  `json:"createdAt"`
-	TenantID        string    `json:"tenantId,omitempty"`
+	DeletedAt       *time.Time `json:"deletedAt,omitempty"`
-	TenantName      string    `json:"tenantName,omitempty"`
+	Status          string     `json:"status"`
+	TenantID        string     `json:"tenantId,omitempty"`
+	TenantName      string     `json:"tenantName,omitempty"`
 }
 
 type consentListResponse struct {
@@ -648,6 +650,7 @@ func (h *DevHandler) ListConsents(c *fiber.Ctx) error {
 
 	// [Isolation] Get admin tenant ID from header or locals
 	adminTenantID := c.Get("X-Tenant-ID") // Assume middleware sets this or trusted in dev
+	statusFilter := strings.ToLower(strings.TrimSpace(c.Query("status")))
 
 	var consents []domain.ClientConsentWithTenantInfo
 	var total int64
@@ -686,6 +689,23 @@ func (h *DevHandler) ListConsents(c *fiber.Ctx) error {
 			continue
 		}
 
+		var deletedAt *time.Time
+		status := "active"
+		if consent.DeletedAt.Valid {
+			deletedAt = &consent.DeletedAt.Time
+			status = "revoked"
+		}
+
+		// Filter by status if requested
+		if statusFilter != "" && statusFilter != "all" {
+			if statusFilter == "active" && status != "active" {
+				continue
+			}
+			if statusFilter == "revoked" && status != "revoked" {
+				continue
+			}
+		}
+
 		userName := ""
 		identity, err := h.KratosAdmin.GetIdentity(c.Context(), consent.Subject)
 		if err == nil && identity != nil {
@@ -703,6 +723,8 @@ func (h *DevHandler) ListConsents(c *fiber.Ctx) error {
 			GrantedScopes:   consent.GrantedScopes,
 			AuthenticatedAt: consent.UpdatedAt.Format(time.RFC3339),
 			CreatedAt:       consent.CreatedAt,
+			DeletedAt:       deletedAt,
+			Status:          status,
 			TenantID:        consent.TenantID,
 			TenantName:      consent.TenantName,
 		})

backend/internal/repository/client_consent_repository.go

@@ -24,11 +24,12 @@ func NewClientConsentRepository(db *gorm.DB) ClientConsentRepository {
 }
 
 func (r *clientConsentRepo) Upsert(ctx context.Context, consent *domain.ClientConsent) error {
-	return r.db.WithContext(ctx).
+	return r.db.WithContext(ctx).Unscoped().
 		Where("client_id = ? AND subject = ?", consent.ClientID, consent.Subject).
 		Assign(map[string]interface{}{
 			"granted_scopes": consent.GrantedScopes,
 			"updated_at":     gorm.Expr("NOW()"),
+			"deleted_at":     nil,
 		}).
 		FirstOrCreate(consent).Error
 }
@@ -44,13 +45,13 @@ func (r *clientConsentRepo) List(ctx context.Context, clientID string, limit, of
 	var total int64
 
 	// Base query for counting
-	countQuery := r.db.WithContext(ctx).Model(&domain.ClientConsent{}).Where("client_id = ?", clientID)
+	countQuery := r.db.WithContext(ctx).Unscoped().Model(&domain.ClientConsent{}).Where("client_id = ?", clientID)
 	if err := countQuery.Count(&total).Error; err != nil {
 		return nil, 0, err
 	}
 
 	// Query for fetching data
-	query := r.db.WithContext(ctx).
+	query := r.db.WithContext(ctx).Unscoped().
 		Model(&domain.ClientConsent{}).
 		Select("client_consents.*, users.tenant_id, tenants.name as tenant_name").
 		Joins("LEFT JOIN users ON users.id::text = client_consents.subject").
@@ -66,7 +67,7 @@ func (r *clientConsentRepo) ListByTenant(ctx context.Context, clientID, tenantID
 	var total int64
 
 	// Base query for counting
-	countQuery := r.db.WithContext(ctx).
+	countQuery := r.db.WithContext(ctx).Unscoped().
 		Model(&domain.ClientConsent{}).
 		Joins("JOIN users ON users.id::text = client_consents.subject").
 		Where("client_consents.client_id = ? AND users.tenant_id = ?", clientID, tenantID)
@@ -76,7 +77,7 @@ func (r *clientConsentRepo) ListByTenant(ctx context.Context, clientID, tenantID
 	}
 
 	// Query for fetching data
-	query := r.db.WithContext(ctx).
+	query := r.db.WithContext(ctx).Unscoped().
 		Model(&domain.ClientConsent{}).
 		Select("client_consents.*, users.tenant_id, tenants.name as tenant_name").
 		Joins("JOIN users ON users.id::text = client_consents.subject").
@@ -94,7 +95,7 @@ func (r *clientConsentRepo) ListByTenant(ctx context.Context, clientID, tenantID
 
 func (r *clientConsentRepo) ListBySubject(ctx context.Context, subject string) ([]domain.ClientConsent, error) {
 	var consents []domain.ClientConsent
-	err := r.db.WithContext(ctx).
+	err := r.db.WithContext(ctx).Unscoped().
 		Where("subject = ?", subject).
 		Order("updated_at DESC").
 		Find(&consents).Error

devfront/src/features/clients/ClientConsentsPage.tsx

@@ -27,12 +27,17 @@ import {
 } from "../../components/ui/table";
 import { fetchClient, fetchConsents, revokeConsent } from "../../lib/devApi";
 import { t } from "../../lib/i18n";
+import { cn } from "../../lib/utils";
 
 function ClientConsentsPage() {
   const params = useParams();
   const clientId = params.id ?? "";
   const [subjectInput, setSubjectInput] = useState("");
   const [subject, setSubject] = useState("");
+  const [statusFilter, setStatusFilter] = useState("all");
+  const [scopeFilter, setScopeFilter] = useState("all");
+  const [isAdvancedFilterOpen, setIsAdvancedFilterOpen] = useState(false);
+
   const { data: clientData } = useQuery({
     queryKey: ["client", clientId],
     queryFn: () => fetchClient(clientId),
@@ -44,9 +49,9 @@ function ClientConsentsPage() {
     error,
     refetch,
   } = useQuery({
-    queryKey: ["consents", clientId, subject],
+    queryKey: ["consents", clientId, subject, statusFilter],
-    queryFn: () => fetchConsents(subject, clientId),
+    queryFn: () => fetchConsents(subject, clientId, statusFilter),
-    enabled: clientId.length > 0, // Removed subject.length > 0 check
+    enabled: clientId.length > 0,
   });
   const revokeMutation = useMutation({
     mutationFn: (payload: { subject: string }) =>
@@ -56,7 +61,74 @@ function ClientConsentsPage() {
     },
   });
 
+  const handleRevoke = (sub: string) => {
+    if (
+      window.confirm(
+        t(
+          "msg.dev.clients.consents.revoke_confirm",
+          "정말로 이 사용자의 권한을 철회하시겠습니까? 철회 시 사용자는 다음 접속 시 다시 동의해야 합니다.",
+        ),
+      )
+    ) {
+      revokeMutation.mutate({ subject: sub });
+    }
+  };
+
   const rows = consentsData?.items ?? [];
+  const allScopes = Array.from(new Set(rows.flatMap((r) => r.grantedScopes)));
+  const filteredRows = rows.filter((row) => {
+    return scopeFilter === "all" || row.grantedScopes.includes(scopeFilter);
+  });
+
+  const handleExportCSV = () => {
+    if (filteredRows.length === 0) return;
+
+    const headers = [
+      t("ui.dev.clients.consents.table.user", "User"),
+      t("ui.dev.clients.consents.table.tenant", "Tenant"),
+      t("ui.dev.clients.table.status", "Status"),
+      t("ui.dev.clients.consents.table.scopes", "Granted Scopes"),
+      t("ui.dev.clients.consents.table.first_granted", "First Granted"),
+      t(
+        "ui.dev.clients.consents.table.last_auth",
+        "Last Authenticated / Revoked",
+      ),
+    ];
+
+    const csvContent = [
+      headers.join(","),
+      ...filteredRows.map((row) => {
+        const lastAuthRevoked =
+          row.status === "revoked" && row.deletedAt
+            ? `${t("ui.dev.clients.consents.status_revoked", "Revoked")}: ${new Date(row.deletedAt).toLocaleString()}`
+            : row.authenticatedAt
+              ? new Date(row.authenticatedAt).toLocaleString()
+              : "-";
+
+        return [
+          `"${row.subject} (${row.userName || ""})"`,
+          `"${row.tenantName || row.tenantId || ""}"`,
+          `"${row.status}"`,
+          `"${row.grantedScopes.join(", ")}"`,
+          `"${new Date(row.createdAt).toLocaleString()}"`,
+          `"${lastAuthRevoked}"`,
+        ].join(",");
+      }),
+    ].join("\n");
+
+    const blob = new Blob([`\uFEFF${csvContent}`], {
+      type: "text/csv;charset=utf-8;",
+    });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    const date = new Date().toISOString().split("T")[0];
+    link.setAttribute("href", url);
+    link.setAttribute("download", `consents_${clientId}_${date}.csv`);
+    link.style.visibility = "hidden";
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+  };
 
   return (
     <div className="space-y-8">
@@ -132,55 +204,109 @@ function ClientConsentsPage() {
       </header>
 
       <Card className="glass-panel">
-        <CardContent className="flex flex-wrap items-center justify-between gap-4">
+        <CardContent className="space-y-4">
-          <div className="flex flex-wrap items-center gap-4 flex-1">
+          <div className="flex flex-wrap items-center justify-between gap-4">
-            <div className="relative w-full max-w-md">
+            <div className="flex flex-wrap items-center gap-4 flex-1">
-              <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
+              <div className="relative w-full max-w-md">
-              <Input
+                <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
-                className="pl-10"
+                <Input
-                placeholder={t(
+                  className="pl-10"
-                  "ui.dev.clients.consents.search_placeholder",
+                  placeholder={t(
-                  "사용자 ID, 이름, 이메일로 검색",
+                    "ui.dev.clients.consents.search_placeholder",
+                    "사용자 ID, 이름, 이메일로 검색",
+                  )}
+                  value={subjectInput}
+                  onChange={(e) => setSubjectInput(e.target.value)}
+                />
+              </div>
+            </div>
+            <div className="flex items-center gap-3">
+              <Button
+                variant="ghost"
+                className={cn(
+                  "gap-1 text-muted-foreground",
+                  isAdvancedFilterOpen && "text-primary bg-primary/10",
                 )}
-                value={subjectInput}
+                onClick={() => setIsAdvancedFilterOpen(!isAdvancedFilterOpen)}
-                onChange={(e) => setSubjectInput(e.target.value)}
+              >
-              />
+                <Filter className="h-4 w-4" />
-            </div>
+                {t(
-            <div className="flex items-center gap-2">
+                  "ui.dev.clients.consents.filters.advanced",
-              <span className="text-xs font-bold uppercase tracking-wider text-muted-foreground">
+                  "Advanced Filters",
-                {t("ui.dev.clients.consents.status_label", "Status:")}
+                )}
-              </span>
+              </Button>
-              <select className="h-10 rounded-lg border border-input bg-background px-3 text-sm focus:border-primary focus:outline-none focus:ring-2 focus:ring-primary/30">
+              <Button
-                <option>
+                className="shadow-sm shadow-primary/30"
-                  {t("ui.dev.clients.consents.status_all", "All Statuses")}
+                onClick={() => setSubject(subjectInput.trim())}
-                </option>
+              >
-                <option selected>
+                {t("ui.common.search", "검색")}
-                  {t("ui.common.status.active", "Active")}
+              </Button>
-                </option>
+              <Button
-                <option>
+                className="shadow-sm shadow-primary/30"
-                  {t("ui.dev.clients.consents.status_revoked", "Revoked")}
+                onClick={handleExportCSV}
-                </option>
+                disabled={filteredRows.length === 0}
-              </select>
+              >
+                {t("ui.dev.clients.consents.export_csv", "Export CSV")}
+              </Button>
             </div>
           </div>
-          <div className="flex items-center gap-3">
+
-            <Button variant="ghost" className="gap-1 text-muted-foreground">
+          {isAdvancedFilterOpen && (
-              <Filter className="h-4 w-4" />
+            <div className="flex flex-wrap items-center gap-6 rounded-lg bg-secondary/30 p-4 border border-border/40 animate-in fade-in slide-in-from-top-2 duration-200">
-              {t(
+              <div className="flex items-center gap-2">
-                "ui.dev.clients.consents.filters.advanced",
+                <span className="text-xs font-bold uppercase tracking-wider text-muted-foreground whitespace-nowrap">
-                "Advanced Filters",
+                  {t("ui.dev.clients.consents.status_label", "Status:")}
-              )}
+                </span>
-            </Button>
+                <select
-            <Button
+                  className="h-9 rounded-md border border-input bg-background px-3 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary/30 min-w-[140px]"
-              className="shadow-sm shadow-primary/30"
+                  value={statusFilter}
-              onClick={() => setSubject(subjectInput.trim())}
+                  onChange={(e) => setStatusFilter(e.target.value)}
-            >
+                >
-              {t("ui.common.search", "검색")}
+                  <option value="all">
-            </Button>
+                    {t("ui.dev.clients.consents.status_all", "All Statuses")}
-            <Button className="shadow-sm shadow-primary/30">
+                  </option>
-              {t("ui.dev.clients.consents.export_csv", "Export CSV")}
+                  <option value="active">
-            </Button>
+                    {t("ui.common.status.active", "Active")}
-          </div>
+                  </option>
+                  <option value="revoked">
+                    {t("ui.dev.clients.consents.status_revoked", "Revoked")}
+                  </option>
+                </select>
+              </div>
+
+              <div className="flex items-center gap-2">
+                <span className="text-xs font-bold uppercase tracking-wider text-muted-foreground whitespace-nowrap">
+                  {t("ui.dev.clients.consents.scope_label", "Scope:")}
+                </span>
+                <select
+                  className="h-9 rounded-md border border-input bg-background px-3 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary/30 min-w-[140px]"
+                  value={scopeFilter}
+                  onChange={(e) => setScopeFilter(e.target.value)}
+                >
+                  <option value="all">
+                    {t("ui.dev.clients.consents.scope_all", "All Scopes")}
+                  </option>
+                  {allScopes.map((scope) => (
+                    <option key={scope} value={scope}>
+                      {scope}
+                    </option>
+                  ))}
+                </select>
+              </div>
+
+              <Button
+                variant="link"
+                size="sm"
+                className="text-xs text-muted-foreground ml-auto"
+                onClick={() => {
+                  setStatusFilter("all");
+                  setScopeFilter("all");
+                }}
+              >
+                {t("ui.common.reset", "초기화")}
+              </Button>
+            </div>
+          )}
         </CardContent>
       </Card>
 
@@ -226,7 +352,7 @@ function ClientConsentsPage() {
               <TableHead>
                 {t(
                   "ui.dev.clients.consents.table.last_auth",
-                  "Last Authenticated",
+                  "Last Authenticated / Revoked",
                 )}
               </TableHead>
               <TableHead className="text-right">
@@ -235,15 +361,18 @@ function ClientConsentsPage() {
             </TableRow>
           </TableHeader>
           <TableBody>
-            {rows.length === 0 && !isLoading ? (
+            {filteredRows.length === 0 && !isLoading ? (
               <TableRow>
                 <TableCell colSpan={7} className="h-24 text-center">
                   {t("msg.dev.clients.consents.empty", "No consents found.")}
                 </TableCell>
               </TableRow>
             ) : (
-              rows.map((row) => (
+              filteredRows.map((row) => (
-                <TableRow key={`${row.subject}-${row.clientId}`}>
+                <TableRow
+                  key={`${row.subject}-${row.clientId}`}
+                  className={row.status === "revoked" ? "opacity-60" : ""}
+                >
                   <TableCell>
                     <div className="flex items-center gap-3">
                       <div className="flex h-8 w-8 items-center justify-center rounded-full bg-primary/10 text-xs font-bold text-primary">
@@ -273,9 +402,15 @@ function ClientConsentsPage() {
                     </div>
                   </TableCell>
                   <TableCell>
-                    <Badge variant="success">
+                    {row.status === "active" ? (
-                      {t("ui.common.status.active", "Active")}
+                      <Badge variant="success">
-                    </Badge>
+                        {t("ui.common.status.active", "Active")}
+                      </Badge>
+                    ) : (
+                      <Badge variant="warning">
+                        {t("ui.dev.clients.consents.status_revoked", "Revoked")}
+                      </Badge>
+                    )}
                   </TableCell>
                   <TableCell>
                     <div className="flex flex-wrap gap-1">
@@ -294,20 +429,28 @@ function ClientConsentsPage() {
                     {new Date(row.createdAt).toLocaleString()}
                   </TableCell>
                   <TableCell className="text-sm text-muted-foreground">
-                    {row.authenticatedAt
+                    {row.status === "revoked" && row.deletedAt ? (
-                      ? new Date(row.authenticatedAt).toLocaleString()
+                      <span className="text-destructive font-medium">
-                      : "-"}
+                        {t("ui.dev.clients.consents.revoked_at", "Revoked: ")}
+                        {new Date(row.deletedAt).toLocaleString()}
+                      </span>
+                    ) : row.authenticatedAt ? (
+                      new Date(row.authenticatedAt).toLocaleString()
+                    ) : (
+                      "-"
+                    )}
                   </TableCell>
                   <TableCell className="text-right">
-                    <Button
+                    {row.status === "active" && (
-                      variant="ghost"
+                      <Button
-                      className="text-destructive"
+                        variant="ghost"
-                      onClick={() =>
+                        className="text-destructive hover:bg-destructive/10"
-                        revokeMutation.mutate({ subject: row.subject })
+                        onClick={() => handleRevoke(row.subject)}
-                      }
+                        disabled={revokeMutation.isPending}
-                    >
+                      >
-                      {t("ui.dev.clients.consents.revoke", "Revoke")}
+                        {t("ui.dev.clients.consents.revoke", "Revoke")}
-                    </Button>
+                      </Button>
+                    )}
                   </TableCell>
                 </TableRow>
               ))
@@ -320,8 +463,8 @@ function ClientConsentsPage() {
               "msg.dev.clients.consents.showing",
               "Showing {{from}} to {{to}} of {{total}} users",
               {
-                from: rows.length > 0 ? 1 : 0,
+                from: filteredRows.length > 0 ? 1 : 0,
-                to: rows.length,
+                to: filteredRows.length,
                 total: rows.length,
               },
             )}
@@ -330,7 +473,7 @@ function ClientConsentsPage() {
             <Button variant="outline" size="icon" disabled>
               <ChevronLeft className="h-4 w-4" />
             </Button>
-            <Button size="sm" disabled={rows.length === 0}>
+            <Button size="sm" disabled={filteredRows.length === 0}>
               1
             </Button>
             <Button variant="outline" size="icon" disabled>
@@ -349,7 +492,9 @@ function ClientConsentsPage() {
                 "Active Grants",
               )}
             </p>
-            <CardTitle className="text-2xl font-black">{rows.length}</CardTitle>
+            <CardTitle className="text-2xl font-black">
+              {rows.filter((r) => r.status === "active").length}
+            </CardTitle>
           </CardHeader>
         </Card>
         <Card className="glass-panel">

devfront/src/features/clients/ClientsPage.tsx

@@ -2,11 +2,13 @@ import { useQuery } from "@tanstack/react-query";
 import type { AxiosError } from "axios";
 import {
   BookOpenText,
+  Filter,
   Plus,
   Search,
   ServerCog,
   ShieldHalf,
 } from "lucide-react";
+import { useState } from "react";
 import { Link, useNavigate } from "react-router-dom";
 import {
   Avatar,
@@ -43,7 +45,24 @@ function ClientsPage() {
     queryFn: fetchClients,
   });
 
+  const [searchQuery, setSearchQuery] = useState("");
+  const [typeFilter, setTypeFilter] = useState("all");
+  const [statusFilter, setStatusFilter] = useState("all");
+  const [isAdvancedFilterOpen, setIsAdvancedFilterOpen] = useState(false);
+
   const clients = data?.items || [];
+
+  const filteredClients = clients.filter((client) => {
+    const matchesSearch =
+      !searchQuery ||
+      client.name?.toLowerCase().includes(searchQuery.toLowerCase()) ||
+      client.id.toLowerCase().includes(searchQuery.toLowerCase());
+    const matchesType = typeFilter === "all" || client.type === typeFilter;
+    const matchesStatus =
+      statusFilter === "all" || client.status === statusFilter;
+    return matchesSearch && matchesType && matchesStatus;
+  });
+
   const totalClients = clients.length;
   const activeClients = clients.filter(
     (client) => client.status === "active",
@@ -137,25 +156,105 @@ function ClientsPage() {
               </Button>
             </div>
           </div>
-          <div className="mt-4 grid gap-3 md:grid-cols-[1.5fr,1fr]">
+          <div className="mt-4 flex flex-col gap-3">
-            <div className="relative">
+            <div className="flex flex-col gap-3 md:flex-row md:items-center">
-              <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
+              <div className="relative flex-1">
-              <Input
+                <Search className="absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
-                className="pl-10"
+                <Input
-                placeholder={t(
+                  className="pl-10"
-                  "ui.dev.clients.search_placeholder",
+                  placeholder={t(
-                  "클라이언트 이름/ID로 검색...",
+                    "ui.dev.clients.search_placeholder",
-                )}
+                    "클라이언트 이름/ID로 검색...",
-              />
+                  )}
-            </div>
+                  value={searchQuery}
-            <div className="flex items-center justify-end gap-2 md:justify-start">
+                  onChange={(e) => setSearchQuery(e.target.value)}
-              <Badge variant="muted">
+                />
-                {t("ui.dev.clients.badge.tenant_selected", "테넌트: 선택됨")}
+              </div>
-              </Badge>
+              <div className="flex items-center gap-2">
-              <Badge variant="success">
+                <Button
-                {t("ui.dev.clients.badge.admin_session", "관리자 세션")}
+                  variant="ghost"
-              </Badge>
+                  size="sm"
+                  className={cn(
+                    "gap-1 text-muted-foreground",
+                    isAdvancedFilterOpen && "text-primary bg-primary/10",
+                  )}
+                  onClick={() => setIsAdvancedFilterOpen(!isAdvancedFilterOpen)}
+                >
+                  <Filter className="h-4 w-4" />
+                  {t(
+                    "ui.dev.clients.consents.filters.advanced",
+                    "Advanced Filters",
+                  )}
+                </Button>
+                <div className="hidden items-center gap-2 md:flex">
+                  <Badge variant="muted">
+                    {t(
+                      "ui.dev.clients.badge.tenant_selected",
+                      "테넌트: 선택됨",
+                    )}
+                  </Badge>
+                  <Badge variant="success">
+                    {t("ui.dev.clients.badge.admin_session", "관리자 세션")}
+                  </Badge>
+                </div>
+              </div>
             </div>
+
+            {isAdvancedFilterOpen && (
+              <div className="flex flex-wrap items-center gap-6 rounded-lg bg-secondary/30 p-4 border border-border/40 animate-in fade-in slide-in-from-top-2 duration-200">
+                <div className="flex items-center gap-2">
+                  <span className="text-xs font-bold uppercase tracking-wider text-muted-foreground whitespace-nowrap">
+                    {t("ui.dev.clients.filter.type_label", "Type:")}
+                  </span>
+                  <select
+                    className="h-9 rounded-md border border-input bg-background px-3 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary/30 min-w-[140px]"
+                    value={typeFilter}
+                    onChange={(e) => setTypeFilter(e.target.value)}
+                  >
+                    <option value="all">
+                      {t("ui.dev.clients.filter.type_all", "모든 유형")}
+                    </option>
+                    <option value="private">
+                      {t("ui.dev.clients.type.private", "Server side App")}
+                    </option>
+                    <option value="pkce">
+                      {t("ui.dev.clients.type.pkce", "PKCE")}
+                    </option>
+                  </select>
+                </div>
+                <div className="flex items-center gap-2">
+                  <span className="text-xs font-bold uppercase tracking-wider text-muted-foreground whitespace-nowrap">
+                    {t("ui.dev.clients.consents.status_label", "Status:")}
+                  </span>
+                  <select
+                    className="h-9 rounded-md border border-input bg-background px-3 text-sm focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary/30 min-w-[140px]"
+                    value={statusFilter}
+                    onChange={(e) => setStatusFilter(e.target.value)}
+                  >
+                    <option value="all">
+                      {t("ui.dev.clients.filter.status_all", "모든 상태")}
+                    </option>
+                    <option value="active">
+                      {t("ui.common.status.active", "Active")}
+                    </option>
+                    <option value="inactive">
+                      {t("ui.common.status.inactive", "Inactive")}
+                    </option>
+                  </select>
+                </div>
+                <Button
+                  variant="link"
+                  size="sm"
+                  className="text-xs text-muted-foreground ml-auto"
+                  onClick={() => {
+                    setTypeFilter("all");
+                    setStatusFilter("all");
+                  }}
+                >
+                  {t("ui.common.reset", "초기화")}
+                </Button>
+              </div>
+            )}
           </div>
         </CardHeader>
         <CardContent className="pt-0">
@@ -222,7 +321,7 @@ function ClientsPage() {
               </TableRow>
             </TableHeader>
             <TableBody>
-              {clients.map((client) => (
+              {filteredClients.map((client) => (
                 <TableRow key={client.id} className="bg-card/40">
                   <TableCell>
                     <Link
@@ -296,7 +395,7 @@ function ClientsPage() {
               {t(
                 "msg.dev.clients.showing",
                 "Showing {{shown}} of {{total}} clients",
-                { shown: clients.length, total: totalClients },
+                { shown: filteredClients.length, total: totalClients },
               )}
             </span>
             <div className="flex gap-2">

devfront/src/features/clients/routes/ClientFederationPage.tsx

@@ -1,5 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { Plus, Trash2, Edit, Globe, Save } from "lucide-react";
+import { Edit, Globe, Plus, Save, Trash2 } from "lucide-react";
 import { useState } from "react";
 import { useParams } from "react-router-dom";
 import { Button } from "../../../components/ui/button";
@@ -156,7 +156,7 @@ const CreateIdpModal = ({
                 disabled={
                   mutation.isPending ||
                   formData.display_name.trim() === "" ||
-                  formData.issuer_url.trim() === ""
+                  (formData.issuer_url?.trim() ?? "") === ""
                 }
               >
                 {mutation.isPending ? (

devfront/src/lib/devApi.ts

@@ -57,6 +57,8 @@ export type ConsentSummary = {
   grantedScopes: string[];
   authenticatedAt?: string;
   createdAt: string;
+  deletedAt?: string;
+  status: "active" | "revoked";
   tenantId?: string;
   tenantName?: string;
 };
@@ -148,11 +150,18 @@ export async function deleteClient(clientId: string) {
   await apiClient.delete(`/dev/clients/${clientId}`);
 }
 
-export async function fetchConsents(subject: string, clientId?: string) {
+export async function fetchConsents(
+  subject: string,
+  clientId?: string,
+  status?: string,
+) {
   const params: Record<string, string> = { subject };
   if (clientId) {
     params.client_id = clientId;
   }
+  if (status && status !== "all") {
+    params.status = status;
+  }
   const { data } = await apiClient.get<ConsentListResponse>("/dev/consents", {
     params,
   });

devfront/src/locales/ko.toml

@@ -956,36 +956,37 @@ admin_session = "관리자 세션"
 tenant_selected = "테넌트: 선택됨"
 
 [ui.dev.clients.consents]
-export_csv = "Export CSV"
+export_csv = "CSV 내보내기"
-revoke = "Revoke"
+revoke = "권한 철회"
+revoked_at = "철회일: "
 search_placeholder = "사용자 ID, 이름, 이메일로 검색"
-status_all = "All Statuses"
+status_all = "모든 상태"
-status_label = "Status:"
+status_label = "상태:"
-status_revoked = "Revoked"
+status_revoked = "철회됨"
-subject = "Subject"
+subject = "사용자 ID"
-title = "User Consent Grants"
+title = "사용자 동의 권한 관리"
 
 [ui.dev.clients.consents.breadcrumb]
-clients = "Clients"
+clients = "애플리케이션"
-current = "User Consent Grants"
+current = "사용자 동의 권한"
-home = "Home"
+home = "홈"
 
 [ui.dev.clients.consents.filters]
-advanced = "Advanced Filters"
+advanced = "상세 필터"
 
 [ui.dev.clients.consents.stats]
-active_grants = "Active Grants"
+active_grants = "활성 권한"
-avg_scopes = "Avg. Scopes per User"
+avg_scopes = "사용자당 평균 권한 수"
-total_scopes = "Total Scopes Issued"
+total_scopes = "전체 부여된 권한 수"
 
 [ui.dev.clients.consents.table]
-action = "Action"
+action = "작업"
-first_granted = "First Granted"
+first_granted = "최초 동의"
-last_auth = "Last Authenticated"
+last_auth = "최근 인증 / 철회"
-scopes = "Granted Scopes"
+scopes = "부여된 권한 (Scopes)"
-status = "Status"
+status = "상태"
-tenant = "Tenant"
+tenant = "테넌트"
-user = "User"
+user = "사용자"
 
 [ui.dev.clients.details]
 

locales/en.toml

@@ -281,6 +281,7 @@ load_error = "Error loading consents: {{error}}"
 loading = "Loading consents..."
 showing = "Showing {{from}} to {{to}} of {{total}} users"
 subtitle = "Subtitle"
+revoke_confirm = "Are you sure you want to revoke this user's permissions? After revocation, the user must consent again on next login."
 
 [msg.dev.clients.details]
 copy_client_id = "Client ID copied."
@@ -1045,6 +1046,7 @@ previous = "Previous"
 qr = "QR"
 read_only = "Read Only"
 refresh = "Refresh"
+reset = "Reset"
 requesting = "Requesting"
 resend = "Resend"
 retry = "Retry"
@@ -1104,9 +1106,17 @@ untitled = "Untitled"
 admin_session = "Admin Session"
 tenant_selected = "Tenant Selected"
 
+[ui.dev.clients.filter]
+status_all = "All Statuses"
+type_all = "All Types"
+type_label = "Type:"
+
 [ui.dev.clients.consents]
 export_csv = "Export CSV"
 revoke = "Revoke"
+revoked_at = "Revoked: "
+scope_all = "All Scopes"
+scope_label = "Scope:"
 search_placeholder = "Search Placeholder"
 status_all = "All Statuses"
 status_label = "Status:"

locales/ko.toml

@@ -281,6 +281,7 @@ load_error = "Error loading consents: {{error}}"
 loading = "Loading consents..."
 showing = "Showing {{from}} to {{to}} of {{total}} users"
 subtitle = "OIDC Relying Party 사용자 권한을 검토·관리합니다."
+revoke_confirm = "정말로 이 사용자의 권한을 철회하시겠습니까? 철회 시 사용자는 다음 접속 시 다시 동의해야 합니다."
 
 [msg.dev.clients.details]
 copy_client_id = "Client ID가 복사되었습니다."
@@ -1045,6 +1046,7 @@ previous = "Previous"
 qr = "QR"
 read_only = "읽기 전용"
 refresh = "새로고침"
+reset = "초기화"
 requesting = "요청 중..."
 resend = "재발송"
 retry = "다시 시도"
@@ -1104,9 +1106,17 @@ untitled = "Untitled"
 admin_session = "관리자 세션"
 tenant_selected = "테넌트: 선택됨"
 
+[ui.dev.clients.filter]
+status_all = "모든 상태"
+type_all = "모든 유형"
+type_label = "유형:"
+
 [ui.dev.clients.consents]
 export_csv = "Export CSV"
 revoke = "Revoke"
+revoked_at = "철회일: "
+scope_all = "모든 권한"
+scope_label = "권한:"
 search_placeholder = "사용자 ID, 이름, 이메일로 검색"
 status_all = "All Statuses"
 status_label = "Status:"

locales/template.toml

@@ -222,6 +222,7 @@ load_error = ""
 loading = ""
 showing = ""
 subtitle = ""
+revoke_confirm = ""
 
 [msg.dev.clients.details]
 copy_client_id = ""
@@ -907,6 +908,7 @@ page_of = ""
 prev = ""
 previous = ""
 qr = ""
+reset = ""
 read_only = ""
 refresh = ""
 resend = ""
@@ -966,9 +968,17 @@ untitled = ""
 admin_session = ""
 tenant_selected = ""
 
+[ui.dev.clients.filter]
+status_all = ""
+type_all = ""
+type_label = ""
+
 [ui.dev.clients.consents]
 export_csv = ""
 revoke = ""
+revoked_at = ""
+scope_all = ""
+scope_label = ""
 search_placeholder = ""
 status_all = ""
 status_label = ""

userfront/assets/translations/en.toml

@@ -322,6 +322,7 @@ previous = "Previous"
 qr = "QR"
 read_only = "Read Only"
 refresh = "Refresh"
+reset = "Reset"
 requesting = "Requesting"
 resend = "Resend"
 retry = "Retry"

userfront/assets/translations/ko.toml

@@ -322,6 +322,7 @@ previous = "Previous"
 qr = "QR"
 read_only = "읽기 전용"
 refresh = "새로고침"
+reset = "초기화"
 requesting = "요청 중..."
 resend = "재발송"
 retry = "다시 시도"

userfront/assets/translations/template.toml

@@ -312,6 +312,7 @@ page_of = ""
 prev = ""
 previous = ""
 qr = ""
+reset = ""
 read_only = ""
 refresh = ""
 resend = ""