feat: customizable link color per edge

- Add custom_color field to EdgeData type, Edge DB model and all schemas
- HomelableEdge applies custom_color as stroke override (before selected highlight)
- EDGE_DEFAULT_COLORS extracted to utils/edgeColors.ts (react-refresh compliant)
- EdgeModal: color picker row showing effective color (custom or type default)
  with hex value, Reset button when custom color is active
- Auto-migration adds custom_color column to edges table
This commit is contained in:
Pouzor
2026-03-07 14:42:34 +01:00
parent 7dd500feee
commit 8437f5ef49
9 changed files with 56 additions and 0 deletions
@@ -26,9 +26,11 @@ export function HomelableEdge({ id, sourceX, sourceY, targetX, targetY, sourcePo
const [edgePath, labelX, labelY] = getBezierPath({ sourceX, sourceY, sourcePosition, targetX, targetY, targetPosition })
const edgeType: EdgeType = data?.type ?? 'ethernet'
const customColor = data?.custom_color as string | undefined
const style: React.CSSProperties = {
...EDGE_STYLES[edgeType],
...(edgeType === 'vlan' ? { stroke: getVlanColor(data?.vlan_id as number | undefined) } : {}),
...(customColor ? { stroke: customColor } : {}),
...(selected ? { stroke: '#00d4ff', filter: 'drop-shadow(0 0 4px #00d4ff88)' } : {}),
}