message: fix(app): place top portal at higher z index than page level portal
  In order to ensure that top level modals render on top of any page level modals, this sets the z
  index of the top level portal root's contents to 10 as opposed to 1 for the page level portal
diff: // @flow
  import * as React from 'react'
  import ReactDom from 'react-dom'
  +import { Box } from '@opentrons/components'
  type PortalLevel = 'page' | 'top'
  @@ -13,20 +14,25 @@ type State = {|
  hasRoot: boolean,
  |}
  -const PORTAL_ROOT_ID_BY_LEVEL: { [PortalLevel]: string } = {
  - page: '__otAppModalPortalRoot',
  - top: '__otAppTopPortalRoot',
  +type PortalLevelInfo = {|
  + id: string,
  + zIndex: number | string,
  +|}
  +
  +const PORTAL_ROOT_PROPS_BY_LEVEL: { [PortalLevel]: PortalLevelInfo } = {
  + page: { id: '__otAppModalPortalRoot', zIndex: 1 },
  + top: { id: '__otAppTopPortalRoot', zIndex: 10 },
  }
  const getPortalRoot = level =>
  - global.document.getElementById(PORTAL_ROOT_ID_BY_LEVEL[level])
  + global.document.getElementById(PORTAL_ROOT_PROPS_BY_LEVEL[level].id)
  export function PortalRoot(): React.Node {
  - return <div id={PORTAL_ROOT_ID_BY_LEVEL.page} />
  + return <Box {...PORTAL_ROOT_PROPS_BY_LEVEL.page} />
  }
  export function TopPortalRoot(): React.Node {
  - return <div id={PORTAL_ROOT_ID_BY_LEVEL.top} />
  + return <Box {...PORTAL_ROOT_PROPS_BY_LEVEL.top} />
  }
  // the children of Portal are rendered into the PortalRoot if it exists in DOM
  