엣지 호버 등 수정사항 반영

frontend/components/dataflow/TableNode.tsx

@@ -41,8 +41,8 @@ export const TableNode: React.FC<{ data: TableNodeData }> = ({ data }) => {
       <Handle type="target" position={Position.Left} id="left" className="!invisible !h-1 !w-1" />
       <Handle type="source" position={Position.Right} id="right" className="!invisible !h-1 !w-1" />
 
-      {/* 테이블 헤더 */}
-      <div className="bg-blue-600 p-3 text-white">
+      {/* 테이블 헤더 - 통일된 디자인 */}
+      <div className="rounded-t-lg bg-blue-600 p-3 text-white">
         <h3 className="truncate text-sm font-semibold">{table.displayName}</h3>
         {table.description && <p className="mt-1 truncate text-xs opacity-75">{table.description}</p>}
       </div>
@@ -52,14 +52,6 @@ export const TableNode: React.FC<{ data: TableNodeData }> = ({ data }) => {
         <div className="space-y-1">
           {table.columns.map((column, index) => {
             const isSelected = selectedColumns.includes(column.name);
-            const connectionInfo = connectedColumns[column.name];
-            const isConnected = !!connectionInfo;
-
-            // 연결된 컬럼에만 핸들 표시
-            const showSourceHandle =
-              isConnected && (connectionInfo.direction === "source" || connectionInfo.direction === "both");
-            const showTargetHandle =
-              isConnected && (connectionInfo.direction === "target" || connectionInfo.direction === "both");
 
             return (
               <div
@@ -69,27 +61,7 @@ export const TableNode: React.FC<{ data: TableNodeData }> = ({ data }) => {
                 }`}
                 onClick={() => onColumnClick(table.tableName, column.name)}
               >
-                {/* Target Handle (왼쪽) - 세련된 디자인 */}
-                {showTargetHandle && (
-                  <Handle
-                    type="target"
-                    position={Position.Left}
-                    id={`${table.tableName}-${column.name}-target`}
-                    className="!absolute !left-[-6px] !h-2 !w-2 !rounded-full !border-0 !bg-blue-500 !shadow-sm hover:!bg-blue-600 hover:!shadow-md"
-                    style={{ top: "50%", transform: "translateY(-50%)" }}
-                  />
-                )}
-
-                {/* Source Handle (오른쪽) - 세련된 디자인 */}
-                {showSourceHandle && (
-                  <Handle
-                    type="source"
-                    position={Position.Right}
-                    id={`${table.tableName}-${column.name}-source`}
-                    className="!absolute !right-[-6px] !h-2 !w-2 !rounded-full !border-0 !bg-blue-500 !shadow-sm hover:!bg-blue-600 hover:!shadow-md"
-                    style={{ top: "50%", transform: "translateY(-50%)" }}
-                  />
-                )}
+                {/* 핸들 제거됨 - 컬럼 클릭으로만 연결 생성 */}
 
                 <div className="flex items-center justify-between">
                   <span className="font-mono font-medium">{column.name}</span>