fix: Added Extra color code to stop repeat same color (#2015)

This commit is contained in:
Chintan Sudani 2023-01-13 13:50:11 +05:30 committed by GitHub
parent 5ed7c9a46e
commit 83163c17cd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 43 additions and 12 deletions

View File

@ -0,0 +1,38 @@
const themeColors = {
chartcolors: {
dodgerBlue: '#2F80ED',
mediumOrchid: '#BB6BD9',
seaBuckthorn: '#F2994A',
seaGreen: '#219653',
turquoiseBlue: '#56CCF2',
festivalOrange: '#F2C94C',
silver: '#BDBDBD',
outrageousOrange: '#FF6633',
roseBud: '#FFB399',
magentaPink: '#FF33FF',
canary: '#FFFF99',
deepSkyBlue: '#00B3E6',
goldTips: '#E6B333',
royalBlue: '#3366E6',
avocado: '#999966',
mintGreen: '#99FF99',
chestnut: '#B34D4D',
lima: '#80B300',
olive: '#809900',
beautyBush: '#E6B3B3',
danube: '#6680B3',
oliveDrab: '#66991A',
lavenderRose: '#FF99E6',
electricLime: '#CCFF1A',
radicalRed: '#FF1A66',
harleyOrange: '#E6331A',
turquoise: '#33FFCC',
gladeGreen: '#66994D',
hemlock: '#66664D',
vidaLoca: '#4D8000',
rust: '#B33300',
},
errorColor: '#d32f2f',
};
export { themeColors };

View File

@ -112,6 +112,7 @@ export const getTreeLevelsCount = (tree: ITraceTree): number => {
return levels; return levels;
}; };
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export const formUrlParams = (params: Record<string, any>): string => { export const formUrlParams = (params: Record<string, any>): string => {
let urlParams = ''; let urlParams = '';
Object.entries(params).forEach(([key, value], index) => { Object.entries(params).forEach(([key, value], index) => {

View File

@ -1,16 +1,8 @@
import { Span } from 'types/api/trace/getTraceItem'; import { Span } from 'types/api/trace/getTraceItem';
export const colors = [ import { themeColors } from '../constants/theme';
'#2F80ED',
'#BB6BD9',
'#F2994A',
'#219653',
'#56CCF2',
'#F2C94C',
'#BDBDBD',
];
export const errorColor = '#d32f2f'; export const colors = Object.values(themeColors.chartcolors);
export function getRandomNumber(min: number, max: number): number { export function getRandomNumber(min: number, max: number): number {
return Math.random() * (max - min) + min; return Math.random() * (max - min) + min;

View File

@ -1,5 +1,5 @@
/* eslint-disable no-param-reassign */ /* eslint-disable no-param-reassign */
import { errorColor } from 'lib/getRandomColor'; import { themeColors } from 'constants/theme';
import { ITraceForest, ITraceTree } from 'types/api/trace/getTraceItem'; import { ITraceForest, ITraceTree } from 'types/api/trace/getTraceItem';
/** /**
* Traverses the Span Tree data and returns the relevant meta data. * Traverses the Span Tree data and returns the relevant meta data.
@ -27,7 +27,7 @@ export const getSpanTreeMetadata = (
globalEnd = Math.max(globalEnd, endTime); globalEnd = Math.max(globalEnd, endTime);
} }
if (treeNode.hasError) { if (treeNode.hasError) {
treeNode.serviceColour = errorColor; treeNode.serviceColour = themeColors.errorColor;
} else treeNode.serviceColour = spanServiceColours[treeNode.serviceName]; } else treeNode.serviceColour = spanServiceColours[treeNode.serviceName];
treeNode.children.forEach((childNode) => { treeNode.children.forEach((childNode) => {
traverse(childNode, level + 1); traverse(childNode, level + 1);