adminfront 정적 서빙 경로 수정 & devfront 빌드 오류 수정

adminfront/scripts/runtime-mode.sh

@@ -120,6 +120,7 @@ ensure_frontend_dependencies
 
 if [ "$mode" = "production" ]; then
   echo "Running in production mode with custom static server..."
+  export ADMINFRONT_BUILD_OUT_DIR="${ADMINFRONT_BUILD_OUT_DIR:-/tmp/baron-sso-adminfront-dist}"
   exec sh -c "npm run build && node ./scripts/serve-prod.mjs"
 fi
 

adminfront/vite.config.ts

@@ -2,7 +2,8 @@ import react from "@vitejs/plugin-react";
 import path from "path";
 import { defineConfig } from "vite";
 
-const buildOutDir = process.env.ADMINFRONT_BUILD_OUT_DIR ?? "dist";
+const buildOutDir =
+  process.env.ADMINFRONT_BUILD_OUT_DIR ?? "/tmp/baron-sso-adminfront-dist";
 
 export default defineConfig({
   plugins: [react()],
@@ -11,6 +12,9 @@ export default defineConfig({
       "lucide-react": path.resolve(process.cwd(), "node_modules/lucide-react"),
     },
   },
+  cacheDir:
+    process.env.ADMINFRONT_VITE_CACHE_DIR ??
+    "/tmp/baron-sso-adminfront-vite-cache",
   envPrefix: ["VITE_", "USERFRONT_", "ORGFRONT_"],
   build: {
     outDir: buildOutDir,

devfront/src/features/clients/ClientsPage.tsx

@@ -1,8 +1,8 @@
 import { useMutation, useQuery } from "@tanstack/react-query";
 import type { AxiosError } from "axios";
 import {
-  BookOpenText,
   Filter,
+  Info,
   Plus,
   Search,
   ShieldHalf,
@@ -54,6 +54,7 @@ import {
   type DevAuditLog,
   fetchDevUser,
   fetchClients,
+  fetchDevAuditLogs,
   fetchDeveloperRequestStatus,
   fetchDevStats,
   fetchMyTenants,
@@ -296,7 +297,9 @@ function ClientsPage() {
   } = useQuery({
     queryKey: ["developer-request", tenantId],
     queryFn: () => fetchDeveloperRequestStatus(tenantId),
-    enabled: hasAccessToken && (profileRole === "user" || profileRole === "tenant_member"),
+    enabled:
+      hasAccessToken &&
+      (profileRole === "user" || profileRole === "tenant_member"),
   });
   const { data: tenants } = useQuery({
     queryKey: ["myTenants"],
@@ -363,8 +366,9 @@ function ClientsPage() {
         .flat()
         .filter(
           (item, index, self) =>
-            self.findIndex((candidate) => candidate.event_id === item.event_id) ===
+            self.findIndex(
-            index,
+              (candidate) => candidate.event_id === item.event_id,
+            ) === index,
         )
         .sort(
           (left, right) =>
@@ -508,7 +512,8 @@ function ClientsPage() {
       .filter((item): item is RecentClientChange => Boolean(item))
       .sort(
         (left, right) =>
-          new Date(right.timestamp).getTime() - new Date(left.timestamp).getTime(),
+          new Date(right.timestamp).getTime() -
+          new Date(left.timestamp).getTime(),
       );
   }, [clients, recentAuditData?.items]);
 
@@ -548,7 +553,8 @@ function ClientsPage() {
   }, [recentClientActors, recentClientChanges]);
 
   const recentChangedClientCount = useMemo(() => {
-    return new Set(recentClientChangesWithActors.map((item) => item.clientId)).size;
+    return new Set(recentClientChangesWithActors.map((item) => item.clientId))
+      .size;
   }, [recentClientChangesWithActors]);
 
   const visibleRecentClientChanges = useMemo(() => {
@@ -572,10 +578,7 @@ function ClientsPage() {
         ),
       );
     }
-  }, [
+  }, [recentClientChangesWithActors.length, visibleRecentClientChangesCount]);
-    recentClientChangesWithActors.length,
-    visibleRecentClientChangesCount,
-  ]);
 
   const isLoading =
     isLoadingClients ||
@@ -1046,7 +1049,7 @@ function ClientsPage() {
         </CardContent>
       </Card>
 
-  <Card className="glass-panel">
+      <Card className="glass-panel">
         <CardHeader className="flex flex-row items-center justify-between gap-4 pb-4">
           <div>
             <div className="flex items-center gap-1.5">
@@ -1145,9 +1148,7 @@ function ClientsPage() {
                       <code className="rounded-md bg-secondary/60 px-2 py-1 font-mono text-xs text-muted-foreground">
                         {item.clientId}
                       </code>
-                      <span className="font-semibold">
+                      <span className="font-semibold">{item.actorName}</span>
-                        {item.actorName}
-                      </span>
                       <code className="rounded-md bg-secondary/60 px-2 py-1 font-mono text-xs text-muted-foreground">
                         {item.actorId}
                       </code>
@@ -1155,8 +1156,11 @@ function ClientsPage() {
                     </div>
                     <div className="flex flex-wrap gap-2">
                       {item.detailLabels.length > 0 ? (
-                        item.detailLabels.map((detail, index) => (
+                        item.detailLabels.map((detail) => (
-                          <Badge key={`${item.eventId}-${index}`} variant="outline">
+                          <Badge
+                            key={`${item.eventId}-${detail.label}`}
+                            variant="outline"
+                          >
                             {detail.label}: {detail.value}
                           </Badge>
                         ))

devfront/src/features/overview/GlobalOverviewPage.tsx

@@ -21,7 +21,6 @@ import { useDeveloperAccessGate } from "../developer-access/developerAccessGate"
 import {
   type ClientSummary,
   fetchClients,
-  fetchDeveloperRequestStatus,
   fetchDevRPUsageDaily,
   fetchDevStats,
   type RPUsageDailyMetric,
@@ -611,9 +610,7 @@ function GlobalOverviewPage() {
     setSelectedClientIds([]);
   };
 
-  if (
+  if (isLoadingDeveloperAccessGate) {
-    isLoadingDeveloperAccessGate
-  ) {
     return (
       <div className="p-8 text-center">
         {t("ui.common.loading", "Loading...")}