diff --git a/frontend/src/components/canvas/SearchBar.tsx b/frontend/src/components/canvas/SearchBar.tsx index 5dca55c..7bfff65 100644 --- a/frontend/src/components/canvas/SearchBar.tsx +++ b/frontend/src/components/canvas/SearchBar.tsx @@ -43,17 +43,45 @@ export function SearchBar({ onOpenPending }: SearchBarProps) { }, [open]) const q = query.toLowerCase().trim() + const nodeResults = q - ? nodes.filter((n) => { - if (n.data.type === 'groupRect') return false - return ( - n.data.label?.toLowerCase().includes(q) || - n.data.ip?.toLowerCase().includes(q) || - n.data.hostname?.toLowerCase().includes(q) || - (n.data.services ?? []).some((s) => s.service_name?.toLowerCase().includes(q)) - ) - }) - : [] + ? nodes.flatMap((n) => { + if (n.data.type === 'groupRect') return [] + + const contains = (v?: string | null) => v?.toLowerCase().includes(q) + + const matches: Array<{ key: string; display_value: string }> = [] + + for (const [key, value] of [ + ['label', n.data.label], + ['notes', n.data.notes], + ['ip', n.data.ip], + ['hostname', n.data.hostname], + ] as const) { + if (contains(value)) { + matches.push({ key, display_value: value ?? '' }) + } + } + + for (const s of n.data.services ?? []) { + if (contains(s.service_name)) { + matches.push({ key: 'services', display_value: s.service_name ?? '' }) + } + } + + for (const p of (n.data.properties ?? []).filter((p) => p.visible)) { + if (contains(p.key) || contains(p.value)) { + matches.push({ + key: 'properties', + display_value: `${p.key ?? ''} = ${p.value ?? ''}`, + }) + } + } + + return matches.length > 0 ? [{ node: n, matches: matches }] : [] + }) + : []; + const pendingResults = q ? pendingDevices.filter((d) => @@ -142,10 +170,10 @@ export function SearchBar({ onOpenPending }: SearchBarProps) { {totalResults > 0 && (