Skip to content

Commit

Permalink
fix(explore): long metric name display (apache#12387)
Browse files Browse the repository at this point in the history
* fix(explore): long metric name display

* add tooltip to control
  • Loading branch information
zhaoyongjie authored and amitmiran137 committed Jan 14, 2021
1 parent c5ddd5a commit 2e2552d
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 12 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,12 @@ const ResizeIcon = styled.i`
margin-left: ${({ theme }) => theme.gridUnit * 2}px;
`;

const ColumnOptionStyle = styled.span`
.option-label {
display: inline;
}
`;

const SAVED_TAB_KEY = 'SAVED';

const startingWidth = 320;
Expand Down Expand Up @@ -220,7 +226,11 @@ export default class AdhocMetricEditPopover extends React.Component {
if (column.metric_name && !column.verbose_name) {
column.verbose_name = column.metric_name;
}
return <ColumnOption column={column} showType />;
return (
<ColumnOptionStyle>
<ColumnOption column={column} showType />
</ColumnOptionStyle>
);
}

render() {
Expand Down
28 changes: 17 additions & 11 deletions superset-frontend/src/explore/components/AdhocMetricOption.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@
*/
import React from 'react';
import PropTypes from 'prop-types';
import { Tooltip } from 'src/common/components/Tooltip';
import AdhocMetric from '../AdhocMetric';
import columnType from '../propTypes/columnType';
import savedMetricType from '../propTypes/savedMetricType';
Expand Down Expand Up @@ -70,17 +71,22 @@ class AdhocMetricOption extends React.PureComponent {
savedMetric={savedMetric}
datasourceType={datasourceType}
>
<DraggableOptionControlLabel
savedMetric={savedMetric}
label={adhocMetric.label}
onRemove={this.onRemoveMetric}
onMoveLabel={onMoveLabel}
onDropLabel={onDropLabel}
index={index}
type={OPTION_TYPES.metric}
isAdhoc
isFunction
/>
<Tooltip
placement="top"
title={savedMetric.expression || adhocMetric.label}
>
<DraggableOptionControlLabel
savedMetric={savedMetric}
label={adhocMetric.label}
onRemove={this.onRemoveMetric}
onMoveLabel={onMoveLabel}
onDropLabel={onDropLabel}
index={index}
type={OPTION_TYPES.metric}
isAdhoc
isFunction
/>
</Tooltip>
</AdhocMetricPopoverTrigger>
);
}
Expand Down
3 changes: 3 additions & 0 deletions superset-frontend/src/explore/components/OptionControls.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,9 @@ const Label = styled.div`
svg {
margin-right: ${({ theme }) => theme.gridUnit}px;
}
.option-label {
display: inline;
}
`;

const CaretContainer = styled.div`
Expand Down

0 comments on commit 2e2552d

Please sign in to comment.