diff --git a/packages/libs/coreui/src/components/Mesa/Ui/DataCell.jsx b/packages/libs/coreui/src/components/Mesa/Ui/DataCell.jsx index 468227edc0..f8136527aa 100644 --- a/packages/libs/coreui/src/components/Mesa/Ui/DataCell.jsx +++ b/packages/libs/coreui/src/components/Mesa/Ui/DataCell.jsx @@ -4,6 +4,8 @@ import PropTypes from 'prop-types'; import Templates from '../Templates'; import { makeClassifier } from '../Utils/Utils'; +import { Tooltip } from '../../../components/info/Tooltip'; + const dataCellClass = makeClassifier('DataCell'); class DataCell extends React.PureComponent { @@ -64,7 +66,29 @@ class DataCell extends React.PureComponent { width = width ? { width, maxWidth: width, minWidth: width } : {}; style = Object.assign({}, style, width, whiteSpace); className = dataCellClass() + (className ? ' ' + className : ''); - const children = this.renderContent(); + + const content = this.renderContent(); + const columnName = column.name ?? column.key; + + // Ideally the tooltip would also be conditional on there + // being actual content, but this is not trivial without + // copy-pasting the getValue logic from this.renderContent(). + // Verdict: not worth it + const children = options.inlineUseTooltips ? ( + + {columnName && {columnName}:} + {content} + + } + > + {content} + + ) : ( + content + ); + const props = { style, children, diff --git a/packages/libs/coreui/src/components/Mesa/Ui/DataRow.jsx b/packages/libs/coreui/src/components/Mesa/Ui/DataRow.jsx index 09b3886d80..6382798461 100644 --- a/packages/libs/coreui/src/components/Mesa/Ui/DataRow.jsx +++ b/packages/libs/coreui/src/components/Mesa/Ui/DataRow.jsx @@ -44,7 +44,6 @@ class DataRow extends React.PureComponent { const { row, rowIndex, options } = this.props; const { inline, onRowClick, inlineUseTooltips } = options; if (!inline && !onRowClick) return; - console.log({ options }); if (inline && !inlineUseTooltips) this.setState({ expanded: !this.state.expanded }); if (typeof onRowClick === 'function') onRowClick(row, rowIndex); diff --git a/packages/libs/coreui/src/components/Mesa/types.ts b/packages/libs/coreui/src/components/Mesa/types.ts index d8290c7870..b7bb7fc266 100644 --- a/packages/libs/coreui/src/components/Mesa/types.ts +++ b/packages/libs/coreui/src/components/Mesa/types.ts @@ -36,7 +36,7 @@ export interface MesaStateProps< inline?: boolean; inlineMaxWidth?: string; inlineMaxHeight?: string; - inlineUseTooltips?: boolean; // on clicking on a row, don't expand the row height-wise to show the full contents, use a tooltip instead + inlineUseTooltips?: boolean; // don't use onClick to show the full contents, use an onMouseOver tooltip instead className?: string; errOnOverflow?: boolean; editableColumns?: boolean;