You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by be...@apache.org on 2026/04/10 19:42:24 UTC
(superset) branch master updated: fix(dashboard): allow filter list to scroll in filter config modal sidebar (#39203)
This is an automated email from the ASF dual-hosted git repository.
beto pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git
The following commit(s) were added to refs/heads/master by this push:
new 7a243d329ef fix(dashboard): allow filter list to scroll in filter config modal sidebar (#39203)
7a243d329ef is described below
commit 7a243d329ef7457bbb131808a3132c2ea7bf5037
Author: Mike Bridge <mi...@bridgecanada.com>
AuthorDate: Fri Apr 10 13:42:16 2026 -0600
fix(dashboard): allow filter list to scroll in filter config modal sidebar (#39203)
Co-authored-by: Mike Bridge <mi...@ext.preset.io>
---
.../ConfigModalSidebar/ConfigModalSidebar.tsx | 10 ++++++++++
1 file changed, 10 insertions(+)
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/ConfigModalSidebar/ConfigModalSidebar.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/ConfigModalSidebar/ConfigModalSidebar.tsx
index feb6ce87679..03f07951594 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/ConfigModalSidebar/ConfigModalSidebar.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FiltersConfigModal/ConfigModalSidebar/ConfigModalSidebar.tsx
@@ -36,9 +36,14 @@ import { FilterRemoval } from '../types';
import { FILTER_TYPE, CUSTOMIZATION_TYPE } from '../DraggableFilter';
import { isFilterId, isChartCustomizationId, isDivider } from '../utils';
+// max-height constrains the sidebar so its inner Collapse can scroll when
+// there are many filters (sc-101839). The parent height chain through the
+// antd Form is unreliable, so a viewport-relative max-height is used instead
+// of height: 100%.
const StyledSidebarFlex = styled(Flex)`
min-width: 290px;
max-width: 290px;
+ max-height: 70vh;
border-right: 1px solid ${({ theme }) => theme.colorBorderSecondary};
`;
@@ -46,8 +51,13 @@ const StyledHeaderFlex = styled(Flex)`
padding: ${({ theme }) => theme.sizeUnit * 3}px;
`;
+// min-height: 0 lets the flex item shrink below its content size so that
+// overflow: auto produces a scrollbar when the filter list is taller than
+// the sidebar. Without it, flex items default to min-height: auto and
+// refuse to shrink.
const BaseStyledCollapse = styled(Collapse)<{ isDragging: boolean }>`
flex: 1;
+ min-height: 0; /* required for flex item to shrink */
overflow: auto;
.ant-collapse-content-box {
padding: 0;