Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2024-12-22 19:07:54 +01:00
Code Issues Projects Releases Wiki Activity

fix: features sidebar scroll (#5524)

Browse Source 
Feature toggle overview screen - the sidebar getting sticky was making it hard to see many environments
This commit is contained in:
Tymoteusz Czech 2023-12-05 09:08:02 +01:00 committed by GitHub
parent 20ebe8f7d3
commit 795c67306c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/component/feature/FeatureView/FeatureOverview/FeatureOverviewSidePanel/FeatureOverviewSidePanel.tsx
View File

@ -1,4 +1,4 @@
import { Divider, styled } from '@mui/material'; import { Box, Divider, styled } from '@mui/material';
import { HelpIcon } from 'component/common/HelpIcon/HelpIcon'; import { HelpIcon } from 'component/common/HelpIcon/HelpIcon';
import { useFeature } from 'hooks/api/getters/useFeature/useFeature'; import { useFeature } from 'hooks/api/getters/useFeature/useFeature';
import { useRequiredPathParam } from 'hooks/useRequiredPathParam'; import { useRequiredPathParam } from 'hooks/useRequiredPathParam';
@ -7,7 +7,7 @@ import { FeatureOverviewSidePanelEnvironmentSwitches } from './FeatureOverviewSi
import { FeatureOverviewSidePanelTags } from './FeatureOverviewSidePanelTags/FeatureOverviewSidePanelTags'; import { FeatureOverviewSidePanelTags } from './FeatureOverviewSidePanelTags/FeatureOverviewSidePanelTags';
import { Sticky } from 'component/common/Sticky/Sticky'; import { Sticky } from 'component/common/Sticky/Sticky';
const StyledContainer = styled(Sticky)(({ theme }) => ({ const StyledContainer = styled(Box)(({ theme }) => ({
top: theme.spacing(2), top: theme.spacing(2),
borderRadius: theme.shape.borderRadiusLarge, borderRadius: theme.shape.borderRadiusLarge,
backgroundColor: theme.palette.background.paper, backgroundColor: theme.palette.background.paper,
@ -52,9 +52,10 @@ export const FeatureOverviewSidePanel = ({
const projectId = useRequiredPathParam('projectId'); const projectId = useRequiredPathParam('projectId');
const featureId = useRequiredPathParam('featureId'); const featureId = useRequiredPathParam('featureId');
const { feature } = useFeature(projectId, featureId); const { feature } = useFeature(projectId, featureId);
const isSticky = feature.environments?.length <= 3;
return ( return (
<StyledContainer> <StyledContainer as={isSticky ? Sticky : Box}>
<FeatureOverviewSidePanelEnvironmentSwitches <FeatureOverviewSidePanelEnvironmentSwitches
header={ header={
<StyledHeader data-loading> <StyledHeader data-loading>