diff --git a/frontend/src/metabase/visualizations/components/TableInteractive.jsx b/frontend/src/metabase/visualizations/components/TableInteractive.jsx index 3723a5cfe5db2e29b34b329d8f2a626e07fff4bb..6673456bda48e520526ff93d84a45b866f36712e 100644 --- a/frontend/src/metabase/visualizations/components/TableInteractive.jsx +++ b/frontend/src/metabase/visualizations/components/TableInteractive.jsx @@ -8,9 +8,7 @@ import "./TableInteractive.css"; import Icon from "metabase/components/Icon.jsx"; -import Value from "metabase/components/Value.jsx"; - -import { capitalize } from "metabase/lib/formatting"; +import { formatValue, capitalize } from "metabase/lib/formatting"; import { getFriendlyName } from "metabase/visualizations/lib/utils"; import { getTableCellClickedObject, isColumnRightAligned } from "metabase/visualizations/lib/table"; @@ -236,13 +234,12 @@ export default class TableInteractive extends Component<*, Props, State> { })} > <div className="cellData"> - <Value - className="link" - type="cell" - value={value} - column={column} - onResize={this.onCellResize.bind(this, columnIndex)} - /> + {/* using formatValue instead of <Value> here for performance. The later wraps in an extra <span> */} + {formatValue(value, { + column: column, + type: "cell", + jsx: true + })} </div> </div> );