File Content: 5511.93023985e5c5efe49ae2.js.map {"version":3,"file":"5511.93023985e5c5efe49ae2.js","mappings":"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","sources":["webpack://grafana/./public/app/plugins/panel/nodeGraph/EdgeArrowMarker.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/Edge.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/EdgeLabel.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/Legend.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/Marker.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/ViewControls.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/createLayoutWorker.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/useNodeLimit.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/layout.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/useContextMenu.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/useFocusPositionOnLayout.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/useHighlight.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/usePanning.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/useZoom.ts","webpack://grafana/./public/app/plugins/panel/nodeGraph/NodeGraph.tsx","webpack://grafana/./public/app/plugins/panel/nodeGraph/useCategorizeFrames.ts"],"sourcesContent":["import React from 'react';\n\nimport { defaultEdgeColor } from './Edge';\n\n/**\n * In SVG you need to supply this kind of marker that can be then referenced from a line segment as an ending of the\n * line turning in into arrow. Needs to be included in the svg element and then referenced as markerEnd=\"url(#triangle)\"\n */\nexport function EdgeArrowMarker({\n id = 'triangle',\n fill = defaultEdgeColor,\n headHeight = 10,\n}: {\n id?: string;\n fill?: string;\n headHeight?: number;\n}) {\n return (\n <defs>\n <marker\n id={id}\n viewBox=\"0 0 10 10\"\n refX=\"1\" // shift the arrow head slightly closer to the center of the line it will be attached to, to ensure no empty space is shown between the line and the arrow head\n refY=\"5\"\n markerUnits=\"userSpaceOnUse\"\n markerWidth={headHeight} // equal to the height just for simplicily\n markerHeight={headHeight}\n orient=\"auto\"\n >\n <path d=\"M 0 0 L 10 5 L 0 10 z\" fill={fill} />\n </marker>\n </defs>\n );\n}\n","import React, { MouseEvent, memo } from 'react';\n\nimport { EdgeArrowMarker } from './EdgeArrowMarker';\nimport { computeNodeCircumferenceStrokeWidth, nodeR } from './Node';\nimport { EdgeDatum, NodeDatum } from './types';\nimport { shortenLine } from './utils';\n\nexport const highlightedEdgeColor = '#a00';\nexport const defaultEdgeColor = '#999';\n\ninterface Props {\n edge: EdgeDatum;\n hovering: boolean;\n onClick: (event: MouseEvent<SVGElement>, link: EdgeDatum) => void;\n onMouseEnter: (id: string) => void;\n onMouseLeave: (id: string) => void;\n}\n\nexport const Edge = memo(function Edge(props: Props) {\n const { edge, onClick, onMouseEnter, onMouseLeave, hovering } = props;\n\n // Not great typing but after we do layout these properties are full objects not just references\n const { source, target, sourceNodeRadius, targetNodeRadius } = edge as {\n source: NodeDatum;\n target: NodeDatum;\n sourceNodeRadius: number;\n targetNodeRadius: number;\n };\n const arrowHeadHeight = 10 + edge.thickness * 2; // resized value, just to make the UI nicer\n\n // As the nodes have some radius we want edges to end outside of the node circle.\n const line = shortenLine(\n {\n x1: source.x!,\n y1: source.y!,\n x2: target.x!,\n y2: target.y!,\n },\n sourceNodeRadius + computeNodeCircumferenceStrokeWidth(sourceNodeRadius) / 2 || nodeR,\n targetNodeRadius + computeNodeCircumferenceStrokeWidth(targetNodeRadius) / 2 || nodeR,\n arrowHeadHeight\n );\n\n const markerId = `triangle-${edge.id}`;\n const coloredMarkerId = `triangle-colored-${edge.id}`;\n\n return (\n <>\n <EdgeArrowMarker id={markerId} headHeight={arrowHeadHeight} />\n <EdgeArrowMarker id={coloredMarkerId} fill={highlightedEdgeColor} headHeight={arrowHeadHeight} />\n <g\n onClick={(event) => onClick(event, edge)}\n style={{ cursor: 'pointer' }}\n aria-label={`Edge from: ${source.id} to: ${target.id}`}\n >\n <line\n strokeWidth={(hovering ? 1 : 0) + (edge.highlighted ? 1 : 0) + edge.thickness}\n stroke={edge.highlighted ? highlightedEdgeColor : defaultEdgeColor}\n x1={line.x1}\n y1={line.y1}\n x2={line.x2}\n y2={line.y2}\n markerEnd={`url(#${edge.highlighted ? coloredMarkerId : markerId})`}\n />\n <line\n stroke={'transparent'}\n x1={line.x1}\n y1={line.y1}\n x2={line.x2}\n y2={line.y2}\n strokeWidth={20}\n onMouseEnter={() => {\n onMouseEnter(edge.id);\n }}\n onMouseLeave={() => {\n onMouseLeave(edge.id);\n }}\n />\n </g>\n </>\n );\n});\n","import { css } from '@emotion/css';\nimport React, { memo } from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\n\nimport { nodeR } from './Node';\nimport { EdgeDatum, NodeDatum } from './types';\nimport { shortenLine } from './utils';\n\nconst getStyles = (theme: GrafanaTheme2) => {\n return {\n mainGroup: css`\n pointer-events: none;\n font-size: 8px;\n `,\n\n background: css`\n fill: ${theme.components.tooltip.background};\n `,\n\n text: css`\n fill: ${theme.components.tooltip.text};\n `,\n };\n};\n\ninterface Props {\n edge: EdgeDatum;\n}\nexport const EdgeLabel = memo(function EdgeLabel(props: Props) {\n const { edge } = props;\n // Not great typing, but after we do layout these properties are full objects not just references\n const { source, target, sourceNodeRadius, targetNodeRadius } = edge as {\n source: NodeDatum;\n target: NodeDatum;\n sourceNodeRadius: number;\n targetNodeRadius: number;\n };\n\n // As the nodes have some radius we want edges to end outside the node circle.\n const line = shortenLine(\n {\n x1: source.x!,\n y1: source.y!,\n x2: target.x!,\n y2: target.y!,\n },\n sourceNodeRadius || nodeR,\n targetNodeRadius || nodeR\n );\n\n const middle = {\n x: line.x1 + (line.x2 - line.x1) / 2,\n y: line.y1 + (line.y2 - line.y1) / 2,\n };\n const styles = useStyles2(getStyles);\n\n const stats = [edge.mainStat, edge.secondaryStat].filter((x) => x);\n const height = stats.length > 1 ? '30' : '15';\n const middleOffset = stats.length > 1 ? 15 : 7.5;\n let offset = stats.length > 1 ? -5 : 2.5;\n\n const contents: JSX.Element[] = [];\n stats.forEach((stat, index) => {\n contents.push(\n <text key={index} className={styles.text} x={middle.x} y={middle.y + offset} textAnchor={'middle'}>\n {stat}\n </text>\n );\n offset += 15;\n });\n\n return (\n <g className={styles.mainGroup}>\n <rect\n className={styles.background}\n x={middle.x - 40}\n y={middle.y - middleOffset}\n width=\"80\"\n height={height}\n rx=\"5\"\n />\n {contents}\n </g>\n );\n});\n","import { css } from '@emotion/css';\nimport React, { useCallback } from 'react';\n\nimport { Field, FieldColorModeId, GrafanaTheme2 } from '@grafana/data';\nimport { LegendDisplayMode } from '@grafana/schema';\nimport { Icon, useStyles2, useTheme2, VizLegend, VizLegendItem, VizLegendListItem } from '@grafana/ui';\n\nimport { Config } from './layout';\nimport { NodeDatum } from './types';\n\nfunction getStyles() {\n return {\n item: css`\n label: LegendItem;\n flex-grow: 0;\n `,\n\n legend: css`\n label: Legend;\n pointer-events: all;\n `,\n };\n}\n\ninterface Props {\n nodes: NodeDatum[];\n onSort: (sort: Config['sort']) => void;\n sort?: Config['sort'];\n sortable: boolean;\n}\n\nexport const Legend = function Legend(props: Props) {\n const { nodes, onSort, sort, sortable } = props;\n\n const theme = useTheme2();\n const styles = useStyles2(getStyles);\n const colorItems = getColorLegendItems(nodes, theme);\n\n const onClick = useCallback(\n (item: VizLegendItem<ItemData>) => {\n onSort({\n field: item.data!.field,\n ascending: item.data!.field === sort?.field ? !sort?.ascending : false,\n });\n },\n [sort, onSort]\n );\n\n return (\n <VizLegend<ItemData>\n className={styles.legend}\n displayMode={LegendDisplayMode.List}\n placement={'bottom'}\n items={colorItems}\n itemRenderer={(item) => {\n return (\n <>\n <VizLegendListItem item={item} className={styles.item} onLabelClick={sortable ? onClick : undefined} />\n {sortable &&\n (sort?.field === item.data!.field ? <Icon name={sort!.ascending ? 'arrow-up' : 'arrow-down'} /> : '')}\n </>\n );\n }}\n />\n );\n};\n\ninterface ItemData {\n field: Field;\n}\n\nfunction getColorLegendItems(nodes: NodeDatum[], theme: GrafanaTheme2): Array<VizLegendItem<ItemData>> {\n if (!nodes.length) {\n return [];\n }\n const fields = [nodes[0].mainStat, nodes[0].secondaryStat].filter((item): item is NonNullable<typeof item> =>\n Boolean(item)\n );\n\n const node = nodes.find((n) => n.arcSections.length > 0);\n if (node) {\n if (node.arcSections[0]!.config?.color?.mode === FieldColorModeId.Fixed) {\n // We assume in this case we have a set of fixed colors which map neatly into a basic legend.\n\n // Lets collect and deduplicate as there isn't a requirement for 0 size arc section to be defined\n fields.push(...new Set(nodes.map((n) => n.arcSections).flat()));\n }\n }\n\n if (nodes[0].color) {\n fields.push(nodes[0].color);\n }\n\n return fields.map((f) => {\n const item: VizLegendItem = {\n label: f.config.displayName || f.name,\n yAxis: 0,\n data: { field: f },\n };\n if (f.config.color?.mode === FieldColorModeId.Fixed && f.config.color?.fixedColor) {\n item.color = theme.visualization.getColorByName(f.config.color?.fixedColor || '');\n } else if (f.config.color?.mode) {\n item.gradient = f.config.color?.mode;\n }\n\n if (!(item.color || item.gradient)) {\n // Defaults to gray color\n item.color = theme.visualization.getColorByName('');\n }\n\n return item;\n });\n}\n","import { css } from '@emotion/css';\nimport React, { MouseEvent, memo } from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\n\nimport { NodesMarker } from './types';\n\nconst nodeR = 40;\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n mainGroup: css`\n cursor: pointer;\n font-size: 10px;\n `,\n\n mainCircle: css`\n fill: ${theme.components.panel.background};\n stroke: ${theme.colors.border.strong};\n `,\n text: css`\n width: 50px;\n height: 50px;\n text-align: center;\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n});\n\nexport const Marker = memo(function Marker(props: {\n marker: NodesMarker;\n onClick?: (event: MouseEvent<SVGElement>, marker: NodesMarker) => void;\n}) {\n const { marker, onClick } = props;\n const { node } = marker;\n const styles = useStyles2(getStyles);\n\n if (!(node.x !== undefined && node.y !== undefined)) {\n return null;\n }\n\n return (\n <g\n data-node-id={node.id}\n className={styles.mainGroup}\n onClick={(event) => {\n onClick?.(event, marker);\n }}\n aria-label={`Hidden nodes marker: ${node.id}`}\n >\n <circle className={styles.mainCircle} r={nodeR} cx={node.x} cy={node.y} />\n <g>\n <foreignObject x={node.x - 25} y={node.y - 25} width=\"50\" height=\"50\">\n <div className={styles.text}>\n {/* we limit the count to 101 so if we have more than 100 nodes we don't have exact count */}\n <span>{marker.count > 100 ? '>100' : marker.count} nodes</span>\n </div>\n </foreignObject>\n </g>\n </g>\n );\n});\n","import { css } from '@emotion/css';\nimport React, { useState } from 'react';\n\nimport { Button, HorizontalGroup, useStyles2, VerticalGroup } from '@grafana/ui';\n\nfunction getStyles() {\n return {\n wrapper: css`\n label: wrapper;\n pointer-events: all;\n `,\n };\n}\n\ninterface Props<Config> {\n config: Config;\n onConfigChange: (config: Config) => void;\n onPlus: () => void;\n onMinus: () => void;\n scale: number;\n disableZoomOut?: boolean;\n disableZoomIn?: boolean;\n}\n\n/**\n * Control buttons for zoom but also some layout config inputs mainly for debugging.\n */\nexport function ViewControls<Config extends Record<string, any>>(props: Props<Config>) {\n const { config, onConfigChange, onPlus, onMinus, disableZoomOut, disableZoomIn } = props;\n const [showConfig, setShowConfig] = useState(false);\n\n // For debugging the layout, should be removed here and maybe moved to panel config later on\n const allowConfiguration = false;\n const styles = useStyles2(getStyles);\n\n return (\n <div className={styles.wrapper}>\n <VerticalGroup spacing=\"sm\">\n <HorizontalGroup spacing=\"xs\">\n <Button\n icon={'plus-circle'}\n onClick={onPlus}\n size={'md'}\n title={'Zoom in'}\n variant=\"secondary\"\n disabled={disableZoomIn}\n />\n <Button\n icon={'minus-circle'}\n onClick={onMinus}\n size={'md'}\n title={'Zoom out'}\n variant=\"secondary\"\n disabled={disableZoomOut}\n />\n </HorizontalGroup>\n <HorizontalGroup spacing=\"xs\">\n <Button\n icon={'code-branch'}\n onClick={() => onConfigChange({ ...config, gridLayout: false })}\n size={'md'}\n title={'Default layout'}\n variant=\"secondary\"\n disabled={!config.gridLayout}\n />\n <Button\n icon={'apps'}\n onClick={() => onConfigChange({ ...config, gridLayout: true })}\n size={'md'}\n title={'Grid layout'}\n variant=\"secondary\"\n disabled={config.gridLayout}\n />\n </HorizontalGroup>\n </VerticalGroup>\n\n {allowConfiguration && (\n <Button size={'xs'} fill=\"text\" onClick={() => setShowConfig((showConfig) => !showConfig)}>\n {showConfig ? 'Hide config' : 'Show config'}\n </Button>\n )}\n\n {allowConfiguration &&\n showConfig &&\n Object.keys(config)\n .filter((k) => k !== 'show')\n .map((k) => (\n <div key={k}>\n {k}\n <input\n style={{ width: 50 }}\n type={'number'}\n value={config[k]}\n onChange={(e) => {\n onConfigChange({ ...config, [k]: parseFloat(e.target.value) });\n }}\n />\n </div>\n ))}\n </div>\n );\n}\n","import { CorsWorker as Worker } from 'app/core/utils/CorsWorker';\n\nexport const createWorker = () => new Worker(new URL('./layout.worker.js', import.meta.url));\nexport const createMsaglWorker = () => new Worker(new URL('./layoutMsagl.worker.js', import.meta.url));\n","import { fromPairs, uniq } from 'lodash';\nimport { useMemo } from 'react';\n\nimport { Config } from './layout';\nimport { EdgeDatumLayout, NodeDatum, NodesMarker } from './types';\n\ntype NodesMap = Record<string, NodeDatum>;\ntype EdgesMap = Record<string, EdgeDatumLayout[]>;\n\n/**\n * Limits the number of nodes by going from the roots breadth first until we have desired number of nodes.\n */\nexport function useNodeLimit(\n nodes: NodeDatum[],\n edges: EdgeDatumLayout[],\n limit: number,\n config: Config,\n rootId?: string\n): { nodes: NodeDatum[]; edges: EdgeDatumLayout[]; markers?: NodesMarker[] } {\n // This is pretty expensive also this happens once in the layout code when initializing position but it's a bit\n // tricky to do it only once and reuse the results because layout directly modifies the nodes.\n const [edgesMap, nodesMap] = useMemo(() => {\n // Make sure we don't compute this until we have all the data.\n if (!(nodes.length && edges.length)) {\n return [{}, {}];\n }\n\n const edgesMap = edges.reduce<EdgesMap>((acc, e) => {\n acc[e.source.id] = [...(acc[e.source.id] ?? []), e];\n acc[e.target.id] = [...(acc[e.target.id] ?? []), e];\n return acc;\n }, {});\n\n const nodesMap = nodes.reduce<NodesMap>((acc, node) => {\n acc[node.id] = node;\n return acc;\n }, {});\n return [edgesMap, nodesMap];\n }, [edges, nodes]);\n\n return useMemo(() => {\n if (nodes.length <= limit) {\n return { nodes, edges };\n }\n\n if (config.gridLayout) {\n return limitGridLayout(nodes, limit, rootId);\n }\n\n return limitGraphLayout(nodes, edges, nodesMap, edgesMap, limit, rootId);\n }, [edges, edgesMap, limit, nodes, nodesMap, rootId, config.gridLayout]);\n}\n\nexport function limitGraphLayout(\n nodes: NodeDatum[],\n edges: EdgeDatumLayout[],\n nodesMap: NodesMap,\n edgesMap: EdgesMap,\n limit: number,\n rootId?: string\n) {\n let roots;\n if (rootId) {\n roots = [nodesMap[rootId]];\n } else {\n roots = nodes.filter((n) => n.incoming === 0);\n // TODO: same code as layout\n if (!roots.length) {\n roots = [nodes[0]];\n }\n }\n\n const { visibleNodes, markers } = collectVisibleNodes(limit, roots, nodesMap, edgesMap);\n\n const markersWithStats = collectMarkerStats(markers, visibleNodes, nodesMap, edgesMap);\n const markersMap = fromPairs(markersWithStats.map((m) => [m.node.id, m]));\n\n for (const marker of markersWithStats) {\n if (marker.count === 1) {\n delete markersMap[marker.node.id];\n visibleNodes[marker.node.id] = marker.node;\n }\n }\n\n // Show all edges between visible nodes or placeholder markers\n const visibleEdges = edges.filter(\n (e) =>\n (visibleNodes[e.source.id] || markersMap[e.source.id]) && (visibleNodes[e.target.id] || markersMap[e.target.id])\n );\n\n return {\n nodes: Object.values(visibleNodes),\n edges: visibleEdges,\n markers: Object.values(markersMap),\n };\n}\n\nexport function limitGridLayout(nodes: NodeDatum[], limit: number, rootId?: string) {\n let start = 0;\n let stop = limit;\n let markers: NodesMarker[] = [];\n\n if (rootId) {\n const index = nodes.findIndex((node) => node.id === rootId);\n const prevLimit = Math.floor(limit / 2);\n let afterLimit = prevLimit;\n start = index - prevLimit;\n if (start < 0) {\n afterLimit += Math.abs(start);\n start = 0;\n }\n stop = index + afterLimit + 1;\n\n if (stop > nodes.length) {\n if (start > 0) {\n start = Math.max(0, start - (stop - nodes.length));\n }\n stop = nodes.length;\n }\n\n if (start > 1) {\n markers.push({ node: nodes[start - 1], count: start });\n }\n\n if (nodes.length - stop > 1) {\n markers.push({ node: nodes[stop], count: nodes.length - stop });\n }\n } else {\n if (nodes.length - limit > 1) {\n markers = [{ node: nodes[limit], count: nodes.length - limit }];\n }\n }\n\n return {\n nodes: nodes.slice(start, stop),\n edges: [],\n markers,\n };\n}\n\n/**\n * Breath first traverse of the graph collecting all the nodes until we reach the limit. It also returns markers which\n * are nodes on the edges which did not make it into the limit but can be used as clickable markers for manually\n * expanding the graph.\n * @param limit\n * @param roots - Nodes where to start the traversal. In case of exploration this can be any node that user clicked on.\n * @param nodesMap - Node id to node\n * @param edgesMap - This is a map of node id to a list of edges (both ingoing and outgoing)\n */\nfunction collectVisibleNodes(\n limit: number,\n roots: NodeDatum[],\n nodesMap: Record<string, NodeDatum>,\n edgesMap: Record<string, EdgeDatumLayout[]>\n): { visibleNodes: Record<string, NodeDatum>; markers: NodeDatum[] } {\n const visibleNodes: Record<string, NodeDatum> = {};\n let stack = [...roots];\n\n while (Object.keys(visibleNodes).length < limit && stack.length > 0) {\n let current = stack.shift()!;\n\n // We are already showing this node. This can happen because graphs can be cyclic\n if (visibleNodes[current!.id]) {\n continue;\n }\n\n // Show this node\n visibleNodes[current.id] = current;\n const edges = edgesMap[current.id] || [];\n\n // Add any nodes that are connected to it on top of the stack to be considered in the next pass\n const connectedNodes = edges.map((e) => {\n // We don't care about direction here. Should not make much difference but argument could be made that with\n // directed graphs it should walk the graph directionally. Problem is when we focus on a node in the middle of\n // graph (not going from the \"natural\" root) we also want to show what was \"before\".\n const id = e.source.id === current.id ? e.target.id : e.source.id;\n return nodesMap[id];\n });\n stack = stack.concat(connectedNodes);\n }\n\n // Right now our stack contains all the nodes which are directly connected to the graph but did not make the cut.\n // Some of them though can be nodes we already are showing so we have to filter them and then use them as markers.\n const markers = uniq(stack.filter((n) => !visibleNodes[n.id]));\n\n return { visibleNodes, markers };\n}\n\nfunction collectMarkerStats(\n markers: NodeDatum[],\n visibleNodes: Record<string, NodeDatum>,\n nodesMap: Record<string, NodeDatum>,\n edgesMap: Record<string, EdgeDatumLayout[]>\n): NodesMarker[] {\n return markers.map((marker) => {\n const nodesToCount: Record<string, NodeDatum> = {};\n let count = 0;\n let stack = [marker];\n while (stack.length > 0 && count <= 101) {\n let current = stack.shift()!;\n\n // We are showing this node so not going to count it as hidden.\n if (visibleNodes[current.id] || nodesToCount[current.id]) {\n continue;\n }\n\n if (!nodesToCount[current.id]) {\n count++;\n }\n nodesToCount[current.id] = current;\n\n const edges = edgesMap[current.id] || [];\n\n const connectedNodes = edges.map((e) => {\n const id = e.source.id === current.id ? e.target.id : e.source.id;\n return nodesMap[id];\n });\n stack = stack.concat(connectedNodes);\n }\n\n return {\n node: marker,\n count: count,\n };\n });\n}\n","import { useEffect, useMemo, useRef, useState } from 'react';\nimport { useUnmount } from 'react-use';\nimport useMountedState from 'react-use/lib/useMountedState';\n\nimport { Field } from '@grafana/data';\nimport { config as grafanaConfig } from '@grafana/runtime';\n\nimport { createWorker, createMsaglWorker } from './createLayoutWorker';\nimport { EdgeDatum, EdgeDatumLayout, NodeDatum } from './types';\nimport { useNodeLimit } from './useNodeLimit';\nimport { graphBounds } from './utils';\n\nexport interface Config {\n linkDistance: number;\n linkStrength: number;\n forceX: number;\n forceXStrength: number;\n forceCollide: number;\n tick: number;\n gridLayout: boolean;\n sort?: {\n // Either a arc field or stats field\n field: Field;\n ascending: boolean;\n };\n}\n\n// Config mainly for the layout but also some other parts like current layout. The layout variables can be changed only\n// if you programmatically enable the config editor (for development only) see ViewControls. These could be moved to\n// panel configuration at some point (apart from gridLayout as that can be switched be user right now.).\nexport const defaultConfig: Config = {\n linkDistance: 150,\n linkStrength: 0.5,\n forceX: 2000,\n forceXStrength: 0.02,\n forceCollide: 100,\n tick: 300,\n gridLayout: false,\n};\n\n/**\n * This will return copy of the nods and edges with x,y positions filled in. Also the layout changes source/target props\n * in edges from string ids to actual nodes.\n */\nexport function useLayout(\n rawNodes: NodeDatum[],\n rawEdges: EdgeDatum[],\n config: Config = defaultConfig,\n nodeCountLimit: number,\n width: number,\n rootNodeId?: string\n) {\n const [nodesGraph, setNodesGraph] = useState<NodeDatum[]>([]);\n const [edgesGraph, setEdgesGraph] = useState<EdgeDatumLayout[]>([]);\n\n const [loading, setLoading] = useState(false);\n\n const isMounted = useMountedState();\n const layoutWorkerCancelRef = useRef<(() => void) | undefined>();\n\n useUnmount(() => {\n if (layoutWorkerCancelRef.current) {\n layoutWorkerCancelRef.current();\n }\n });\n\n // Also we compute both layouts here. Grid layout should not add much time and we can more easily just cache both\n // so this should happen only once for a given response data.\n //\n // Also important note is that right now this works on all the nodes even if they are not visible. This means that\n // the node position is stable even when expanding different parts of graph. It seems like a reasonable thing but\n // implications are that:\n // - limiting visible nodes count does not have a positive perf effect\n // - graphs with high node count can seem weird (very sparse or spread out) when we show only some nodes but layout\n // is done for thousands of nodes but we also do this only once in the graph lifecycle.\n // We could re-layout this on visible nodes change but this may need smaller visible node limit to keep the perf\n // (as we would run layout on every click) and also would be very weird without any animation to understand what is\n // happening as already visible nodes would change positions.\n useEffect(() => {\n if (rawNodes.length === 0) {\n setNodesGraph([]);\n setEdgesGraph([]);\n setLoading(false);\n return;\n }\n\n // Layered layout is better but also more expensive, so we switch to default force based layout for bigger graphs.\n const layoutType =\n grafanaConfig.featureToggles.nodeGraphDotLayout && rawNodes.length <= 500 ? 'layered' : 'default';\n\n setLoading(true);\n // This is async but as I wanted to still run the sync grid layout, and you cannot return promise from effect so\n // having callback seems ok here.\n const cancel = layout(rawNodes, rawEdges, layoutType, ({ nodes, edges }) => {\n if (isMounted()) {\n setNodesGraph(nodes);\n setEdgesGraph(edges as EdgeDatumLayout[]);\n setLoading(false);\n }\n });\n layoutWorkerCancelRef.current = cancel;\n return cancel;\n }, [rawNodes, rawEdges, isMounted]);\n\n // Compute grid separately as it is sync and do not need to be inside effect. Also it is dependant on width while\n // default layout does not care and we don't want to recalculate that on panel resize.\n const [nodesGrid, edgesGrid] = useMemo(() => {\n if (rawNodes.length === 0) {\n return [[], []];\n }\n\n const rawNodesCopy = rawNodes.map((n) => ({ ...n }));\n const rawEdgesCopy = rawEdges.map((e) => ({ ...e }));\n gridLayout(rawNodesCopy, width, config.sort);\n\n return [rawNodesCopy, rawEdgesCopy as EdgeDatumLayout[]];\n }, [config.sort, rawNodes, rawEdges, width]);\n\n // Limit the nodes so we don't show all for performance reasons. Here we don't compute both at the same time so\n // changing the layout can trash internal memoization at the moment.\n const {\n nodes: nodesWithLimit,\n edges: edgesWithLimit,\n markers,\n } = useNodeLimit(\n config.gridLayout ? nodesGrid : nodesGraph,\n config.gridLayout ? edgesGrid : edgesGraph,\n nodeCountLimit,\n config,\n rootNodeId\n );\n\n // Get bounds based on current limited number of nodes.\n const bounds = useMemo(\n () => graphBounds([...nodesWithLimit, ...(markers || []).map((m) => m.node)]),\n [nodesWithLimit, markers]\n );\n\n return {\n nodes: nodesWithLimit,\n edges: edgesWithLimit,\n markers,\n bounds,\n hiddenNodesCount: rawNodes.length - nodesWithLimit.length,\n loading,\n };\n}\n\n/**\n * Wraps the layout code in a worker as it can take long and we don't want to block the main thread.\n * Returns a cancel function to terminate the worker.\n */\nfunction layout(\n nodes: NodeDatum[],\n edges: EdgeDatum[],\n engine: 'default' | 'layered',\n done: (data: { nodes: NodeDatum[]; edges: EdgeDatum[] }) => void\n) {\n const worker = engine === 'default' ? createWorker() : createMsaglWorker();\n\n worker.onmessage = (event: MessageEvent<{ nodes: NodeDatum[]; edges: EdgeDatumLayout[] }>) => {\n for (let i = 0; i < nodes.length; i++) {\n // These stats needs to be Field class but the data is stringified over the worker boundary\n event.data.nodes[i] = {\n ...nodes[i],\n ...event.data.nodes[i],\n };\n }\n done(event.data);\n };\n\n worker.postMessage({\n nodes: nodes.map((n) => ({\n id: n.id,\n incoming: n.incoming,\n })),\n edges,\n config: defaultConfig,\n });\n\n return () => {\n worker.terminate();\n };\n}\n\n/**\n * Set the nodes in simple grid layout sorted by some stat.\n */\nfunction gridLayout(\n nodes: NodeDatum[],\n width: number,\n sort?: {\n field: Field;\n ascending: boolean;\n }\n) {\n const spacingVertical = 140;\n const spacingHorizontal = 120;\n const padding = spacingHorizontal / 2;\n const perRow = Math.min(Math.floor((width - padding * 2) / spacingVertical), nodes.length);\n const midPoint = Math.floor(((perRow - 1) * spacingHorizontal) / 2);\n\n if (sort) {\n nodes.sort((node1, node2) => {\n const val1 = sort!.field.values[node1.dataFrameRowIndex];\n const val2 = sort!.field.values[node2.dataFrameRowIndex];\n\n // Let's pretend we don't care about type of the stats for a while (they can be strings)\n return sort!.ascending ? val1 - val2 : val2 - val1;\n });\n }\n\n for (const [index, node] of nodes.entries()) {\n const row = Math.floor(index / perRow);\n const column = index % perRow;\n node.x = column * spacingHorizontal - midPoint;\n node.y = -60 + row * spacingVertical;\n }\n}\n","import { css } from '@emotion/css';\nimport React, { MouseEvent, useCallback, useState } from 'react';\n\nimport { DataFrame, Field, GrafanaTheme2, LinkModel } from '@grafana/data';\nimport { ContextMenu, MenuGroup, MenuItem, useStyles2 } from '@grafana/ui';\n\nimport { Config } from './layout';\nimport { EdgeDatum, NodeDatum } from './types';\nimport { getEdgeFields, getNodeFields, statToString } from './utils';\n\n/**\n * Hook that contains state of the context menu, both for edges and nodes and provides appropriate component when\n * opened context menu should be opened.\n */\nexport function useContextMenu(\n getLinks: (dataFrame: DataFrame, rowIndex: number) => LinkModel[],\n // This can be undefined if we only use edge dataframe\n nodes: DataFrame | undefined,\n // This can be undefined if we have only single node\n edges: DataFrame | undefined,\n config: Config,\n setConfig: (config: Config) => void,\n setFocusedNodeId: (id: string) => void\n): {\n onEdgeOpen: (event: MouseEvent<SVGElement>, edge: EdgeDatum) => void;\n onNodeOpen: (event: MouseEvent<SVGElement>, node: NodeDatum) => void;\n MenuComponent: React.ReactNode;\n} {\n const [menu, setMenu] = useState<JSX.Element | undefined>(undefined);\n\n const onNodeOpen = useCallback(\n (event: MouseEvent<SVGElement>, node: NodeDatum) => {\n const [label, showGridLayout] = config.gridLayout\n ? ['Show in Graph layout', false]\n : ['Show in Grid layout', true];\n\n const extraNodeItem = [\n {\n label: label,\n onClick: (node: NodeDatum) => {\n setFocusedNodeId(node.id);\n setConfig({ ...config, gridLayout: showGridLayout });\n setMenu(undefined);\n },\n },\n ];\n\n const links = nodes ? getLinks(nodes, node.dataFrameRowIndex) : [];\n const renderer = getItemsRenderer(links, node, extraNodeItem);\n setMenu(makeContextMenu(<NodeHeader node={node} nodes={nodes} />, event, setMenu, renderer));\n },\n [config, nodes, getLinks, setMenu, setConfig, setFocusedNodeId]\n );\n\n const onEdgeOpen = useCallback(\n (event: MouseEvent<SVGElement>, edge: EdgeDatum) => {\n if (!edges) {\n // This could happen if we have only one node and no edges, in which case this is not needed as there is no edge\n // to click on.\n return;\n }\n const links = getLinks(edges, edge.dataFrameRowIndex);\n const renderer = getItemsRenderer(links, edge);\n setMenu(makeContextMenu(<EdgeHeader edge={edge} edges={edges} />, event, setMenu, renderer));\n },\n [edges, getLinks, setMenu]\n );\n\n return { onEdgeOpen, onNodeOpen, MenuComponent: menu };\n}\n\nfunction makeContextMenu(\n header: JSX.Element,\n event: MouseEvent<SVGElement>,\n setMenu: (el: JSX.Element | undefined) => void,\n renderer?: () => React.ReactNode\n) {\n return (\n <ContextMenu\n renderHeader={() => header}\n renderMenuItems={renderer}\n onClose={() => setMenu(undefined)}\n x={event.pageX}\n y={event.pageY}\n />\n );\n}\n\nfunction getItemsRenderer<T extends NodeDatum | EdgeDatum>(\n links: LinkModel[],\n item: T,\n extraItems?: Array<LinkData<T>> | undefined\n) {\n if (!(links.length || extraItems?.length)) {\n return undefined;\n }\n const items = getItems(links);\n return () => {\n let groups = items?.map((group, index) => (\n <MenuGroup key={`${group.label}${index}`} label={group.label}>\n {(group.items || []).map(mapMenuItem(item))}\n </MenuGroup>\n ));\n\n if (extraItems) {\n groups = [...extraItems.map(mapMenuItem(item)), ...groups];\n }\n return groups;\n };\n}\n\nfunction mapMenuItem<T extends NodeDatum | EdgeDatum>(item: T) {\n return function NodeGraphMenuItem(link: LinkData<T>) {\n return (\n <MenuItem\n key={link.label}\n url={link.url}\n label={link.label}\n ariaLabel={link.ariaLabel}\n onClick={\n link.onClick\n ? (event) => {\n if (!(event?.ctrlKey || event?.metaKey || event?.shiftKey)) {\n event?.preventDefault();\n event?.stopPropagation();\n link.onClick?.(item);\n }\n }\n : undefined\n }\n target={'_self'}\n />\n );\n };\n}\n\ntype LinkData<T extends NodeDatum | EdgeDatum> = {\n label: string;\n ariaLabel?: string;\n url?: string;\n onClick?: (item: T) => void;\n};\n\nfunction getItems(links: LinkModel[]) {\n const defaultGroup = 'Open in Explore';\n const groups = links.reduce<{ [group: string]: Array<{ l: LinkModel; newTitle?: string }> }>((acc, l) => {\n let group;\n let title;\n if (l.title.indexOf('/') !== -1) {\n group = l.title.split('/')[0];\n title = l.title.split('/')[1];\n acc[group] = acc[group] || [];\n acc[group].push({ l, newTitle: title });\n } else {\n acc[defaultGroup] = acc[defaultGroup] || [];\n acc[defaultGroup].push({ l });\n }\n\n return acc;\n }, {});\n\n return Object.keys(groups).map((key) => {\n return {\n label: key,\n ariaLabel: key,\n items: groups[key].map((link) => ({\n label: link.newTitle || link.l.title,\n ariaLabel: link.newTitle || link.l.title,\n url: link.l.href,\n onClick: link.l.onClick,\n })),\n };\n });\n}\n\nfunction FieldRow({ field, index }: { field: Field; index: number }) {\n return (\n <HeaderRow\n label={field.config?.displayName || field.name}\n value={statToString(field.config, field.values[index] || '')}\n />\n );\n}\n\nfunction HeaderRow({ label, value }: { label: string; value: string }) {\n const styles = useStyles2(getLabelStyles);\n return (\n <tr>\n <td className={styles.label}>{label}: </td>\n <td className={styles.value}>{value}</td>\n </tr>\n );\n}\n\n/**\n * Shows some field values in a table on top of the context menu.\n */\nfunction NodeHeader({ node, nodes }: { node: NodeDatum; nodes?: DataFrame }) {\n const rows = [];\n if (nodes) {\n const fields = getNodeFields(nodes);\n for (const f of [fields.title, fields.subTitle, fields.mainStat, fields.secondaryStat, ...fields.details]) {\n if (f && f.values[node.dataFrameRowIndex]) {\n rows.push(<FieldRow key={f.name} field={f} index={node.dataFrameRowIndex} />);\n }\n }\n } else {\n // Fallback if we don't have nodes dataFrame. Can happen if we use just the edges frame to construct this.\n if (node.title) {\n rows.push(<HeaderRow key=\"title\" label={'Title'} value={node.title} />);\n }\n if (node.subTitle) {\n rows.push(<HeaderRow key=\"subtitle\" label={'Subtitle'} value={node.subTitle} />);\n }\n }\n\n return (\n <table style={{ width: '100%' }}>\n <tbody>{rows}</tbody>\n </table>\n );\n}\n\n/**\n * Shows some of the field values in a table on top of the context menu.\n */\nfunction EdgeHeader(props: { edge: EdgeDatum; edges: DataFrame }) {\n const index = props.edge.dataFrameRowIndex;\n const fields = getEdgeFields(props.edges);\n const valueSource = fields.source?.values[index] || '';\n const valueTarget = fields.target?.values[index] || '';\n\n const rows = [];\n if (valueSource && valueTarget) {\n rows.push(<HeaderRow key={'header-row'} label={'Source → Target'} value={`${valueSource} → ${valueTarget}`} />);\n }\n\n for (const f of [fields.mainStat, fields.secondaryStat, ...fields.details]) {\n if (f && f.values[index]) {\n rows.push(<FieldRow key={`field-row-${index}`} field={f} index={index} />);\n }\n }\n\n return (\n <table style={{ width: '100%' }}>\n <tbody>{rows}</tbody>\n </table>\n );\n}\n\nexport const getLabelStyles = (theme: GrafanaTheme2) => {\n return {\n label: css`\n label: Label;\n line-height: 1.25;\n color: ${theme.colors.text.disabled};\n font-size: ${theme.typography.size.sm};\n font-weight: ${theme.typography.fontWeightMedium};\n padding-right: ${theme.spacing(1)};\n `,\n value: css`\n label: Value;\n font-size: ${theme.typography.size.sm};\n font-weight: ${theme.typography.fontWeightMedium};\n color: ${theme.colors.text.primary};\n `,\n };\n};\n","import usePrevious from 'react-use/lib/usePrevious';\n\nimport { Config } from './layout';\nimport { NodeDatum } from './types';\n\nexport function useFocusPositionOnLayout(config: Config, nodes: NodeDatum[], focusedNodeId: string | undefined) {\n const prevLayoutGrid = usePrevious(config.gridLayout);\n let focusPosition;\n if (prevLayoutGrid === true && !config.gridLayout && focusedNodeId) {\n const node = nodes.find((n) => n.id === focusedNodeId);\n if (node) {\n focusPosition = {\n x: -node.x!,\n y: -node.y!,\n };\n }\n }\n\n return focusPosition;\n}\n","import { useEffect, useState } from 'react';\nimport useMountedState from 'react-use/lib/useMountedState';\n\nexport function useHighlight(focusedNodeId?: string) {\n const [highlightId, setHighlightId] = useState<string>();\n const mounted = useMountedState();\n useEffect(() => {\n if (focusedNodeId) {\n setHighlightId(focusedNodeId);\n setTimeout(() => {\n if (mounted()) {\n setHighlightId(undefined);\n }\n }, 500);\n }\n }, [focusedNodeId, mounted]);\n\n return highlightId;\n}\n","import { useEffect, useRef, RefObject, useState, useMemo } from 'react';\nimport useMountedState from 'react-use/lib/useMountedState';\nimport usePrevious from 'react-use/lib/usePrevious';\n\nimport { Bounds } from './utils';\n\nexport interface State {\n isPanning: boolean;\n position: {\n x: number;\n y: number;\n };\n}\n\ninterface Options {\n scale?: number;\n bounds?: Bounds;\n focus?: {\n x: number;\n y: number;\n };\n}\n\n/**\n * Based on https://github.com/streamich/react-use/blob/master/src/useSlider.ts\n * Returns position x/y coordinates which can be directly used in transform: translate().\n * @param scale - Can be used when we want to scale the movement if we are moving a scaled element. We need to do it\n * here because we don't want to change the pos when scale changes.\n * @param bounds - If set the panning cannot go outside of those bounds.\n * @param focus - Position to focus on.\n */\nexport function usePanning<T extends Element>({ scale = 1, bounds, focus }: Options = {}): {\n state: State;\n ref: RefObject<T>;\n} {\n const isMounted = useMountedState();\n const isPanning = useRef(false);\n const frame = useRef(0);\n const panRef = useRef<T>(null);\n\n const initial = { x: 0, y: 0 };\n // As we return a diff of the view port to be applied we need as translate coordinates we have to invert the\n // bounds of the content to get the bounds of the view port diff.\n const viewBounds = useMemo(\n () => ({\n right: bounds ? -bounds.left : Infinity,\n left: bounds ? -bounds.right : -Infinity,\n bottom: bounds ? -bounds.top : -Infinity,\n top: bounds ? -bounds.bottom : Infinity,\n }),\n [bounds]\n );\n\n // We need to keep some state so we can compute the position diff and add that to the previous position.\n const startMousePosition = useRef(initial);\n const prevPosition = useRef(initial);\n // We cannot use the state as that would rerun the effect on each state change which we don't want so we have to keep\n // separate variable for the state that won't cause useEffect eval\n const currentPosition = useRef(initial);\n\n const [state, setState] = useState<State>({\n isPanning: false,\n position: initial,\n });\n\n useEffect(() => {\n const startPanning = (event: Event) => {\n if (!isPanning.current && isMounted()) {\n isPanning.current = true;\n // Snapshot the current position of both mouse pointer and the element\n startMousePosition.current = getEventXY(event);\n prevPosition.current = { ...currentPosition.current };\n setState((state) => ({ ...state, isPanning: true }));\n bindEvents();\n }\n };\n\n const stopPanning = () => {\n if (isPanning.current && isMounted()) {\n isPanning.current = false;\n setState((state) => ({ ...state, isPanning: false }));\n unbindEvents();\n }\n };\n\n const onPanStart = (event: Event) => {\n startPanning(event);\n onPan(event);\n };\n\n const bindEvents = () => {\n document.addEventListener('mousemove', onPan);\n document.addEventListener('mouseup', stopPanning);\n document.addEventListener('touchmove', onPan);\n document.addEventListener('touchend', stopPanning);\n };\n\n const unbindEvents = () => {\n document.removeEventListener('mousemove', onPan);\n document.removeEventListener('mouseup', stopPanning);\n document.removeEventListener('touchmove', onPan);\n document.removeEventListener('touchend', stopPanning);\n };\n\n const onPan = (event: Event) => {\n cancelAnimationFrame(frame.current);\n const pos = getEventXY(event);\n\n frame.current = requestAnimationFrame(() => {\n if (isMounted() && panRef.current) {\n // Get the diff by which we moved the mouse.\n let xDiff = pos.x - startMousePosition.current.x;\n let yDiff = pos.y - startMousePosition.current.y;\n\n // Add the diff to the position from the moment we started panning.\n currentPosition.current = {\n x: inBounds(prevPosition.current.x + xDiff / scale, viewBounds.left, viewBounds.right),\n y: inBounds(prevPosition.current.y + yDiff / scale, viewBounds.top, viewBounds.bottom),\n };\n setState((state) => ({\n ...state,\n position: {\n ...currentPosition.current,\n },\n }));\n }\n });\n };\n\n const ref = panRef.current;\n if (ref) {\n ref.addEventListener('mousedown', onPanStart);\n ref.addEventListener('touchstart', onPanStart);\n }\n return () => {\n if (ref) {\n ref.removeEventListener('mousedown', onPanStart);\n ref.removeEventListener('touchstart', onPanStart);\n }\n };\n }, [scale, viewBounds, isMounted]);\n\n const previousFocus = usePrevious(focus);\n\n // We need to update the state in case need to focus on something but we want to do it only once when the focus\n // changes to something new.\n useEffect(() => {\n if (focus && previousFocus?.x !== focus.x && previousFocus?.y !== focus.y) {\n const position = {\n x: inBounds(focus.x, viewBounds.left, viewBounds.right),\n y: inBounds(focus.y, viewBounds.top, viewBounds.bottom),\n };\n setState({\n position,\n isPanning: false,\n });\n\n currentPosition.current = position;\n prevPosition.current = position;\n }\n }, [focus, previousFocus, viewBounds, currentPosition, prevPosition]);\n\n let position = state.position;\n // This part prevents an ugly jump from initial position to the focused one as the set state in the effects is after\n // initial render.\n if (focus && previousFocus?.x !== focus.x && previousFocus?.y !== focus.y) {\n position = focus;\n }\n\n return {\n state: {\n ...state,\n position: {\n x: inBounds(position.x, viewBounds.left, viewBounds.right),\n y: inBounds(position.y, viewBounds.top, viewBounds.bottom),\n },\n },\n ref: panRef,\n };\n}\n\nfunction inBounds(value: number, min: number | undefined, max: number | undefined) {\n return Math.min(Math.max(value, min ?? -Infinity), max ?? Infinity);\n}\n\n// The issue here is that TouchEvent is undefined while using instanceof in Firefox and Safari\n// which will throw an exception but if it's event.changedTouches it will be undefined\n// and the if check will fail so it will go to the else but will not throw an exception\nfunction getEventXY(event: Event): { x: number; y: number } {\n if ('changedTouches' in event && event instanceof TouchEvent) {\n return { x: event.changedTouches[0].clientX, y: event.changedTouches[0].clientY };\n } else if (event instanceof MouseEvent) {\n return { x: event.clientX, y: event.clientY };\n }\n return { x: 0, y: 0 };\n}\n","import { useCallback, useEffect, useRef, useState } from 'react';\n\nconst defaultOptions: Options = {\n stepDown: (s) => s / 1.5,\n stepUp: (s) => s * 1.5,\n min: 0.13,\n max: 2.25,\n};\n\ninterface Options {\n /**\n * Allows you to specify how the step up will be handled so you can do fractional steps based on previous value.\n */\n stepUp: (scale: number) => number;\n stepDown: (scale: number) => number;\n\n /**\n * Set max and min values. If stepUp/down overshoots these bounds this will return min or max but internal scale value\n * will still be what ever the step functions returned last.\n */\n min?: number;\n max?: number;\n}\n\n/**\n * Keeps state and returns handlers that can be used to implement zooming functionality ideally by using it with\n * 'transform: scale'. It returns handler for manual buttons with zoom in/zoom out function and a ref that can be\n * used to zoom in/out with mouse wheel.\n */\nexport function useZoom({ stepUp, stepDown, min, max } = defaultOptions) {\n const ref = useRef<HTMLElement | null>(null);\n const [scale, setScale] = useState(1);\n\n const onStepUp = useCallback(() => {\n if (scale < (max ?? Infinity)) {\n setScale(stepUp(scale));\n }\n }, [scale, stepUp, max]);\n\n const onStepDown = useCallback(() => {\n if (scale > (min ?? -Infinity)) {\n setScale(stepDown(scale));\n }\n }, [scale, stepDown, min]);\n\n const onWheel = useCallback(\n function (wheelEvent: WheelEvent) {\n // Seems like typing for the addEventListener is lacking a bit\n\n // Only do this with special key pressed similar to how google maps work.\n // TODO: I would guess this won't work very well with touch right now\n if (wheelEvent.ctrlKey || wheelEvent.metaKey) {\n wheelEvent.preventDefault();\n\n setScale(Math.min(Math.max(min ?? -Infinity, scale + Math.min(wheelEvent.deltaY, 2) * -0.01), max ?? Infinity));\n\n if (wheelEvent.deltaY < 0) {\n const newScale = scale + Math.max(wheelEvent.deltaY, -4) * -0.015;\n setScale(Math.max(min ?? -Infinity, newScale));\n } else if (wheelEvent.deltaY > 0) {\n const newScale = scale + Math.min(wheelEvent.deltaY, 4) * -0.015;\n setScale(Math.min(max ?? Infinity, newScale));\n }\n }\n },\n [min, max, scale]\n );\n\n useEffect(() => {\n if (!ref.current) {\n return;\n }\n\n const zoomRef = ref.current;\n\n // Adds listener for wheel event, we need the passive: false to be able to prevent default otherwise that\n // cannot be used with passive listeners.\n zoomRef.addEventListener('wheel', onWheel, { passive: false });\n return () => {\n if (zoomRef) {\n zoomRef.removeEventListener('wheel', onWheel);\n }\n };\n }, [onWheel]);\n\n return {\n onStepUp,\n onStepDown,\n scale: Math.max(Math.min(scale, max ?? Infinity), min ?? -Infinity),\n isMax: scale >= (max ?? Infinity),\n isMin: scale <= (min ?? -Infinity),\n ref,\n };\n}\n","import { css } from '@emotion/css';\nimport cx from 'classnames';\nimport React, { memo, MouseEvent, useCallback, useEffect, useMemo, useState } from 'react';\nimport useMeasure from 'react-use/lib/useMeasure';\n\nimport { DataFrame, GrafanaTheme2, LinkModel } from '@grafana/data';\nimport { Icon, Spinner, useStyles2 } from '@grafana/ui';\n\nimport { Edge } from './Edge';\nimport { EdgeLabel } from './EdgeLabel';\nimport { Legend } from './Legend';\nimport { Marker } from './Marker';\nimport { Node } from './Node';\nimport { ViewControls } from './ViewControls';\nimport { Config, defaultConfig, useLayout } from './layout';\nimport { EdgeDatum, NodeDatum, NodesMarker } from './types';\nimport { useCategorizeFrames } from './useCategorizeFrames';\nimport { useContextMenu } from './useContextMenu';\nimport { useFocusPositionOnLayout } from './useFocusPositionOnLayout';\nimport { useHighlight } from './useHighlight';\nimport { usePanning } from './usePanning';\nimport { useZoom } from './useZoom';\nimport { processNodes, Bounds, findConnectedNodesForEdge, findConnectedNodesForNode } from './utils';\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n wrapper: css`\n label: wrapper;\n height: 100%;\n width: 100%;\n overflow: hidden;\n position: relative;\n `,\n\n svg: css`\n label: svg;\n height: 100%;\n width: 100%;\n overflow: visible;\n font-size: 10px;\n cursor: move;\n `,\n\n svgPanning: css`\n label: svgPanning;\n user-select: none;\n `,\n\n noDataMsg: css`\n height: 100%;\n width: 100%;\n display: grid;\n place-items: center;\n font-size: ${theme.typography.h4.fontSize};\n color: ${theme.colors.text.secondary};\n `,\n\n mainGroup: css`\n label: mainGroup;\n will-change: transform;\n `,\n\n viewControls: css`\n label: viewControls;\n position: absolute;\n left: 2px;\n bottom: 3px;\n right: 0;\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n pointer-events: none;\n `,\n legend: css`\n label: legend;\n background: ${theme.colors.background.secondary};\n box-shadow: ${theme.shadows.z1};\n padding-bottom: 5px;\n margin-right: 10px;\n `,\n viewControlsWrapper: css`\n margin-left: auto;\n `,\n alert: css`\n label: alert;\n padding: 5px 8px;\n font-size: 10px;\n text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);\n border-radius: ${theme.shape.radius.default};\n align-items: center;\n position: absolute;\n top: 0;\n right: 0;\n background: ${theme.colors.warning.main};\n color: ${theme.colors.warning.contrastText};\n `,\n loadingWrapper: css`\n label: loadingWrapper;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n `,\n});\n\n// Limits the number of visible nodes, mainly for performance reasons. Nodes above the limit are accessible by expanding\n// parts of the graph. The specific number is arbitrary but should be a number of nodes where panning, zooming and other\n// interactions will be without any lag for most users.\nconst defaultNodeCountLimit = 200;\n\ninterface Props {\n dataFrames: DataFrame[];\n getLinks: (dataFrame: DataFrame, rowIndex: number) => LinkModel[];\n nodeLimit?: number;\n}\nexport function NodeGraph({ getLinks, dataFrames, nodeLimit }: Props) {\n const nodeCountLimit = nodeLimit || defaultNodeCountLimit;\n const { edges: edgesDataFrames, nodes: nodesDataFrames } = useCategorizeFrames(dataFrames);\n\n const [measureRef, { width, height }] = useMeasure();\n const [config, setConfig] = useState<Config>(defaultConfig);\n\n const firstNodesDataFrame = nodesDataFrames[0];\n const firstEdgesDataFrame = edgesDataFrames[0];\n\n // TODO we should be able to allow multiple dataframes for both edges and nodes, could be issue with node ids which in\n // that case should be unique or figure a way to link edges and nodes dataframes together.\n const processed = useMemo(\n () => processNodes(firstNodesDataFrame, firstEdgesDataFrame),\n [firstEdgesDataFrame, firstNodesDataFrame]\n );\n\n // We need hover state here because for nodes we also highlight edges and for edges have labels separate to make\n // sure they are visible on top of everything else\n const { nodeHover, setNodeHover, clearNodeHover, edgeHover, setEdgeHover, clearEdgeHover } = useHover();\n const [hoveringIds, setHoveringIds] = useState<string[]>([]);\n useEffect(() => {\n let linked: string[] = [];\n if (nodeHover) {\n linked = findConnectedNodesForNode(processed.nodes, processed.edges, nodeHover);\n } else if (edgeHover) {\n linked = findConnectedNodesForEdge(processed.nodes, processed.edges, edgeHover);\n }\n setHoveringIds(linked);\n }, [nodeHover, edgeHover, processed]);\n\n // This is used for navigation from grid to graph view. This node will be centered and briefly highlighted.\n const [focusedNodeId, setFocusedNodeId] = useState<string>();\n const setFocused = useCallback((e: MouseEvent, m: NodesMarker) => setFocusedNodeId(m.node.id), [setFocusedNodeId]);\n\n // May seem weird that we do layout first and then limit the nodes shown but the problem is we want to keep the node\n // position stable which means we need the full layout first and then just visually hide the nodes. As hiding/showing\n // nodes should not have effect on layout it should not be recalculated.\n const { nodes, edges, markers, bounds, hiddenNodesCount, loading } = useLayout(\n processed.nodes,\n processed.edges,\n config,\n nodeCountLimit,\n width,\n focusedNodeId\n );\n\n // If we move from grid to graph layout, and we have focused node lets get its position to center there. We want to\n // do it specifically only in that case.\n const focusPosition = useFocusPositionOnLayout(config, nodes, focusedNodeId);\n const { panRef, zoomRef, onStepUp, onStepDown, isPanning, position, scale, isMaxZoom, isMinZoom } = usePanAndZoom(\n bounds,\n focusPosition\n );\n\n const { onEdgeOpen, onNodeOpen, MenuComponent } = useContextMenu(\n getLinks,\n firstNodesDataFrame,\n firstEdgesDataFrame,\n config,\n setConfig,\n setFocusedNodeId\n );\n const styles = useStyles2(getStyles);\n\n // This cannot be inline func, or it will create infinite render cycle.\n const topLevelRef = useCallback(\n (r: HTMLDivElement) => {\n measureRef(r);\n zoomRef.current = r;\n },\n [measureRef, zoomRef]\n );\n\n const highlightId = useHighlight(focusedNodeId);\n\n return (\n <div ref={topLevelRef} className={styles.wrapper}>\n {loading ? (\n <div className={styles.loadingWrapper}>\n Computing layout&nbsp;\n <Spinner />\n </div>\n ) : null}\n\n {dataFrames.length && processed.nodes.length ? (\n <svg\n ref={panRef}\n viewBox={`${-(width / 2)} ${-(height / 2)} ${width} ${height}`}\n className={cx(styles.svg, isPanning && styles.svgPanning)}\n >\n <g\n className={styles.mainGroup}\n style={{ transform: `scale(${scale}) translate(${Math.floor(position.x)}px, ${Math.floor(position.y)}px)` }}\n >\n {!config.gridLayout && (\n <Edges\n edges={edges}\n nodeHoveringId={nodeHover}\n edgeHoveringId={edgeHover}\n onClick={onEdgeOpen}\n onMouseEnter={setEdgeHover}\n onMouseLeave={clearEdgeHover}\n />\n )}\n <Nodes\n nodes={nodes}\n onMouseEnter={setNodeHover}\n onMouseLeave={clearNodeHover}\n onClick={onNodeOpen}\n hoveringIds={hoveringIds || [highlightId]}\n />\n\n <Markers markers={markers || []} onClick={setFocused} />\n {/*We split the labels from edges so that they are shown on top of everything else*/}\n {!config.gridLayout && <EdgeLabels edges={edges} nodeHoveringId={nodeHover} edgeHoveringId={edgeHover} />}\n </g>\n </svg>\n ) : (\n <div className={styles.noDataMsg}>No data</div>\n )}\n\n <div className={styles.viewControls}>\n {nodes.length ? (\n <div className={styles.legend}>\n <Legend\n sortable={config.gridLayout}\n nodes={nodes}\n sort={config.sort}\n onSort={(sort) => {\n setConfig({\n ...config,\n sort: sort,\n });\n }}\n />\n </div>\n ) : null}\n\n <div className={styles.viewControlsWrapper}>\n <ViewControls<Config>\n config={config}\n onConfigChange={(cfg) => {\n if (cfg.gridLayout !== config.gridLayout) {\n setFocusedNodeId(undefined);\n }\n setConfig(cfg);\n }}\n onMinus={onStepDown}\n onPlus={onStepUp}\n scale={scale}\n disableZoomIn={isMaxZoom}\n disableZoomOut={isMinZoom}\n />\n </div>\n </div>\n\n {hiddenNodesCount > 0 && (\n <div className={styles.alert} aria-label={'Nodes hidden warning'}>\n <Icon size=\"sm\" name={'info-circle'} /> {hiddenNodesCount} nodes are hidden for performance reasons.\n </div>\n )}\n\n {MenuComponent}\n </div>\n );\n}\n\n// Active -> emphasized, inactive -> de-emphasized, and default -> normal styling\nexport type HoverState = 'active' | 'inactive' | 'default';\n\n// These components are here as a perf optimisation to prevent going through all nodes and edges on every pan/zoom.\ninterface NodesProps {\n nodes: NodeDatum[];\n onMouseEnter: (id: string) => void;\n onMouseLeave: (id: string) => void;\n onClick: (event: MouseEvent<SVGElement>, node: NodeDatum) => void;\n hoveringIds?: string[];\n}\nconst Nodes = memo(function Nodes(props: NodesProps) {\n return (\n <>\n {props.nodes.map((n) => (\n <Node\n key={n.id}\n node={n}\n onMouseEnter={props.onMouseEnter}\n onMouseLeave={props.onMouseLeave}\n onClick={props.onClick}\n hovering={\n !props.hoveringIds || props.hoveringIds.length === 0\n ? 'default'\n : props.hoveringIds?.includes(n.id)\n ? 'active'\n : 'inactive'\n }\n />\n ))}\n </>\n );\n});\n\ninterface MarkersProps {\n markers: NodesMarker[];\n onClick: (event: MouseEvent<SVGElement>, marker: NodesMarker) => void;\n}\nconst Markers = memo(function Nodes(props: MarkersProps) {\n return (\n <>\n {props.markers.map((m) => (\n <Marker key={'marker-' + m.node.id} marker={m} onClick={props.onClick} />\n ))}\n </>\n );\n});\n\ninterface EdgesProps {\n edges: EdgeDatum[];\n nodeHoveringId?: string;\n edgeHoveringId?: string;\n onClick: (event: MouseEvent<SVGElement>, link: EdgeDatum) => void;\n onMouseEnter: (id: string) => void;\n onMouseLeave: (id: string) => void;\n}\nconst Edges = memo(function Edges(props: EdgesProps) {\n return (\n <>\n {props.edges.map((e) => (\n <Edge\n key={e.id}\n edge={e}\n hovering={\n (e.source as NodeDatum).id === props.nodeHoveringId ||\n (e.target as NodeDatum).id === props.nodeHoveringId ||\n props.edgeHoveringId === e.id\n }\n onClick={props.onClick}\n onMouseEnter={props.onMouseEnter}\n onMouseLeave={props.onMouseLeave}\n />\n ))}\n </>\n );\n});\n\ninterface EdgeLabelsProps {\n edges: EdgeDatum[];\n nodeHoveringId?: string;\n edgeHoveringId?: string;\n}\nconst EdgeLabels = memo(function EdgeLabels(props: EdgeLabelsProps) {\n return (\n <>\n {props.edges.map((e, index) => {\n // We show the edge label in case user hovers over the edge directly or if they hover over node edge is\n // connected to.\n const shouldShow =\n (e.source as NodeDatum).id === props.nodeHoveringId ||\n (e.target as NodeDatum).id === props.nodeHoveringId ||\n props.edgeHoveringId === e.id;\n\n const hasStats = e.mainStat || e.secondaryStat;\n return shouldShow && hasStats && <EdgeLabel key={e.id} edge={e} />;\n })}\n </>\n );\n});\n\nfunction usePanAndZoom(bounds: Bounds, focus?: { x: number; y: number }) {\n const { scale, onStepDown, onStepUp, ref, isMax, isMin } = useZoom();\n const { state: panningState, ref: panRef } = usePanning<SVGSVGElement>({\n scale,\n bounds,\n focus,\n });\n const { position, isPanning } = panningState;\n return { zoomRef: ref, panRef, position, isPanning, scale, onStepDown, onStepUp, isMaxZoom: isMax, isMinZoom: isMin };\n}\n\nfunction useHover() {\n const [nodeHover, setNodeHover] = useState<string | undefined>(undefined);\n const clearNodeHover = useCallback(() => setNodeHover(undefined), [setNodeHover]);\n const [edgeHover, setEdgeHover] = useState<string | undefined>(undefined);\n const clearEdgeHover = useCallback(() => setEdgeHover(undefined), [setEdgeHover]);\n\n return { nodeHover, setNodeHover, clearNodeHover, edgeHover, setEdgeHover, clearEdgeHover };\n}\n","import { useMemo } from 'react';\n\nimport { DataFrame } from '@grafana/data';\n\nimport { getGraphFrame } from './utils';\n\n/**\n * As we need 2 dataframes for the service map, one with nodes and one with edges we have to figure out which is which.\n * Right now we do not have any metadata for it so we just check preferredVisualisationType and then column names.\n * TODO: maybe we could use column labels to have a better way to do this\n */\nexport function useCategorizeFrames(series: DataFrame[]) {\n return useMemo(() => {\n return getGraphFrame(series);\n }, [series]);\n}\n"],"names":["EdgeArrowMarker","id","fill","defaultEdgeColor","headHeight","highlightedEdgeColor","Edge","props","edge","onClick","onMouseEnter","onMouseLeave","hovering","source","target","sourceNodeRadius","targetNodeRadius","arrowHeadHeight","line","markerId","coloredMarkerId","event","getStyles","theme","EdgeLabel","middle","styles","stats","height","middleOffset","offset","contents","stat","index","Legend","nodes","onSort","sort","sortable","colorItems","getColorLegendItems","item","VizLegend","VizLegendListItem","Icon","fields","node","n","f","nodeR","Marker","marker","ViewControls","config","onConfigChange","onPlus","onMinus","disableZoomOut","disableZoomIn","showConfig","setShowConfig","allowConfiguration","Button","k","e","createWorker","createMsaglWorker","useNodeLimit","edges","limit","rootId","edgesMap","nodesMap","acc","limitGridLayout","limitGraphLayout","roots","visibleNodes","markers","collectVisibleNodes","markersWithStats","collectMarkerStats","markersMap","visibleEdges","start","stop","prevLimit","afterLimit","stack","current","connectedNodes","nodesToCount","count","defaultConfig","useLayout","rawNodes","rawEdges","nodeCountLimit","width","rootNodeId","nodesGraph","setNodesGraph","edgesGraph","setEdgesGraph","loading","setLoading","isMounted","useMountedState","layoutWorkerCancelRef","useUnmount","layoutType","cancel","layout","nodesGrid","edgesGrid","rawNodesCopy","rawEdgesCopy","gridLayout","nodesWithLimit","edgesWithLimit","bounds","m","engine","done","worker","i","perRow","midPoint","node1","node2","val1","val2","row","column","useContextMenu","getLinks","setConfig","setFocusedNodeId","menu","setMenu","onNodeOpen","label","showGridLayout","extraNodeItem","links","renderer","getItemsRenderer","makeContextMenu","NodeHeader","EdgeHeader","header","ContextMenu","extraItems","items","getItems","groups","group","MenuGroup","mapMenuItem","link","MenuItem","defaultGroup","l","title","key","FieldRow","field","HeaderRow","value","getLabelStyles","rows","valueSource","valueTarget","useFocusPositionOnLayout","focusedNodeId","prevLayoutGrid","usePrevious","focusPosition","useHighlight","highlightId","setHighlightId","mounted","usePanning","scale","focus","isPanning","frame","panRef","initial","viewBounds","startMousePosition","prevPosition","currentPosition","state","setState","startPanning","getEventXY","bindEvents","stopPanning","unbindEvents","onPanStart","onPan","pos","xDiff","yDiff","inBounds","ref","previousFocus","position","min","max","defaultOptions","s","useZoom","stepUp","stepDown","setScale","onStepUp","onStepDown","onWheel","wheelEvent","newScale","zoomRef","defaultNodeCountLimit","NodeGraph","dataFrames","nodeLimit","edgesDataFrames","nodesDataFrames","useCategorizeFrames","measureRef","useMeasure","firstNodesDataFrame","firstEdgesDataFrame","processed","nodeHover","setNodeHover","clearNodeHover","edgeHover","setEdgeHover","clearEdgeHover","useHover","hoveringIds","setHoveringIds","linked","setFocused","hiddenNodesCount","isMaxZoom","isMinZoom","usePanAndZoom","onEdgeOpen","MenuComponent","topLevelRef","r","Spinner","Edges","Nodes","Markers","EdgeLabels","cfg","Node","shouldShow","hasStats","isMax","isMin","panningState","series"],"sourceRoot":""} Submit