feat: port holistic node refinement contract

src/components/panes/map/RahNode.tsx

@@ -3,13 +3,12 @@
 import { memo } from 'react';
 import { Handle, Position, type NodeProps, type Node } from '@xyflow/react';
 import type { RahNodeData } from './utils';
-import { LABEL_THRESHOLD } from './utils';
 import { getNodeIcon } from '@/utils/nodeIcons';
 
 type RahNodeType = Node<RahNodeData, 'rahNode'>;
 
 function RahNodeComponent({ data, selected }: NodeProps<RahNodeType>) {
-  const { label, dimensions, edgeCount, isExpanded, dbNode, dimensionIcons, primaryDimensionColor } = data;
+  const { label, clusterLabel, edgeCount, isExpanded, dbNode, clusterColor } = data;
   const isTop = !isExpanded && edgeCount > 3;
 
   return (
@@ -20,7 +19,7 @@ function RahNodeComponent({ data, selected }: NodeProps<RahNodeType>) {
         isTop && 'rah-map-node--top',
         selected && 'rah-map-node--selected',
       ].filter(Boolean).join(' ')}
-      style={primaryDimensionColor ? { borderLeftColor: primaryDimensionColor, borderLeftWidth: 3 } : undefined}
+      style={clusterColor ? { borderLeftColor: clusterColor, borderLeftWidth: 3 } : undefined}
     >
       <Handle
         type="target"
@@ -29,13 +28,13 @@ function RahNodeComponent({ data, selected }: NodeProps<RahNodeType>) {
       />
       <div className="rah-map-node__title">
         <span className="rah-map-node__icon">
-          {getNodeIcon(dbNode, dimensionIcons, 14)}
+          {getNodeIcon(dbNode, 14)}
         </span>
         {label.length > 26 ? label.slice(0, 24) + '\u2026' : label}
       </div>
-      {(isTop || isExpanded) && dimensions.length > 0 && (
+      {(isTop || isExpanded) && clusterLabel && (
         <div className="rah-map-node__dims">
-          {dimensions.slice(0, 3).map(d => d.length > 12 ? d.slice(0, 11) + '\u2026' : d).join(' \u00b7 ')}
+          {clusterLabel.length > 24 ? `${clusterLabel.slice(0, 23)}\u2026` : clusterLabel}
         </div>
       )}
       <Handle