You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@superset.apache.org by mi...@apache.org on 2026/04/13 19:05:40 UTC
(superset) 35/45: fix(dashboard): Vertical filter bar gradient is extending past the filter bar area (#39204)
This is an automated email from the ASF dual-hosted git repository.
michaelsmolina pushed a commit to branch 6.1
in repository https://gitbox.apache.org/repos/asf/superset.git
commit 3fdbbb6e7e6bf0eddeff50352bb05f8a4e8958dc
Author: Mike Bridge <mi...@bridgecanada.com>
AuthorDate: Thu Apr 9 19:30:47 2026 -0600
fix(dashboard): Vertical filter bar gradient is extending past the filter bar area (#39204)
Co-authored-by: Mike Bridge <mi...@ext.preset.io>
(cherry picked from commit 8bcc90c766436e263d36d3134af57ccbdcb7f224)
---
.../FilterBar/ActionButtons/ActionButtons.test.tsx | 28 ----------------------
.../FilterBar/ActionButtons/index.tsx | 11 +++------
.../components/nativeFilters/FilterBar/index.tsx | 2 --
3 files changed, 3 insertions(+), 38 deletions(-)
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/ActionButtons.test.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/ActionButtons.test.tsx
index c6ce03e0398..2e4a0ad1dda 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/ActionButtons.test.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/ActionButtons.test.tsx
@@ -16,7 +16,6 @@
* specific language governing permissions and limitations
* under the License.
*/
-import { OPEN_FILTER_BAR_WIDTH } from 'src/dashboard/constants';
import { render, screen, userEvent } from 'spec/helpers/testing-library';
import ActionButtons from './index';
@@ -76,30 +75,3 @@ test('should apply', () => {
userEvent.click(applyBtn);
expect(mockedProps.onApply).toHaveBeenCalled();
});
-
-// eslint-disable-next-line no-restricted-globals -- TODO: Migrate from describe blocks
-describe('custom width', () => {
- test('sets its default width with OPEN_FILTER_BAR_WIDTH', () => {
- const mockedProps = createProps();
- render(<ActionButtons {...mockedProps} />, { useRedux: true });
- const container = screen.getByTestId('filterbar-action-buttons');
- expect(container).toHaveStyle({
- width: `${OPEN_FILTER_BAR_WIDTH - 1}px`,
- });
- });
-
- test('sets custom width', () => {
- const mockedProps = createProps();
- const expectedWidth = 423;
- const { getByTestId } = render(
- <ActionButtons {...mockedProps} width={expectedWidth} />,
- {
- useRedux: true,
- },
- );
- const container = getByTestId('filterbar-action-buttons');
- expect(container).toHaveStyle({
- width: `${expectedWidth - 1}px`,
- });
- });
-});
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/index.tsx
index 7c685842946..7b0c671000b 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/index.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/index.tsx
@@ -27,13 +27,11 @@ import {
} from '@superset-ui/core';
import { css, SupersetTheme, styled } from '@apache-superset/core/theme';
import { Button, Tooltip, Icons, Flex } from '@superset-ui/core/components';
-import { OPEN_FILTER_BAR_WIDTH } from 'src/dashboard/constants';
import tinycolor from 'tinycolor2';
import { FilterBarOrientation } from 'src/dashboard/types';
import { getFilterBarTestId } from '../utils';
interface ActionButtonsProps {
- width?: number;
onApply: () => void;
onClearAll: () => void;
dataMaskSelected: DataMaskState;
@@ -44,17 +42,16 @@ interface ActionButtonsProps {
hasOutOfScopeRequiredFilters?: boolean;
}
-const ButtonsContainer = styled.div<{ isVertical: boolean; width: number }>`
- ${({ theme, isVertical, width }) => css`
+const ButtonsContainer = styled.div<{ isVertical: boolean }>`
+ ${({ theme, isVertical }) => css`
display: flex;
${isVertical
? css`
flex-direction: column;
align-items: center;
- position: fixed;
+ position: sticky;
z-index: 100;
- width: ${width - 1}px;
bottom: 0;
padding: ${theme.sizeUnit * 4}px;
padding-top: ${theme.sizeUnit * 6}px;
@@ -100,7 +97,6 @@ const clearAllButtonStyle = (theme: SupersetTheme, isVertical: boolean) => css`
`;
const ActionButtons = ({
- width = OPEN_FILTER_BAR_WIDTH,
onApply,
onClearAll,
dataMaskApplied,
@@ -143,7 +139,6 @@ const ActionButtons = ({
return (
<ButtonsContainer
isVertical={isVertical}
- width={width}
data-test="filterbar-action-buttons"
>
<Button
diff --git a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
index 25377ee36a2..702f4678add 100644
--- a/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
+++ b/superset-frontend/src/dashboard/components/nativeFilters/FilterBar/index.tsx
@@ -600,7 +600,6 @@ const FilterBar: FC<FiltersBarProps> = ({
() => (
<ActionButtons
filterBarOrientation={orientation}
- width={verticalConfig?.width}
onApply={handleApply}
onClearAll={handleClearAll}
dataMaskSelected={dataMaskSelected}
@@ -612,7 +611,6 @@ const FilterBar: FC<FiltersBarProps> = ({
),
[
orientation,
- verticalConfig?.width,
handleApply,
handleClearAll,
dataMaskSelected,