Merge pull request #142 from stephb9959/main

[WIFI-11873] Navbar menu hidden by device page bar fix

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "ucentral-client",
-  "version": "2.8.0(34)",
+  "version": "2.8.0(35)",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "ucentral-client",
-      "version": "2.8.0(34)",
+      "version": "2.8.0(35)",
       "license": "ISC",
       "dependencies": {
         "@chakra-ui/icons": "^2.0.11",

package.json

@@ -1,6 +1,6 @@
 {
   "name": "ucentral-client",
-  "version": "2.8.0(34)",
+  "version": "2.8.0(35)",
   "description": "",
   "private": true,
   "main": "index.tsx",

src/layout/Navbar/index.tsx

@@ -132,15 +132,17 @@ export const Navbar = ({ toggleSidebar, activeRoute, languageSwitcher }: NavbarP
                       <Avatar h="40px" w="40px" fontSize="0.8rem" lineHeight="2rem" src={avatar} name={user?.name} />
                     </HStack>
                   </MenuButton>
-                  <MenuList
-                    bg={useColorModeValue('white', 'gray.900')}
-                    borderColor={useColorModeValue('gray.200', 'gray.700')}
-                  >
-                    <MenuItem onClick={goToProfile} w="100%">
-                      {t('account.title')}
-                    </MenuItem>
-                    <MenuItem onClick={logout}>{t('common.logout')}</MenuItem>
-                  </MenuList>
+                  <Portal>
+                    <MenuList
+                      bg={useColorModeValue('white', 'gray.900')}
+                      borderColor={useColorModeValue('gray.200', 'gray.700')}
+                    >
+                      <MenuItem onClick={goToProfile} w="100%">
+                        {t('account.title')}
+                      </MenuItem>
+                      <MenuItem onClick={logout}>{t('common.logout')}</MenuItem>
+                    </MenuList>
+                  </Portal>
                 </Menu>
               </HStack>
             </Flex>