fix(dashboard): Close FiltersBadge popover on window resize (#15305)

This commit is contained in:
Kamil Gabryjelski 2021-06-23 10:14:41 +02:00 committed by GitHub
parent f31d573561
commit 6324490dd3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 13 additions and 1 deletions

View File

@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import React, { useState } from 'react';
import React, { useEffect, useState } from 'react';
import { Global, css } from '@emotion/react';
import { t, useTheme } from '@superset-ui/core';
import {
@ -53,8 +53,18 @@ const DetailsPanelPopover = ({
onHighlightFilterSource,
children,
}: DetailsPanelProps) => {
const [visible, setVisible] = useState(false);
const theme = useTheme();
// we don't need to clean up useEffect, setting { once: true } removes the event listener after handle function is called
useEffect(() => {
if (visible) {
window.addEventListener('resize', () => setVisible(false), {
once: true,
});
}
}, [visible]);
const getDefaultActivePanel = () => {
const result = [];
if (appliedCrossFilterIndicators.length) {
@ -77,6 +87,7 @@ const DetailsPanelPopover = ({
]);
function handlePopoverStatus(isOpen: boolean) {
setVisible(isOpen);
// every time the popover opens, make sure the most relevant panel is active
if (isOpen) {
setActivePanels(getDefaultActivePanel());
@ -256,6 +267,7 @@ const DetailsPanelPopover = ({
<Popover
overlayClassName="filterStatusPopover"
content={content}
visible={visible}
onVisibleChange={handlePopoverStatus}
placement="bottom"
trigger="click"