Skip to content

Commit

Permalink
fix(dashboard): Fix dashboard's left side being cut off (#22319)
Browse files Browse the repository at this point in the history
  • Loading branch information
kgabryje authored Dec 5, 2022
1 parent 92bc641 commit b2d909f
Showing 1 changed file with 26 additions and 8 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,11 @@ import React, {
FC,
useCallback,
useEffect,
useState,
useMemo,
useRef,
useState,
} from 'react';
import { JsonObject, styled, css, t } from '@superset-ui/core';
import { css, JsonObject, styled, t } from '@superset-ui/core';
import { Global } from '@emotion/react';
import { useDispatch, useSelector } from 'react-redux';
import ErrorBoundary from 'src/components/ErrorBoundary';
Expand Down Expand Up @@ -57,8 +57,8 @@ import {
} from 'src/dashboard/actions/dashboardLayout';
import {
DASHBOARD_GRID_ID,
DASHBOARD_ROOT_ID,
DASHBOARD_ROOT_DEPTH,
DASHBOARD_ROOT_ID,
DashboardStandaloneMode,
} from 'src/dashboard/util/constants';
import FilterBar from 'src/dashboard/components/nativeFilters/FilterBar';
Expand All @@ -72,10 +72,10 @@ import {
FILTER_BAR_HEADER_HEIGHT,
FILTER_BAR_TABS_HEIGHT,
MAIN_HEADER_HEIGHT,
OPEN_FILTER_BAR_WIDTH,
OPEN_FILTER_BAR_MAX_WIDTH,
OPEN_FILTER_BAR_WIDTH,
} from 'src/dashboard/constants';
import { shouldFocusTabs, getRootLevelTabsComponent } from './utils';
import { getRootLevelTabsComponent, shouldFocusTabs } from './utils';
import DashboardContainer from './DashboardContainer';
import { useNativeFilters } from './state';

Expand Down Expand Up @@ -168,6 +168,7 @@ const StyledDashboardContent = styled.div<{
dashboardFiltersOpen: boolean;
editMode: boolean;
nativeFiltersEnabled: boolean;
filterBarOrientation: FilterBarOrientation;
}>`
display: flex;
flex-direction: row;
Expand All @@ -193,8 +194,14 @@ const StyledDashboardContent = styled.div<{
dashboardFiltersOpen,
editMode,
nativeFiltersEnabled,
filterBarOrientation,
}) => {
if (!dashboardFiltersOpen && !editMode && nativeFiltersEnabled) {
if (
!dashboardFiltersOpen &&
!editMode &&
nativeFiltersEnabled &&
filterBarOrientation !== FilterBarOrientation.HORIZONTAL
) {
return 0;
}
return theme.gridUnit * 8;
Expand Down Expand Up @@ -335,9 +342,19 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
const draggableStyle = useMemo(
() => ({
marginLeft:
dashboardFiltersOpen || editMode || !nativeFiltersEnabled ? 0 : -32,
dashboardFiltersOpen ||
editMode ||
!nativeFiltersEnabled ||
filterBarOrientation === FilterBarOrientation.HORIZONTAL
? 0
: -32,
}),
[dashboardFiltersOpen, editMode, nativeFiltersEnabled],
[
dashboardFiltersOpen,
editMode,
filterBarOrientation,
nativeFiltersEnabled,
],
);

// If a new tab was added, update the directPathToChild to reflect it
Expand Down Expand Up @@ -505,6 +522,7 @@ const DashboardBuilder: FC<DashboardBuilderProps> = () => {
dashboardFiltersOpen={dashboardFiltersOpen}
editMode={editMode}
nativeFiltersEnabled={nativeFiltersEnabled}
filterBarOrientation={filterBarOrientation}
>
{showDashboard ? (
<DashboardContainer topLevelTabs={topLevelTabs} />
Expand Down

0 comments on commit b2d909f

Please sign in to comment.