feat: Dynamic currency (#36416)

superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx

@@ -892,7 +892,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
         columnKey: key,
         accessor: ((datum: D) => datum[key]) as never,
         Cell: ({ value, row }: { value: DataRecordValue; row: Row<D> }) => {
-          const [isHtml, text] = formatColumnValue(column, value);
+          const [isHtml, text] = formatColumnValue(column, value, row.original);
           const html = isHtml && allowRenderHtml ? { __html: text } : undefined;
 
           let backgroundColor;

superset-frontend/plugins/plugin-chart-table/src/transformProps.ts

@@ -29,6 +29,7 @@ import {
   getNumberFormatter,
   getTimeFormatter,
   getTimeFormatterForGranularity,
+  normalizeCurrency,
   NumberFormats,
   QueryMode,
   SMART_DATE_ID,
@@ -200,7 +201,12 @@ const processColumns = memoizeOne(function processColumns(
   props: TableChartProps,
 ) {
   const {
-    datasource: { columnFormats, currencyFormats, verboseMap },
+    datasource: {
+      columnFormats,
+      currencyFormats,
+      verboseMap,
+      currencyCodeColumn,
+    },
     rawFormData: {
       table_timestamp_format: tableTimestampFormat,
       metrics: metrics_,
@@ -210,7 +216,12 @@ const processColumns = memoizeOne(function processColumns(
     queriesData,
   } = props;
   const granularity = extractTimegrain(props.rawFormData);
-  const { data: records, colnames, coltypes } = queriesData[0] || {};
+  const {
+    data: records,
+    colnames,
+    coltypes,
+    detected_currency: detectedCurrency,
+  } = queriesData[0] || {};
   // convert `metrics` and `percentMetrics` to the key names in `data.records`
   const metrics = (metrics_ ?? []).map(getMetricLabel);
   const rawPercentMetrics = (percentMetrics_ ?? []).map(getMetricLabel);
@@ -276,10 +287,25 @@ const processColumns = memoizeOne(function processColumns(
         // percent metrics have a default format
         formatter = getNumberFormatter(numberFormat || PERCENT_3_POINT);
       } else if (isMetric || (isNumber && (numberFormat || currency))) {
-        formatter = currency?.symbol
+        // Resolve AUTO currency when currency column isn't in query results
+        let resolvedCurrency = currency;
+        if (
+          currency?.symbol === 'AUTO' &&
+          detectedCurrency &&
+          (!currencyCodeColumn || !colnames?.includes(currencyCodeColumn))
+        ) {
+          const normalizedCurrency = normalizeCurrency(detectedCurrency);
+          if (normalizedCurrency) {
+            resolvedCurrency = {
+              ...currency,
+              symbol: normalizedCurrency,
+            };
+          }
+        }
+        formatter = resolvedCurrency?.symbol
           ? new CurrencyFormatter({
               d3Format: numberFormat,
-              currency,
+              currency: resolvedCurrency,
             })
           : getNumberFormatter(numberFormat);
       }
@@ -292,6 +318,7 @@ const processColumns = memoizeOne(function processColumns(
         isPercentMetric,
         formatter,
         config,
+        currencyCodeColumn,
       };
     });
   return [metrics, percentMetrics, columns] as [

superset-frontend/plugins/plugin-chart-table/src/types.ts

@@ -72,6 +72,7 @@ export interface DataColumnMeta {
   isNumeric?: boolean;
   config?: TableColumnConfig;
   isChildColumn?: boolean;
+  currencyCodeColumn?: string;
 }
 
 export interface TableChartData {

superset-frontend/plugins/plugin-chart-table/src/utils/formatValue.ts

@@ -33,6 +33,8 @@ import DateWithFormatter from './DateWithFormatter';
 function formatValue(
   formatter: DataColumnMeta['formatter'],
   value: DataRecordValue,
+  rowData?: Record<string, DataRecordValue>,
+  currencyColumn?: string,
 ): [boolean, string] {
   // render undefined as empty string
   if (value === undefined) {
@@ -48,6 +50,10 @@ function formatValue(
     return [false, 'N/A'];
   }
   if (formatter) {
+    // If formatter is a CurrencyFormatter, pass row context for AUTO mode
+    if (formatter instanceof CurrencyFormatter) {
+      return [false, formatter(value as number, rowData, currencyColumn)];
+    }
     return [false, formatter(value as number)];
   }
   if (typeof value === 'string') {
@@ -59,8 +65,9 @@ function formatValue(
 export function formatColumnValue(
   column: DataColumnMeta,
   value: DataRecordValue,
+  rowData?: Record<string, DataRecordValue>,
 ) {
-  const { dataType, formatter, config = {} } = column;
+  const { dataType, formatter, config = {}, currencyCodeColumn } = column;
   const isNumber = dataType === GenericDataType.Numeric;
   const smallNumberFormatter =
     config.d3SmallNumberFormat === undefined
@@ -76,5 +83,7 @@ export function formatColumnValue(
       ? smallNumberFormatter
       : formatter,
     value,
+    rowData,
+    currencyCodeColumn,
   );
 }

superset-frontend/plugins/plugin-chart-table/src/utils/isEqualColumns.ts

@@ -28,6 +28,7 @@ export default function isEqualColumns(
   return (
     a.datasource.columnFormats === b.datasource.columnFormats &&
     a.datasource.currencyFormats === b.datasource.currencyFormats &&
+    a.datasource.currencyCodeColumn === b.datasource.currencyCodeColumn &&
     a.datasource.verboseMap === b.datasource.verboseMap &&
     a.formData.tableTimestampFormat === b.formData.tableTimestampFormat &&
     a.formData.timeGrainSqla === b.formData.timeGrainSqla &&
@@ -36,6 +37,8 @@ export default function isEqualColumns(
     isEqualArray(a.formData.metrics, b.formData.metrics) &&
     isEqualArray(a.queriesData?.[0]?.colnames, b.queriesData?.[0]?.colnames) &&
     isEqualArray(a.queriesData?.[0]?.coltypes, b.queriesData?.[0]?.coltypes) &&
+    a.queriesData?.[0]?.detected_currency ===
+      b.queriesData?.[0]?.detected_currency &&
     JSON.stringify(a.formData.extraFilters || null) ===
       JSON.stringify(b.formData.extraFilters || null) &&
     JSON.stringify(a.formData.extraFormData || null) ===