summaryrefslogtreecommitdiff
path: root/lib/integration-log/table/integration-log-table-columns.tsx
diff options
context:
space:
mode:
author0-Zz-ang <s1998319@gmail.com>2025-07-10 15:56:13 +0900
committer0-Zz-ang <s1998319@gmail.com>2025-07-10 15:56:13 +0900
commit356929b399ef31a4de82906267df438cf29ea59d (patch)
treec353a55c076e987042f99f3dbf1eab54706f6829 /lib/integration-log/table/integration-log-table-columns.tsx
parent25d569828b704a102f681a627c76c4129afa8be3 (diff)
인터페이스 관련 파일 수정
Diffstat (limited to 'lib/integration-log/table/integration-log-table-columns.tsx')
-rw-r--r--lib/integration-log/table/integration-log-table-columns.tsx238
1 files changed, 238 insertions, 0 deletions
diff --git a/lib/integration-log/table/integration-log-table-columns.tsx b/lib/integration-log/table/integration-log-table-columns.tsx
new file mode 100644
index 00000000..6a955287
--- /dev/null
+++ b/lib/integration-log/table/integration-log-table-columns.tsx
@@ -0,0 +1,238 @@
+"use client";
+import * as React from "react";
+import { type ColumnDef } from "@tanstack/react-table";
+import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header";
+import { Badge } from "@/components/ui/badge";
+import { Clock, Activity, Globe, Zap, AlertCircle } from "lucide-react";
+import { formatDateTime } from "@/lib/utils";
+import { integrationLogTable } from "@/db/schema/integration-log";
+
+// 확장된 타입 정의 (JOIN 결과)
+type IntegrationLogWithIntegration = typeof integrationLogTable.$inferSelect & {
+ code?: string;
+ name?: string;
+ type?: string;
+ sourceSystem?: string;
+ targetSystem?: string;
+ status?: string;
+};
+
+export function getColumns(): ColumnDef<IntegrationLogWithIntegration>[] {
+ return [
+ {
+ accessorKey: "name",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="통합명" />
+ ),
+ cell: ({ row }) => {
+ const name = row.getValue("name") as string;
+ const code = row.getValue("code") as string;
+ return (
+ <div className="flex items-center gap-2">
+ <Activity className="h-4 w-4 text-muted-foreground" />
+ <div className="flex flex-col">
+ <span className="font-medium">{name || "-"}</span>
+ {code && (
+ <span className="text-xs text-muted-foreground">{code}</span>
+ )}
+ </div>
+ </div>
+ );
+ },
+ enableResizing: true,
+ minSize: 150,
+ size: 200,
+ },
+ {
+ accessorKey: "type",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="타입" />
+ ),
+ cell: ({ row }) => {
+ const type = row.getValue("type") as string;
+ if (!type) return <span>-</span>;
+
+ const typeMap: Record<string, { label: string; variant: "default" | "secondary" | "outline" }> = {
+ rest_api: { label: "REST API", variant: "default" },
+ soap: { label: "SOAP", variant: "secondary" },
+ db_to_db: { label: "DB to DB", variant: "outline" },
+ };
+
+ const config = typeMap[type] || { label: type, variant: "outline" };
+
+ return (
+ <Badge variant={config.variant}>
+ {config.label}
+ </Badge>
+ );
+ },
+ enableResizing: true,
+ minSize: 100,
+ size: 120,
+ },
+ {
+ accessorKey: "status",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="상태" />
+ ),
+ cell: ({ row }) => {
+ const status = row.getValue("status") as string;
+ const statusMap: Record<string, { label: string; variant: "default" | "secondary" | "destructive" | "outline" }> = {
+ success: { label: "성공", variant: "default" },
+ failed: { label: "실패", variant: "destructive" },
+ timeout: { label: "타임아웃", variant: "secondary" },
+ pending: { label: "대기중", variant: "outline" },
+ };
+
+ const config = statusMap[status] || { label: status, variant: "outline" };
+
+ return (
+ <Badge variant={config.variant}>
+ {config.label}
+ </Badge>
+ );
+ },
+ enableResizing: true,
+ minSize: 100,
+ size: 120,
+ },
+ {
+ accessorKey: "requestMethod",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="메서드" />
+ ),
+ cell: ({ row }) => {
+ const method = row.getValue("requestMethod") as string;
+ if (!method) return <span>-</span>;
+
+ const methodColors: Record<string, string> = {
+ GET: "bg-blue-100 text-blue-800",
+ POST: "bg-green-100 text-green-800",
+ PUT: "bg-yellow-100 text-yellow-800",
+ DELETE: "bg-red-100 text-red-800",
+ };
+
+ return (
+ <span className={`px-2 py-1 rounded text-xs font-mono ${methodColors[method] || "bg-gray-100 text-gray-800"}`}>
+ {method}
+ </span>
+ );
+ },
+ enableResizing: true,
+ minSize: 80,
+ size: 100,
+ },
+ {
+ accessorKey: "httpStatusCode",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="상태코드" />
+ ),
+ cell: ({ row }) => {
+ const statusCode = row.getValue("httpStatusCode") as number;
+ if (!statusCode) return <span>-</span>;
+
+ const isClientError = statusCode >= 400 && statusCode < 500;
+ const isServerError = statusCode >= 500;
+
+ let colorClass = "text-green-600";
+ if (isClientError) colorClass = "text-yellow-600";
+ if (isServerError) colorClass = "text-red-600";
+
+ return (
+ <span className={`font-mono text-sm ${colorClass}`}>
+ {statusCode}
+ </span>
+ );
+ },
+ enableResizing: true,
+ minSize: 100,
+ size: 120,
+ },
+ {
+ accessorKey: "responseTime",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="응답시간" />
+ ),
+ cell: ({ row }) => {
+ const responseTime = row.getValue("responseTime") as number;
+ if (!responseTime) return <span>-</span>;
+
+ let colorClass = "text-green-600";
+ if (responseTime > 1000) colorClass = "text-yellow-600";
+ if (responseTime > 5000) colorClass = "text-red-600";
+
+ return (
+ <div className="flex items-center gap-2">
+ <Zap className="h-4 w-4 text-muted-foreground" />
+ <span className={`text-sm ${colorClass}`}>
+ {responseTime}ms
+ </span>
+ </div>
+ );
+ },
+ enableResizing: true,
+ minSize: 100,
+ size: 120,
+ },
+ {
+ accessorKey: "executionTime",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="실행시간" />
+ ),
+ cell: ({ cell }) => {
+ const executionTime = cell.getValue() as Date;
+ return (
+ <div className="flex items-center gap-2">
+ <Clock className="h-4 w-4 text-muted-foreground" />
+ <span className="text-sm">{formatDateTime(executionTime)}</span>
+ </div>
+ );
+ },
+ enableResizing: true,
+ minSize: 150,
+ size: 180,
+ },
+ {
+ accessorKey: "requestUrl",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="요청 URL" />
+ ),
+ cell: ({ row }) => {
+ const url = row.getValue("requestUrl") as string;
+ return (
+ <div className="flex items-center gap-2">
+ <Globe className="h-4 w-4 text-muted-foreground" />
+ <div className="max-w-[200px] truncate text-sm">
+ {url || "-"}
+ </div>
+ </div>
+ );
+ },
+ enableResizing: true,
+ minSize: 150,
+ size: 200,
+ },
+ {
+ accessorKey: "errorMessage",
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="에러" />
+ ),
+ cell: ({ row }) => {
+ const errorMessage = row.getValue("errorMessage") as string;
+ if (!errorMessage) return <span>-</span>;
+
+ return (
+ <div className="flex items-center gap-2">
+ <AlertCircle className="h-4 w-4 text-red-500" />
+ <div className="max-w-[150px] truncate text-sm text-red-600">
+ {errorMessage}
+ </div>
+ </div>
+ );
+ },
+ enableResizing: true,
+ minSize: 120,
+ size: 150,
+ },
+ ];
+} \ No newline at end of file