feat(explore-suspect-attrs): Iterating on series data, sorting or dat…

[Abdkhan14]

…a and tooltip

cohortsToSeriesData takes the cohorts and assigns a value of '0' to the chart series data if a label is not present in a cohort. Example: cohort1: {'prod': 1, 'local': 2} and cohort2: {'local': 3} -----> series_cohort_1: [{label: 'prod', value: '1'},{label: 'local', value: '2'}] and series_cohort_2: [{label: 'prod', value: '0'},{label: 'local', value: '3'}]

Note: Removed confining of tooltip, it will be cut off at the boundaries. Will set appendToBody:true (which pushes the tooltip up to document.body) along with the virtualization PR, otherwise the screen freezes trying to do it for too many charts.

[cursor]

Bug: Chart Tooltips Show NaN or Infinity Percentages

The chart tooltips display incorrect percentages ("NaN%" or "Infinity%") due to two issues:

1. In valueFormatter, seriesTotals are incorrectly accessed using the category label instead of the seriesName.
2. Both valueFormatter and formatAxisLabel perform division by zero when cohort totals are zero.

static/app/views/explore/components/suspectTags/charts.tsx#L125-L134

sentry/static/app/views/explore/components/suspectTags/charts.tsx

Lines 125 to 134 in 76c09c0

	const valueFormatter = useCallback(
	(_value: number, label?: string, seriesParams?: CallbackDataParams) => {
	const data = Number(seriesParams?.data);
	const total = seriesTotals[label as keyof typeof seriesTotals];
	const percentage = (data / total) * 100;
	return `${percentage.toFixed(1)}%`;
	},
	[seriesTotals]
	);

static/app/views/explore/components/suspectTags/charts.tsx#L159-L165

sentry/static/app/views/explore/components/suspectTags/charts.tsx

Lines 159 to 165 in 76c09c0

	const selectedData = Number(selectedParam?.data);
	const selectedPercentage = (selectedData / selectedTotal) * 100;
	const baselineTotal =
	seriesTotals[baselineParam?.seriesName as keyof typeof seriesTotals];
	const baselineData = Number(baselineParam?.data);
	const baselinePercentage = (baselineData / baselineTotal) * 100;

Fix in Cursor • Fix in Web

---

Bug: Chart Tooltip Percentage Calculation Error

The formatAxisLabel function in charts.tsx incorrectly calculates and displays percentages in tooltips. It assumes a fixed order for selected and baseline series parameters instead of identifying them by seriesName, leading to misattributed data. Additionally, it performs division by zero when cohort totals are zero, resulting in NaN% or Infinity%. The function also includes overly strict error handling that throws an error if expected series parameters are undefined, potentially crashing the application.

static/app/views/explore/components/suspectTags/charts.tsx#L149-L166

sentry/static/app/views/explore/components/suspectTags/charts.tsx

Lines 149 to 166 in 76c09c0

	const selectedParam = seriesParamsOrParam[0];
	const baselineParam = seriesParamsOrParam[1];
	if (!selectedParam || !baselineParam) {
	throw new Error('selectedParam or baselineParam is not defined');
	}
	const selectedTotal =
	seriesTotals[selectedParam?.seriesName as keyof typeof seriesTotals];
	const selectedData = Number(selectedParam?.data);
	const selectedPercentage = (selectedData / selectedTotal) * 100;
	const baselineTotal =
	seriesTotals[baselineParam?.seriesName as keyof typeof seriesTotals];
	const baselineData = Number(baselineParam?.data);
	const baselinePercentage = (baselineData / baselineTotal) * 100;

Fix in Cursor • Fix in Web

---

Was this report helpful? Give feedback by reacting with 👍 or 👎