Merge pull request #164 from statelyai/andarist/sta-320-events-panel-…

…hiding-view-user-toolbar Fix `zIndex` issue with events table and logged in user Menu
statelyai · Aug 10, 2021 · b1bb95f · b1bb95f · vercel · Aug 10, 2021
2 parents 8e0810c + b16b5fa
commit b1bb95f
Showing 1 changed file with 19 additions and 16 deletions.
diff --git a/src/Login.tsx b/src/Login.tsx
@@ -14,6 +14,7 @@ import {
  ModalHeader,
  ModalOverlay,
  Text,
+ Portal,
 } from '@chakra-ui/react';
 import { useActor } from '@xstate/react';
 import React from 'react';
@@ -55,25 +56,27 @@ export const Login: React.FC = () => {
  width="30px"
  />
  </MenuButton>
- <MenuList>
- {state.context.loggedInUserData && (
+ <Portal>
+ <MenuList>
+ {state.context.loggedInUserData && (
+ <MenuItem
+ as="a"
+ href={registryLinks.viewUserById(
+ state.context.loggedInUserData.id,
+ )}
+ >
+ View Machines
+ </MenuItem>
+ )}
  <MenuItem
- as="a"
- href={registryLinks.viewUserById(
- state.context.loggedInUserData.id,
- )}
+ onClick={() => {
+ authService.send('SIGN_OUT');
+ }}
  >
- View Machines
+ Logout
  </MenuItem>
- )}
- <MenuItem
- onClick={() => {
- authService.send('SIGN_OUT');
- }}
- >
- Logout
- </MenuItem>
- </MenuList>
+ </MenuList>
+ </Portal>
  </Menu>
  )}