import { uniqBy, uniq, maxBy, cloneDeep, find } from "lodash"; import { serviceMapStore } from "Src/store/actions"; import { graphDataType } from "./ServiceMap"; export const getDimensions = (num, highest) => { const MAX_WIDTH = 8; const MIN_WIDTH = 5; const MAX_FONT_SIZE = 8; const MIN_FONT_SIZE = 5; const percentage = (num / highest) * 100; const width = (percentage * (MAX_WIDTH - MIN_WIDTH)) / 100 + MIN_WIDTH; const fontSize = (percentage * (MAX_FONT_SIZE - MIN_FONT_SIZE)) / 100 + MIN_FONT_SIZE; return { fontSize, width, }; }; export const getGraphData = (serviceMap: serviceMapStore): graphDataType => { const { items, services } = serviceMap; const highestCallCount = maxBy(items, (e) => e.callCount).callCount; const highestCallRate = maxBy(services, (e) => e.callRate).callRate; const divNum = Number( String(1).padEnd(highestCallCount.toString().length, "0"), ); const links = cloneDeep(items).map((node) => { const { parent, child, callCount } = node; return { source: parent, target: child, value: (100 - callCount / divNum) * 0.01, }; }); const uniqParent = uniqBy(cloneDeep(items), "parent").map((e) => e.parent); const uniqChild = uniqBy(cloneDeep(items), "child").map((e) => e.child); const uniqNodes = uniq([...uniqParent, ...uniqChild]); const nodes = uniqNodes.map((node, i) => { const service = find(services, (service) => service.serviceName === node); let color = "#84ff00"; if (service.errorRate > 0) { color = "#f00a0a"; } else if (service.fourXXRate > 0) { color = "#ebeb15"; } const { fontSize, width } = getDimensions(service.callRate, highestCallRate); return { id: node, group: i + 1, fontSize, width, color, nodeVal: width }; }); return { nodes, links, }; };