add increaseZindex prop to EtherscanBtn to fix tooltip in provider dropdown in header

src/components/EtherscanBtn/index.jsx

@@ -1,13 +1,13 @@
 // @flow
 import React from 'react'
 import Tooltip from '@material-ui/core/Tooltip'
-import { withStyles } from '@material-ui/core/styles'
+import { makeStyles } from '@material-ui/core/styles'
 import Img from '~/components/layout/Img'
 import { getEtherScanLink } from '~/logic/wallets/getWeb3'
 import { xs } from '~/theme/variables'
 import SearchIcon from './search.svg'
 
-const styles = () => ({
+const useStyles = makeStyles({
   container: {
     display: 'flex',
     justifyContent: 'center',
@@ -19,18 +19,23 @@ const styles = () => ({
       backgroundColor: '#F0EFEE',
     },
   },
+  inreasedPopperZindex: {
+    zIndex: 2001,
+  },
 })
 
 type EtherscanBtnProps = {
   type: 'tx' | 'address',
   value: string,
-  classes: Object,
+  increaseZindex?: boolean,
 }
 
-const EtherscanBtn = ({
-  type, value, classes,
-}: EtherscanBtnProps) => (
-  <Tooltip title="Show details on Etherscan" placement="top">
+const EtherscanBtn = ({ type, value, increaseZindex = false }: EtherscanBtnProps) => {
+  const classes = useStyles()
+  const customClasses = increaseZindex ? { popper: classes.inreasedPopperZindex } : {}
+
+  return (
+    <Tooltip title="Show details on Etherscan" placement="top" classes={customClasses}>
       <a
         className={classes.container}
         href={getEtherScanLink(type, value)}
@@ -41,8 +46,7 @@ const EtherscanBtn = ({
         <Img src={SearchIcon} height={20} alt="Etherscan" />
       </a>
     </Tooltip>
-)
+  )
+}
 
-const EtherscanBtnWithStyles = withStyles(styles)(EtherscanBtn)
-
-export default EtherscanBtnWithStyles
+export default EtherscanBtn

src/components/Header/component/ProviderDetails/UserDetails.jsx

@@ -119,7 +119,7 @@ const UserDetails = ({
           {userAddress && (
             <>
               <CopyBtn content={userAddress} increaseZindex />
-              <EtherscanBtn type="address" value={userAddress} />
+              <EtherscanBtn type="address" value={userAddress} increaseZindex />
             </>
           )}
         </Block>