Skip to content

Commit

Permalink
fix(dashboard): scrolling table viz overlaps next chart
Browse files Browse the repository at this point in the history
  • Loading branch information
diegomedina248 committed Mar 11, 2022
1 parent a37a4ed commit 522356e
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -128,6 +128,8 @@ export default class Chart extends React.Component {
this.resize = this.resize.bind(this);
this.setDescriptionRef = this.setDescriptionRef.bind(this);
this.setHeaderRef = this.setHeaderRef.bind(this);
this.getChartHeight = this.getChartHeight.bind(this);
this.getDescriptionHeight = this.getDescriptionHeight.bind(this);
}

shouldComponentUpdate(nextProps, nextState) {
Expand Down Expand Up @@ -178,21 +180,31 @@ export default class Chart extends React.Component {
return this.props.cacheBusterProp !== nextProps.cacheBusterProp;
}

componentDidMount() {
if (this.props.isExpanded) {
const descriptionHeight = this.getDescriptionHeight();
this.setState({ descriptionHeight });
}
}

componentWillUnmount() {
clearTimeout(this.resizeTimeout);
}

componentDidUpdate(prevProps) {
if (this.props.isExpanded !== prevProps.isExpanded) {
const descriptionHeight =
this.props.isExpanded && this.descriptionRef
? this.descriptionRef.offsetHeight
: 0;
const descriptionHeight = this.getDescriptionHeight();
// eslint-disable-next-line react/no-did-update-set-state
this.setState({ descriptionHeight });
}
}

getDescriptionHeight() {
return this.props.isExpanded && this.descriptionRef
? this.descriptionRef.offsetHeight
: 0;
}

getChartHeight() {
const headerHeight = this.getHeaderHeight();
return this.state.height - headerHeight - this.state.descriptionHeight;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -93,6 +93,14 @@ describe('Chart', () => {
expect(wrapper.find('.slice_description')).toExist();
});

it('should calculate the description height if it has one and isExpanded=true', () => {
const spy = jest.spyOn(Chart.prototype, 'getDescriptionHeight');
const wrapper = setup({ isExpanded: true });

expect(wrapper.find('.slice_description')).toExist();
expect(spy).toHaveBeenCalled();
});

it('should call refreshChart when SliceHeader calls forceRefresh', () => {
const refreshChart = sinon.spy();
const wrapper = setup({ refreshChart });
Expand Down

0 comments on commit 522356e

Please sign in to comment.