Don't use column settings when formatting pie chart legend percentages (#10962)

frontend/src/metabase/visualizations/visualizations/PieChart.jsx

@@ -284,20 +284,19 @@ export default class PieChart extends Component {
       slices.map(s => s.percentage),
       { style: "percent", maximumSignificantDigits: 3 },
     );
-    const formatPercent = (percent, jsx = true) =>
+    const formatPercent = percent =>
       formatValue(percent, {
-        ...settings.column(cols[metricIndex]),
-        jsx,
+        column: cols[metricIndex],
+        jsx: true,
         majorWidth: 0,
         number_style: "percent",
-        _numberFormatter: undefined, // remove the passed formatter
         decimals,
       });
 
     const legendTitles = slices.map(slice => [
       slice.key === "Other" ? slice.key : formatDimension(slice.key, true),
       settings["pie.show_legend_perecent"]
-        ? formatPercent(slice.percentage, true)
+        ? formatPercent(slice.percentage)
         : undefined,
     ]);
     const legendColors = slices.map(slice => slice.color);

frontend/test/metabase/visualizations/components/Visualization-pie.unit.spec.js

@@ -41,6 +41,23 @@ describe("pie chart", () => {
     getAllByText("1%");
   });
 
+  it("should not use column formatting in the legend", () => {
+    const cols = [
+      StringColumn({ name: "name" }),
+      NumberColumn({ name: "count" }),
+    ];
+    const column_settings = { '["name","count"]': { scale: 123 } };
+    const series = [
+      {
+        card: { display: "pie", visualization_settings: { column_settings } },
+        data: { rows: [["foo", 1]], cols },
+      },
+    ];
+    const { getAllByText } = render(<Visualization rawSeries={series} />);
+    getAllByText("100%"); // shouldn't multiply legend percent by `scale`
+    getAllByText("123"); // should multiply the count in the center by `scale`
+  });
+
   it("should show a condensed tooltip for squashed slices", () => {
     const rows = [["foo", 0.5], ["bar", 0.49], ["baz", 0.002], ["qux", 0.008]];
     const { container, getAllByText, queryAllByText } = render(