chore: Rename Totals to Summary in table chart (#29360)

apache · Jun 26, 2024 · fc97a81 · fc97a81
1 parent df8b61b
commit fc97a81
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 5 deletions.
diff --git a/superset-frontend/plugins/plugin-chart-handlebars/src/plugin/controls/metrics.tsx b/superset-frontend/plugins/plugin-chart-handlebars/src/plugin/controls/metrics.tsx
@@ -102,7 +102,7 @@ export const showTotalsControlSetItem: ControlSetItem = {
   name: 'show_totals',
   config: {
     type: 'CheckboxControl',
-    label: t('Show totals'),
+    label: t('Show summary'),
     default: false,
     description: t(
       'Show total aggregations of selected metrics. Note that row limit does not apply to the result.',

diff --git a/superset-frontend/plugins/plugin-chart-table/package.json b/superset-frontend/plugins/plugin-chart-table/package.json
@@ -37,6 +37,7 @@
     "xss": "^1.0.14"
   },
   "peerDependencies": {
+    "@ant-design/icons": "^5.0.1",
     "@superset-ui/chart-controls": "*",
     "@superset-ui/core": "*",
     "@testing-library/dom": "^7.29.4",

diff --git a/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx b/superset-frontend/plugins/plugin-chart-table/src/TableChart.tsx
@@ -48,8 +48,11 @@ import {
   css,
   t,
   tn,
+  useTheme,
 } from '@superset-ui/core';
-
+import { isNumber } from 'lodash';
+import { InfoCircleOutlined } from '@ant-design/icons';
+import { Tooltip } from '@superset-ui/chart-controls';
 import { DataColumnMeta, TableChartTransformedProps } from './types';
 import DataTable, {
   DataTableProps,
@@ -250,6 +253,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
   });
   // keep track of whether column order changed, so that column widths can too
   const [columnOrderToggle, setColumnOrderToggle] = useState(false);
+  const theme = useTheme();
 
   // only take relevant page size options
   const pageSizeOptions = useMemo(() => {
@@ -572,7 +576,7 @@ export default function TableChart<D extends DataRecord = DataRecord>(
                   /* The following classes are added to support custom CSS styling */
                   className={cx(
                     'cell-bar',
-                    value && value < 0 ? 'negative' : 'positive',
+                    isNumber(value) && value < 0 ? 'negative' : 'positive',
                   )}
                   css={cellBarStyles}
                 />
@@ -639,7 +643,27 @@ export default function TableChart<D extends DataRecord = DataRecord>(
         ),
         Footer: totals ? (
           i === 0 ? (
-            <th>{t('Totals')}</th>
+            <th>
+              <div
+                css={css`
+                  display: flex;
+                  align-items: center;
+                  & svg {
+                    margin-left: ${theme.gridUnit}px;
+                    color: ${theme.colors.grayscale.dark1} !important;
+                  }
+                `}
+              >
+                {t('Summary')}
+                <Tooltip
+                  overlay={t(
+                    'Show total aggregations of selected metrics. Note that row limit does not apply to the result.',
+                  )}
+                >
+                  <InfoCircleOutlined />
+                </Tooltip>
+              </div>
+            </th>
           ) : (
             <td style={sharedStyle}>
               <strong>{formatColumnValue(column, totals[key])[1]}</strong>

diff --git a/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx b/superset-frontend/plugins/plugin-chart-table/src/controlPanel.tsx
@@ -339,7 +339,7 @@ const config: ControlPanelConfig = {
             name: 'show_totals',
             config: {
               type: 'CheckboxControl',
-              label: t('Show totals'),
+              label: t('Show summary'),
               default: false,
               description: t(
                 'Show total aggregations of selected metrics. Note that row limit does not apply to the result.',