From ddbf1257673aefaf678daed5c1b4d959a63ca3cf Mon Sep 17 00:00:00 2001
From: hyeonsu <hyeonsu@wace.me>
Date: Fri, 19 Sep 2025 11:09:21 +0900
Subject: [PATCH] =?UTF-8?q?=EB=8B=A8=EC=88=9C=20=ED=82=A4=EA=B0=92=20?=
 =?UTF-8?q?=EC=97=B0=EA=B2=B0=20=EB=9D=BC=EB=B2=A8=EB=A1=9C=20=EB=B3=B4?=
 =?UTF-8?q?=EC=97=AC=EC=A3=BC=EA=B8=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../dataflow/connection/SimpleKeySettings.tsx | 28 ++++++++++++-------
 1 file changed, 18 insertions(+), 10 deletions(-)

diff --git a/frontend/components/dataflow/connection/SimpleKeySettings.tsx b/frontend/components/dataflow/connection/SimpleKeySettings.tsx
index 57b5dd91..a1c34f34 100644
--- a/frontend/components/dataflow/connection/SimpleKeySettings.tsx
+++ b/frontend/components/dataflow/connection/SimpleKeySettings.tsx
@@ -132,11 +132,15 @@ export const SimpleKeySettings: React.FC<SimpleKeySettingsProps> = ({
               <Label className="text-xs font-medium text-gray-600">선택된 From 컬럼</Label>
               <div className="mt-1 flex flex-wrap gap-1">
                 {selectedFromColumns.length > 0 ? (
-                  selectedFromColumns.map((column) => (
-                    <Badge key={column} variant="outline" className="text-xs">
-                      {column}
-                    </Badge>
-                  ))
+                  selectedFromColumns.map((column) => {
+                    const columnInfo = fromTableColumns.find((col) => col.columnName === column);
+                    const displayName = columnInfo?.displayName || columnInfo?.columnLabel || column;
+                    return (
+                      <Badge key={column} variant="outline" className="text-xs">
+                        {displayName}
+                      </Badge>
+                    );
+                  })
                 ) : (
                   <span className="text-xs text-gray-400">선택된 컬럼 없음</span>
                 )}
@@ -147,11 +151,15 @@ export const SimpleKeySettings: React.FC<SimpleKeySettingsProps> = ({
               <Label className="text-xs font-medium text-gray-600">선택된 To 컬럼</Label>
               <div className="mt-1 flex flex-wrap gap-1">
                 {selectedToColumns.length > 0 ? (
-                  selectedToColumns.map((column) => (
-                    <Badge key={column} variant="secondary" className="text-xs">
-                      {column}
-                    </Badge>
-                  ))
+                  selectedToColumns.map((column) => {
+                    const columnInfo = toTableColumns.find((col) => col.columnName === column);
+                    const displayName = columnInfo?.displayName || columnInfo?.columnLabel || column;
+                    return (
+                      <Badge key={column} variant="secondary" className="text-xs">
+                        {displayName}
+                      </Badge>
+                    );
+                  })
                 ) : (
                   <span className="text-xs text-gray-400">선택된 컬럼 없음</span>
                 )}