diff --git a/frontend/src/metabase/visualizations/visualizations/PieChart/PieChart.jsx b/frontend/src/metabase/visualizations/visualizations/PieChart/PieChart.jsx index 407ab32eff10826c74716b2c94d31741324ed21e..ce294d962877f1e74559a10073d8a008a47c2d23 100644 --- a/frontend/src/metabase/visualizations/visualizations/PieChart/PieChart.jsx +++ b/frontend/src/metabase/visualizations/visualizations/PieChart/PieChart.jsx @@ -360,6 +360,7 @@ export default class PieChart extends Component { : { key: t`Other`, value: otherTotal, + displayValue: otherTotal, percentage: otherTotal / total, color: color("text-light"), }; @@ -443,8 +444,10 @@ export default class PieChart extends Component { event: event && event.nativeEvent, stackedTooltipModel: getTooltipModel( others.map(o => ({ + ...o, key: formatDimension(o.key, false), value: o.displayValue, + color: undefined, })), null, getFriendlyName(cols[dimensionIndex]), diff --git a/frontend/src/metabase/visualizations/visualizations/PieChart/utils.unit.spec.ts b/frontend/src/metabase/visualizations/visualizations/PieChart/utils.unit.spec.ts index faf002ac2ab377d5e00b8f24f6521bef8627a218..d50fefd09adbd7458b6acc01da3f1fce511e8046 100644 --- a/frontend/src/metabase/visualizations/visualizations/PieChart/utils.unit.spec.ts +++ b/frontend/src/metabase/visualizations/visualizations/PieChart/utils.unit.spec.ts @@ -19,6 +19,33 @@ const slices = [ }, ]; +const slicesWithOther = [ + { + key: "foo", + value: 100, + displayValue: 100, + percentage: 0.28571429, + rowIndex: 0, + color: "green", + }, + { + key: "bar", + value: 200, + displayValue: 200, + percentage: 0.57142857, + rowIndex: 1, + color: "red", + }, + { + key: "Other", + value: 50, + displayValue: 50, + percentage: 0.14285714, + rowIndex: 2, + color: "grey", + }, +]; + const stateSlices = [ { key: "AK", @@ -146,6 +173,20 @@ describe("utils", () => { expect(showPercentages).toBe(true); }); + it("should return a `value` for the `other` slice #42458", () => { + const { bodyRows } = getTooltipModel( + slicesWithOther, + 0, + dimensionColumnName, + dimensionFormatter, + metricFormatter, + ); + + expect(bodyRows?.[bodyRows.length - 1].value).toBe( + slicesWithOther[slicesWithOther.length - 1].displayValue, + ); + }); + it("is not affected by minimum slice percentage setting #32430 #33342", () => { const smallSliceIndex = stateSlices.length - 1; const { headerRows } = getTooltipModel(