diff --git a/superset-frontend/src/explore/components/controls/AnnotationLayerControl/index.jsx b/superset-frontend/src/explore/components/controls/AnnotationLayerControl/index.jsx index f1381abee1..db3bbca272 100644 --- a/superset-frontend/src/explore/components/controls/AnnotationLayerControl/index.jsx +++ b/superset-frontend/src/explore/components/controls/AnnotationLayerControl/index.jsx @@ -26,7 +26,9 @@ import AsyncEsmComponent from 'src/components/AsyncEsmComponent'; import { getChartKey } from 'src/explore/exploreUtils'; import { runAnnotationQuery } from 'src/components/Chart/chartAction'; import CustomListItem from 'src/explore/components/controls/CustomListItem'; -import ControlPopover from '../ControlPopover/ControlPopover'; +import ControlPopover, { + getSectionContainerElement, +} from '../ControlPopover/ControlPopover'; const AnnotationLayer = AsyncEsmComponent( () => import('./AnnotationLayer'), @@ -114,6 +116,11 @@ class AnnotationLayerControl extends React.PureComponent { removeAnnotationLayer(annotation) { const annotations = this.props.value.filter(anno => anno !== annotation); + // So scrollbar doesnt get stuck on hidden + const element = getSectionContainerElement(); + if (element) { + element.style.setProperty('overflow-y', 'auto', 'important'); + } this.props.onChange(annotations); } diff --git a/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx b/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx index f84194c43c..28dd6e2bd2 100644 --- a/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx +++ b/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx @@ -24,7 +24,7 @@ import Popover, { } from 'src/components/Popover'; const sectionContainerId = 'controlSections'; -const getSectionContainerElement = () => +export const getSectionContainerElement = () => document.getElementById(sectionContainerId)?.lastElementChild as HTMLElement; const getElementYVisibilityRatioOnContainer = (node: HTMLElement) => {