Show fallback account selector icon if selected account went missing

src/app/components/Toolbar/Features/AccountSelectorButton/index.tsx

@@ -7,29 +7,35 @@ import { Button } from 'grommet/es6/components/Button'
 import { ResponsiveContext } from 'grommet/es6/contexts/ResponsiveContext'
 import React, { memo, useState } from 'react'
 import { useSelector } from 'react-redux'
-import { selectAddress } from 'app/state/wallet/selectors'
+import { selectAddress, selectHasAccounts } from 'app/state/wallet/selectors'
 
 import { AccountSelector } from '../AccountSelector'
 import { JazzIcon } from '../../../JazzIcon'
 import { sidebarSmallSizeLogo, sidebarMediumSizeLogo } from '../../../../../styles/theme/elementSizes'
 import { addressToJazzIconSeed } from './addressToJazzIconSeed'
+import { UserSettings } from 'grommet-icons/es6/icons/UserSettings'
 
 export const AccountSelectorButton = memo(() => {
+  const walletHasAccounts = useSelector(selectHasAccounts)
   const address = useSelector(selectAddress)
   const [layerVisibility, setLayerVisibility] = useState(false)
   const isMobile = React.useContext(ResponsiveContext) === 'small'
 
-  if (!address) {
+  if (!walletHasAccounts) {
     return null
   }
 
   return (
     <>
       <Button onClick={() => setLayerVisibility(true)} data-testid="account-selector">
-        <JazzIcon
-          diameter={isMobile ? sidebarSmallSizeLogo : sidebarMediumSizeLogo}
-          seed={addressToJazzIconSeed(address)}
-        />
+        {address ? (
+          <JazzIcon
+            diameter={isMobile ? sidebarSmallSizeLogo : sidebarMediumSizeLogo}
+            seed={addressToJazzIconSeed(address)}
+          />
+        ) : (
+          <UserSettings />
+        )}
       </Button>
       {layerVisibility && <AccountSelector closeHandler={() => setLayerVisibility(false)} />}
     </>