diff --git a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts index 4a48cdc8df38b..a4eb2e5e18a94 100644 --- a/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts +++ b/superset-frontend/plugins/plugin-chart-table/src/transformProps.ts @@ -159,7 +159,7 @@ const processColumns = memoizeOne(function processColumns( } else if (isPercentMetric) { // percent metrics have a default format formatter = getNumberFormatter(numberFormat || PERCENT_3_POINT); - } else if (isMetric || (isNumber && numberFormat)) { + } else if (isMetric || (isNumber && (numberFormat || currency))) { formatter = currency ? new CurrencyFormatter({ d3Format: numberFormat, diff --git a/superset-frontend/plugins/plugin-chart-table/src/utils/isEqualColumns.ts b/superset-frontend/plugins/plugin-chart-table/src/utils/isEqualColumns.ts index fc060e6138523..28731c73c271d 100644 --- a/superset-frontend/plugins/plugin-chart-table/src/utils/isEqualColumns.ts +++ b/superset-frontend/plugins/plugin-chart-table/src/utils/isEqualColumns.ts @@ -39,6 +39,8 @@ export default function isEqualColumns( JSON.stringify(a.formData.extraFilters || null) === JSON.stringify(b.formData.extraFilters || null) && JSON.stringify(a.formData.extraFormData || null) === - JSON.stringify(b.formData.extraFormData || null) + JSON.stringify(b.formData.extraFormData || null) && + JSON.stringify(a.rawFormData.column_config || null) === + JSON.stringify(b.rawFormData.column_config || null) ); } diff --git a/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx b/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx index bd859b467c81c..9bc3d90a09dd9 100644 --- a/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx +++ b/superset-frontend/plugins/plugin-chart-table/test/TableChart.test.tsx @@ -123,6 +123,47 @@ describe('plugin-chart-table', () => { expect(cells[4]).toHaveTextContent('$ 2.47k'); }); + it('render raw data', () => { + const props = transformProps({ + ...testData.raw, + rawFormData: { ...testData.raw.rawFormData }, + }); + render( + ProviderWrapper({ + children: , + }), + ); + const cells = document.querySelectorAll('td'); + expect(document.querySelectorAll('th')[0]).toHaveTextContent('num'); + expect(cells[0]).toHaveTextContent('1234'); + expect(cells[1]).toHaveTextContent('10000'); + expect(cells[1]).toHaveTextContent('0'); + }); + + it('render raw data with currencies', () => { + const props = transformProps({ + ...testData.raw, + rawFormData: { + ...testData.raw.rawFormData, + column_config: { + num: { + currencyFormat: { symbol: 'USD', symbolPosition: 'prefix' }, + }, + }, + }, + }); + render( + ProviderWrapper({ + children: , + }), + ); + const cells = document.querySelectorAll('td'); + expect(document.querySelectorAll('th')[0]).toHaveTextContent('num'); + expect(cells[0]).toHaveTextContent('$ 1.23k'); + expect(cells[1]).toHaveTextContent('$ 10k'); + expect(cells[2]).toHaveTextContent('$ 0'); + }); + it('render empty data', () => { wrap.setProps({ ...transformProps(testData.empty), sticky: false }); tree = wrap.render(); diff --git a/superset-frontend/plugins/plugin-chart-table/test/testData.ts b/superset-frontend/plugins/plugin-chart-table/test/testData.ts index 3f464181b7dc9..1f255703f57c1 100644 --- a/superset-frontend/plugins/plugin-chart-table/test/testData.ts +++ b/superset-frontend/plugins/plugin-chart-table/test/testData.ts @@ -21,6 +21,7 @@ import { ChartProps, DatasourceType, GenericDataType, + QueryMode, supersetTheme, } from '@superset-ui/core'; import { TableChartProps, TableChartFormData } from '../src/types'; @@ -173,6 +174,33 @@ const advanced: TableChartProps = { ], }; +const raw = { + ...advanced, + rawFormData: { + ...advanced.rawFormData, + query_mode: QueryMode.raw, + columns: ['num'], + }, + queriesData: [ + { + ...basicQueryResult, + colnames: ['num'], + coltypes: [GenericDataType.NUMERIC], + data: [ + { + num: 1234, + }, + { + num: 10000, + }, + { + num: 0, + }, + ], + }, + ], +}; + const advancedWithCurrency = { ...advanced, datasource: { @@ -198,4 +226,5 @@ export default { advanced, advancedWithCurrency, empty, + raw, };