diff --git a/packages/react/src/components/sideNavigation/SideNavigation.tsx b/packages/react/src/components/sideNavigation/SideNavigation.tsx index 799fbf7c31..365e1099f2 100644 --- a/packages/react/src/components/sideNavigation/SideNavigation.tsx +++ b/packages/react/src/components/sideNavigation/SideNavigation.tsx @@ -73,6 +73,7 @@ export const SideNavigation = ({ const [activeParentLevel, setActiveParentLevel] = React.useState(); const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false); const isMobile = useMobile(); + const shouldRenderMenu = !(isMobile && !mobileMenuOpen); const mainLevels = React.Children.map(children, (child, index) => { if (isValidElement(child) && (child.type as FCWithName).componentName === 'MainLevel') { @@ -143,16 +144,17 @@ export const SideNavigation = ({ > {toggleButtonLabel} - + {shouldRenderMenu && ( + + )} ); diff --git a/packages/react/src/components/sideNavigation/__snapshots__/SideNavigation.test.tsx.snap b/packages/react/src/components/sideNavigation/__snapshots__/SideNavigation.test.tsx.snap index 3369dea08c..79c4dacdae 100644 --- a/packages/react/src/components/sideNavigation/__snapshots__/SideNavigation.test.tsx.snap +++ b/packages/react/src/components/sideNavigation/__snapshots__/SideNavigation.test.tsx.snap @@ -45,7 +45,6 @@ exports[` spec renders the component 1`] = `