You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by di...@apache.org on 2022/12/06 13:55:24 UTC
[superset] branch fix/dropdown-container-click-out created (now 92bb4c5c77)
This is an automated email from the ASF dual-hosted git repository.
diegopucci pushed a change to branch fix/dropdown-container-click-out
in repository https://gitbox.apache.org/repos/asf/superset.git
at 92bb4c5c77 Move popover in dropdowncontainer
This branch includes the following new commits:
new 92bb4c5c77 Move popover in dropdowncontainer
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[superset] 01/01: Move popover in dropdowncontainer
Posted by di...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
diegopucci pushed a commit to branch fix/dropdown-container-click-out
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 92bb4c5c77c14597b3fcfafcfd452925a34fc84a
Author: geido <di...@gmail.com>
AuthorDate: Tue Dec 6 15:55:03 2022 +0200
Move popover in dropdowncontainer
---
superset-frontend/src/components/DropdownContainer/index.tsx | 1 +
.../explore/components/controls/ControlPopover/ControlPopover.tsx | 1 -
.../components/controls/DateFilterControl/DateFilterLabel.tsx | 8 ++++++++
.../src/explore/components/controls/DateFilterControl/types.ts | 1 +
.../src/filters/components/Time/TimeFilterPlugin.tsx | 2 ++
superset-frontend/src/filters/components/Time/transformProps.ts | 1 +
superset-frontend/src/filters/components/Time/types.ts | 1 +
7 files changed, 14 insertions(+), 1 deletion(-)
diff --git a/superset-frontend/src/components/DropdownContainer/index.tsx b/superset-frontend/src/components/DropdownContainer/index.tsx
index ed2295dafa..1155f2980e 100644
--- a/superset-frontend/src/components/DropdownContainer/index.tsx
+++ b/superset-frontend/src/components/DropdownContainer/index.tsx
@@ -256,6 +256,7 @@ const DropdownContainer = forwardRef(
data-test="dropdown-content"
style={dropdownStyle}
ref={targetRef}
+ className="dropdowncontainer"
>
{dropdownContent
? dropdownContent(overflowedItems)
diff --git a/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx b/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx
index 28dd6e2bd2..809117bdb1 100644
--- a/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx
+++ b/superset-frontend/src/explore/components/controls/ControlPopover/ControlPopover.tsx
@@ -56,7 +56,6 @@ const ControlPopover: React.FC<PopoverProps> = ({
const calculatePlacement = useCallback(() => {
const visibilityRatio = getVisibilityRatio(triggerElementRef.current!);
-
if (visibilityRatio < 0.35) {
setPlacement('rightTop');
} else if (visibilityRatio > 0.65) {
diff --git a/superset-frontend/src/explore/components/controls/DateFilterControl/DateFilterLabel.tsx b/superset-frontend/src/explore/components/controls/DateFilterControl/DateFilterLabel.tsx
index ce4c32191d..97a591ab5f 100644
--- a/superset-frontend/src/explore/components/controls/DateFilterControl/DateFilterLabel.tsx
+++ b/superset-frontend/src/explore/components/controls/DateFilterControl/DateFilterLabel.tsx
@@ -156,6 +156,7 @@ export default function DateFilterLabel(props: DateFilterControlProps) {
onOpenPopover = noOp,
onClosePopover = noOp,
overlayStyle = 'Popover',
+ isOverflowingFilterBar = false,
} = props;
const defaultTimeFilter = useDefaultTimeFilter();
@@ -356,6 +357,13 @@ export default function DateFilterLabel(props: DateFilterControlProps) {
visible={show}
onVisibleChange={toggleOverlay}
overlayStyle={{ width: '600px' }}
+ getPopupContainer={() =>
+ isOverflowingFilterBar
+ ? (document.getElementsByClassName(
+ 'dropdowncontainer',
+ )[0] as HTMLElement)
+ : document.body
+ }
>
<Tooltip placement="top" title={tooltipTitle}>
<DateLabel
diff --git a/superset-frontend/src/explore/components/controls/DateFilterControl/types.ts b/superset-frontend/src/explore/components/controls/DateFilterControl/types.ts
index d08a016724..3179d6e39d 100644
--- a/superset-frontend/src/explore/components/controls/DateFilterControl/types.ts
+++ b/superset-frontend/src/explore/components/controls/DateFilterControl/types.ts
@@ -97,4 +97,5 @@ export interface DateFilterControlProps {
onOpenPopover?: () => void;
onClosePopover?: () => void;
overlayStyle?: 'Modal' | 'Popover';
+ isOverflowingFilterBar?: boolean;
}
diff --git a/superset-frontend/src/filters/components/Time/TimeFilterPlugin.tsx b/superset-frontend/src/filters/components/Time/TimeFilterPlugin.tsx
index 07ee6ea828..fd1530311d 100644
--- a/superset-frontend/src/filters/components/Time/TimeFilterPlugin.tsx
+++ b/superset-frontend/src/filters/components/Time/TimeFilterPlugin.tsx
@@ -58,6 +58,7 @@ export default function TimeFilterPlugin(props: PluginFilterTimeProps) {
height,
filterState,
inputRef,
+ isOverflowingFilterBar = false,
} = props;
const handleTimeRangeChange = useCallback(
@@ -97,6 +98,7 @@ export default function TimeFilterPlugin(props: PluginFilterTimeProps) {
onChange={handleTimeRangeChange}
onOpenPopover={() => setFilterActive(true)}
onClosePopover={() => setFilterActive(false)}
+ isOverflowingFilterBar={isOverflowingFilterBar}
/>
</ControlContainer>
</TimeFilterStyles>
diff --git a/superset-frontend/src/filters/components/Time/transformProps.ts b/superset-frontend/src/filters/components/Time/transformProps.ts
index 8610cf0660..b86a362248 100644
--- a/superset-frontend/src/filters/components/Time/transformProps.ts
+++ b/superset-frontend/src/filters/components/Time/transformProps.ts
@@ -60,5 +60,6 @@ export default function transformProps(chartProps: ChartProps) {
width,
inputRef,
filterBarOrientation: displaySettings?.filterBarOrientation,
+ isOverflowingFilterBar: displaySettings?.isOverflowingFilterBar,
};
}
diff --git a/superset-frontend/src/filters/components/Time/types.ts b/superset-frontend/src/filters/components/Time/types.ts
index 4219c7cbb3..39ee425bb0 100644
--- a/superset-frontend/src/filters/components/Time/types.ts
+++ b/superset-frontend/src/filters/components/Time/types.ts
@@ -39,6 +39,7 @@ export type PluginFilterTimeProps = PluginFilterStylesProps & {
formData: PluginFilterSelectQueryFormData;
filterState: FilterState;
inputRef: RefObject<HTMLInputElement>;
+ isOverflowingFilterBar?: boolean;
} & PluginFilterHooks;
export const DEFAULT_FORM_DATA: PluginFilterTimeCustomizeProps = {