Fix no-shadow issues (#9246)

See [`no-shadow`](https://eslint.org/docs/rules/no-shadow) for more information. This change enables `no-shadow` and fixes the issues raised by the rule.
4 years ago · 4357cda7b8
parent d5a539e0e5
commit 4357cda7b8
41 changed files with 113 additions and 113 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -66,6 +66,7 @@ module.exports = {
    'no-plusplus': ['error', { 'allowForLoopAfterthoughts': true }],
    'no-process-exit': 'error',
    'no-prototype-builtins': 'error',
+    'no-shadow': 'error',
    'no-template-curly-in-string': 'error',
    'no-useless-catch': 'error',
    'no-useless-concat': 'error',
--- a/app/scripts/controllers/alert.js
+++ b/app/scripts/controllers/alert.js
@ -48,8 +48,7 @@ export default class AlertController {
    )
    this.store = new ObservableStore(state)

-    const { selectedAddress } = preferencesStore.getState()
-    this.selectedAddress = selectedAddress
+    this.selectedAddress = preferencesStore.getState().selectedAddress

    preferencesStore.subscribe(({ selectedAddress }) => {
      const currentState = this.store.getState()
--- a/app/scripts/controllers/app-state.js
+++ b/app/scripts/controllers/app-state.js
@ -15,8 +15,6 @@ export default class AppStateController extends EventEmitter {
      showUnlockRequest,
      preferencesStore,
    } = opts
-    const { preferences } = preferencesStore.getState()
-
    super()

    this.onInactiveTimeout = onInactiveTimeout || (() => undefined)
@ -40,6 +38,7 @@ export default class AppStateController extends EventEmitter {
      }
    })

+    const { preferences } = preferencesStore.getState()
    this._setInactiveTimeout(preferences.autoLockTimeLimit)
  }

--- a/app/scripts/controllers/transactions/index.js
+++ b/app/scripts/controllers/transactions/index.js
@ -473,8 +473,8 @@ export default class TransactionController extends EventEmitter {
      // this is try-catch wrapped so that we can guarantee that the nonceLock is released
      try {
        this.txStateManager.setTxStatusFailed(txId, err)
-      } catch (err) {
-        log.error(err)
+      } catch (err2) {
+        log.error(err2)
      }
      // must set transaction to submitted/failed before releasing lock
      if (nonceLock) {
@ -701,7 +701,7 @@ export default class TransactionController extends EventEmitter {
      TOKEN_METHOD_APPROVE,
      TOKEN_METHOD_TRANSFER,
      TOKEN_METHOD_TRANSFER_FROM,
-    ].find((tokenMethodName) => tokenMethodName === name && name.toLowerCase())
+    ].find((methodName) => methodName === name && name.toLowerCase())

    let result
    if (txParams.data && tokenMethodName) {
--- a/app/scripts/metamask-controller.js
+++ b/app/scripts/metamask-controller.js
@ -49,7 +49,6 @@ import nodeify from './lib/nodeify'
 import accountImporter from './account-import-strategies'
 import selectChainId from './lib/select-chain-id'
 import { Mutex } from 'await-semaphore'
-import { version } from '../manifest/_base.json'
 import ethUtil from 'ethereumjs-util'

 import seedPhraseVerifier from './lib/seed-phrase-verifier'
@ -81,6 +80,7 @@ export default class MetamaskController extends EventEmitter {

    this.sendUpdate = debounce(this.privateSendUpdate.bind(this), 200)
    this.opts = opts
+    this.platform = opts.platform
    const initState = opts.initState || {}
    this.recordFirstTimeInfo(initState)

@ -88,9 +88,6 @@ export default class MetamaskController extends EventEmitter {
    // the only thing that uses controller connections are open metamask UI instances
    this.activeControllerConnections = 0

-    // platform-specific api
-    this.platform = opts.platform
-
    this.getRequestAccountTabIds = opts.getRequestAccountTabIds
    this.getOpenMetamaskTabsIds = opts.getOpenMetamaskTabsIds

@ -221,6 +218,7 @@ export default class MetamaskController extends EventEmitter {
      preferencesStore: this.preferencesController.store,
    })

+    const version = this.platform.getVersion()
    this.threeBoxController = new ThreeBoxController({
      preferencesController: this.preferencesController,
      addressBookController: this.addressBookController,
@ -335,6 +333,7 @@ export default class MetamaskController extends EventEmitter {
   * Constructor helper: initialize a provider.
   */
  initializeProvider () {
+    const version = this.platform.getVersion()
    const providerOpts = {
      static: {
        eth_syncing: false,
@ -594,8 +593,8 @@ export default class MetamaskController extends EventEmitter {
        vault = await this.keyringController.fullUpdate()
      } else {
        vault = await this.keyringController.createNewVaultAndKeychain(password)
-        const accounts = await this.keyringController.getAccounts()
-        this.preferencesController.setAddresses(accounts)
+        const addresses = await this.keyringController.getAccounts()
+        this.preferencesController.setAddresses(addresses)
        this.selectFirstIdentity()
      }
      return vault
@ -711,9 +710,9 @@ export default class MetamaskController extends EventEmitter {
      Object.keys(accountTokens[address]).forEach((networkType) => {
        filteredAccountTokens[checksummedAddress][networkType] = networkType === 'mainnet'
          ? (
-            accountTokens[address][networkType].filter(({ address }) => {
-              const tokenAddress = ethUtil.toChecksumAddress(address)
-              return contractMap[tokenAddress] ? contractMap[tokenAddress].erc20 : true
+            accountTokens[address][networkType].filter(({ address: tokenAddress }) => {
+              const checksumAddress = ethUtil.toChecksumAddress(tokenAddress)
+              return contractMap[checksumAddress] ? contractMap[checksumAddress].erc20 : true
            })
          )
          : accountTokens[address][networkType]
@ -2058,6 +2057,7 @@ export default class MetamaskController extends EventEmitter {
   */
  recordFirstTimeInfo (initState) {
    if (!('firstTimeInfo' in initState)) {
+      const version = this.platform.getVersion()
      initState.firstTimeInfo = {
        version,
        date: Date.now(),
--- a/development/build/styles.js
+++ b/development/build/styles.js
@ -49,14 +49,14 @@ function createStyleTasks ({ livereload }) {
    return async function () {
      if (devMode) {
        watch(pattern, async (event) => {
-          await buildScss(devMode)
+          await buildScss()
          livereload.changed(event.path)
        })
      }
      await buildScss(devMode)
    }

-    async function buildScss (devMode) {
+    async function buildScss () {
      await pump(...[
        // pre-process
        gulp.src(src),
--- a/development/verify-locale-strings.js
+++ b/development/verify-locale-strings.js
@ -46,19 +46,19 @@ for (const arg of process.argv.slice(2)) {
  }
 }

-main(specifiedLocale, fix)
+main()
  .catch((error) => {
    log.error(error)
    process.exit(1)
  })

-async function main (specifiedLocale, fix) {
+async function main () {
  if (specifiedLocale) {
    log.info(`Verifying selected locale "${specifiedLocale}":\n`)
    const locale = localeIndex.find((localeMeta) => localeMeta.code === specifiedLocale)
    const failed = locale.code === 'en' ?
-      await verifyEnglishLocale(fix) :
-      await verifyLocale(locale, fix)
+      await verifyEnglishLocale() :
+      await verifyLocale(locale)
    if (failed) {
      process.exit(1)
    }
@ -116,7 +116,7 @@ async function writeLocale (code, locale) {
  }
 }

-async function verifyLocale (code, fix = false) {
+async function verifyLocale (code) {
  const englishLocale = await getLocale('en')
  const targetLocale = await getLocale(code)

@ -162,7 +162,7 @@ async function verifyLocale (code, fix = false) {
  return false
 }

-async function verifyEnglishLocale (fix = false) {
+async function verifyEnglishLocale () {
  const englishLocale = await getLocale('en')
  const javascriptFiles = await findJavascriptFiles(path.resolve(__dirname, '..', 'ui'))

--- a/test/e2e/benchmark.js
+++ b/test/e2e/benchmark.js
@ -62,10 +62,10 @@ async function profilePageLoad (pages, numSamples) {
    }

    const result = {
-      firstPaint: runResults.map((result) => result.paint['first-paint']),
-      domContentLoaded: runResults.map((result) => result.navigation[0] && result.navigation[0].domContentLoaded),
-      load: runResults.map((result) => result.navigation[0] && result.navigation[0].load),
-      domInteractive: runResults.map((result) => result.navigation[0] && result.navigation[0].domInteractive),
+      firstPaint: runResults.map((metrics) => metrics.paint['first-paint']),
+      domContentLoaded: runResults.map((metrics) => metrics.navigation[0] && metrics.navigation[0].domContentLoaded),
+      load: runResults.map((metrics) => metrics.navigation[0] && metrics.navigation[0].load),
+      domInteractive: runResults.map((metrics) => metrics.navigation[0] && metrics.navigation[0].domInteractive),
    }

    results[pageName] = {
--- a/test/e2e/signature-request.spec.js
+++ b/test/e2e/signature-request.spec.js
@ -74,7 +74,7 @@ describe('MetaMask', function () {
      await driver.delay(regularDelayMs)

      await driver.waitUntilXWindowHandles(3)
-      const windowHandles = await driver.getAllWindowHandles()
+      windowHandles = await driver.getAllWindowHandles()

      extension = windowHandles[0]
      dapp = await driver.switchToWindowWithTitle('E2E Test Dapp', windowHandles)
--- a/test/e2e/webdriver/index.js
+++ b/test/e2e/webdriver/index.js
@ -37,16 +37,16 @@ async function buildBrowserWebDriver (browser, webDriverOptions) {

 async function setupFetchMocking (driver) {
  // define fetchMocking script, to be evaluated in the browser
-  function fetchMocking (fetchMockResponses) {
+  function fetchMocking (mockResponses) {
    window.origFetch = window.fetch.bind(window)
    window.fetch = async (...args) => {
      const url = args[0]
      if (url.match(/^http(s)?:\/\/ethgasstation\.info\/json\/ethgasAPI.*/u)) {
-        return { json: async () => clone(fetchMockResponses.ethGasBasic) }
+        return { json: async () => clone(mockResponses.ethGasBasic) }
      } else if (url.match(/http(s?):\/\/ethgasstation\.info\/json\/predictTable.*/u)) {
-        return { json: async () => clone(fetchMockResponses.ethGasPredictTable) }
+        return { json: async () => clone(mockResponses.ethGasPredictTable) }
      } else if (url.match(/chromeextensionmm/u)) {
-        return { json: async () => clone(fetchMockResponses.metametrics) }
+        return { json: async () => clone(mockResponses.metametrics) }
      }
      return window.origFetch(...args)
    }
--- a/test/unit/app/controllers/metamask-controller-test.js
+++ b/test/unit/app/controllers/metamask-controller-test.js
@ -7,6 +7,7 @@ import { obj as createThoughStream } from 'through2'
 import firstTimeState from '../../localhostState'
 import createTxMeta from '../../../lib/createTxMeta'
 import EthQuery from 'eth-query'
+import proxyquire from 'proxyquire'

 const threeBoxSpies = {
  init: sinon.stub(),
@ -14,7 +15,6 @@ const threeBoxSpies = {
  turnThreeBoxSyncingOn: sinon.stub(),
  _registerUpdates: sinon.spy(),
 }
-import proxyquire from 'proxyquire'

 class ThreeBoxControllerMock {
  constructor () {
@ -113,7 +113,7 @@ describe('MetaMaskController', function () {
        },
      },
      initState: cloneDeep(firstTimeState),
-      platform: { showTransactionNotification: () => undefined },
+      platform: { showTransactionNotification: () => undefined, getVersion: () => 'foo' },
    })
    // disable diagnostics
    metamaskController.diagnostics = null
@ -758,11 +758,10 @@ describe('MetaMaskController', function () {
    })

    it('errors with no from in msgParams', async function () {
-      const msgParams = {
-        'data': data,
-      }
      try {
-        await metamaskController.newUnsignedPersonalMessage(msgParams)
+        await metamaskController.newUnsignedPersonalMessage({
+          'data': data,
+        })
        assert.fail('should have thrown')
      } catch (error) {
        assert.equal(error.message, 'MetaMask Message Signature: from field is required.')
--- a/test/unit/app/controllers/permissions/permissions-controller-test.js
+++ b/test/unit/app/controllers/permissions/permissions-controller-test.js
@ -823,9 +823,9 @@ describe('permissions controller', function () {

    beforeEach(function () {
      identities = ALL_ACCOUNTS.reduce(
-        (identities, account) => {
-          identities[account] = {}
-          return identities
+        (identitiesAcc, account) => {
+          identitiesAcc[account] = {}
+          return identitiesAcc
        },
        {},
      )
--- a/test/unit/app/controllers/preferences-controller-test.js
+++ b/test/unit/app/controllers/preferences-controller-test.js
@ -366,15 +366,13 @@ describe('preferences controller', function () {
  })

  describe('on watchAsset', function () {
-    let stubNext, stubEnd, stubHandleWatchAssetERC20, asy, req, res
+    let stubHandleWatchAssetERC20, asy, req, res
    const sandbox = sinon.createSandbox()

    beforeEach(function () {
      req = { params: {} }
      res = {}
-      asy = { next: () => undefined, end: () => undefined }
-      stubNext = sandbox.stub(asy, 'next')
-      stubEnd = sandbox.stub(asy, 'end').returns(0)
+      asy = { next: sandbox.spy(), end: sandbox.spy() }
      stubHandleWatchAssetERC20 = sandbox.stub(preferencesController, '_handleWatchAssetERC20')
    })
    after(function () {
@ -382,40 +380,33 @@ describe('preferences controller', function () {
    })

    it('shouldn not do anything if method not corresponds', async function () {
-      const asy = { next: () => undefined, end: () => undefined }
-      const stubNext = sandbox.stub(asy, 'next')
-      const stubEnd = sandbox.stub(asy, 'end').returns(0)
      req.method = 'metamask'
      await preferencesController.requestWatchAsset(req, res, asy.next, asy.end)
-      sandbox.assert.notCalled(stubEnd)
-      sandbox.assert.called(stubNext)
+      sandbox.assert.notCalled(asy.end)
+      sandbox.assert.called(asy.next)
    })
    it('should do something if method is supported', async function () {
-      const asy = { next: () => undefined, end: () => undefined }
-      const stubNext = sandbox.stub(asy, 'next')
-      const stubEnd = sandbox.stub(asy, 'end').returns(0)
      req.method = 'metamask_watchAsset'
      req.params.type = 'someasset'
      await preferencesController.requestWatchAsset(req, res, asy.next, asy.end)
-      sandbox.assert.called(stubEnd)
-      sandbox.assert.notCalled(stubNext)
+      sandbox.assert.called(asy.end)
+      sandbox.assert.notCalled(asy.next)
      req.method = addInternalMethodPrefix('watchAsset')
      req.params.type = 'someasset'
      await preferencesController.requestWatchAsset(req, res, asy.next, asy.end)
-      sandbox.assert.calledTwice(stubEnd)
-      sandbox.assert.notCalled(stubNext)
+      sandbox.assert.calledTwice(asy.end)
+      sandbox.assert.notCalled(asy.next)
    })
    it('should through error if method is supported but asset type is not', async function () {
      req.method = 'metamask_watchAsset'
      req.params.type = 'someasset'
      await preferencesController.requestWatchAsset(req, res, asy.next, asy.end)
-      sandbox.assert.called(stubEnd)
+      sandbox.assert.called(asy.end)
      sandbox.assert.notCalled(stubHandleWatchAssetERC20)
-      sandbox.assert.notCalled(stubNext)
+      sandbox.assert.notCalled(asy.next)
      assert.deepEqual(res, {})
    })
    it('should trigger handle add asset if type supported', async function () {
-      const asy = { next: () => undefined, end: () => undefined }
      req.method = 'metamask_watchAsset'
      req.params.type = 'ERC20'
      await preferencesController.requestWatchAsset(req, res, asy.next, asy.end)
--- a/test/unit/app/controllers/transactions/tx-state-manager-test.js
+++ b/test/unit/app/controllers/transactions/tx-state-manager-test.js
@ -34,15 +34,15 @@ describe('TransactionStateManager', function () {
    it('should emit a signed event to signal the execution of callback', function () {
      const tx = { id: 1, status: 'unapproved', metamaskNetworkId: currentNetworkId, txParams: {} }
      const clock = sinon.useFakeTimers()
-      const noop = sinon.spy()
+      const onSigned = sinon.spy()

      txStateManager.addTx(tx)
-      txStateManager.on('1:signed', noop)
+      txStateManager.on('1:signed', onSigned)
      txStateManager.setTxStatusSigned(1)
      clock.runAll()
      clock.restore()

-      assert.ok(noop.calledOnce)
+      assert.ok(onSigned.calledOnce)
    })
  })

@ -59,15 +59,15 @@ describe('TransactionStateManager', function () {
    it('should emit a rejected event to signal the execution of callback', function () {
      const tx = { id: 1, status: 'unapproved', metamaskNetworkId: currentNetworkId, txParams: {} }
      const clock = sinon.useFakeTimers()
-      const noop = sinon.spy()
+      const onSigned = sinon.spy()

      txStateManager.addTx(tx)
-      txStateManager.on('1:rejected', noop)
+      txStateManager.on('1:rejected', onSigned)
      txStateManager.setTxStatusRejected(1)
      clock.runAll()
      clock.restore()

-      assert.ok(noop.calledOnce)
+      assert.ok(onSigned.calledOnce)
    })
  })

--- a/test/unit/migrations/migrator-test.js
+++ b/test/unit/migrations/migrator-test.js
@ -86,8 +86,8 @@ describe('migrations', function () {
  })

  describe('Migrator', function () {
-    const migrator = new Migrator({ migrations: stubMigrations })
    it('migratedData version should be version 3', async function () {
+      const migrator = new Migrator({ migrations: stubMigrations })
      const migratedData = await migrator.migrateData(versionedData)
      assert.equal(migratedData.meta.version, stubMigrations[2].version)
    })
--- a/test/unit/ui/app/actions.spec.js
+++ b/test/unit/ui/app/actions.spec.js
@ -32,6 +32,7 @@ describe('Actions', function () {
  beforeEach(async function () {

    metamaskController = new MetaMaskController({
+      platform: { getVersion: () => 'foo' },
      provider,
      keyringController: new KeyringController({}),
      showUnapprovedTx: noop,
@ -337,9 +338,9 @@ describe('Actions', function () {

      importAccountWithStrategySpy = sinon.spy(background, 'importAccountWithStrategy')

-      const importPrivkey = 'c87509a1c067bbde78beb793e6fa76530b6382a4c0241e5e4a9ec0a0f44dc0d3'
-
-      await store.dispatch(actions.importNewAccount('Private Key', [ importPrivkey ]))
+      await store.dispatch(actions.importNewAccount('Private Key', [
+        'c87509a1c067bbde78beb793e6fa76530b6382a4c0241e5e4a9ec0a0f44dc0d3',
+      ]))
      assert(importAccountWithStrategySpy.calledOnce)
    })

--- a/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
+++ b/ui/app/components/app/gas-customization/gas-modal-page-container/gas-modal-page-container.container.js
@ -220,6 +220,7 @@ const mapDispatchToProps = (dispatch) => {
 const mergeProps = (stateProps, dispatchProps, ownProps) => {
  const {
    gasPriceButtonGroupProps,
+    // eslint-disable-next-line no-shadow
    isConfirm,
    txId,
    isSpeedUp,
--- a/ui/app/components/app/gas-customization/gas-price-button-group/tests/gas-price-button-group-component.test.js
+++ b/ui/app/components/app/gas-customization/gas-price-button-group/tests/gas-price-button-group-component.test.js
@ -77,12 +77,12 @@ describe('GasPriceButtonGroup Component', function () {
      assert.equal(noButtonActiveByDefault, true)
    })

-    function renderButtonArgsTest (i, mockButtonPropsAndFlags) {
+    function renderButtonArgsTest (i, mockPropsAndFlags) {
      assert.deepEqual(
        GasPriceButtonGroup.prototype.renderButton.getCall(i).args,
        [
          Object.assign({}, mockGasPriceButtonGroupProps.gasButtonInfo[i]),
-          mockButtonPropsAndFlags,
+          mockPropsAndFlags,
          i,
        ],
      )
--- a/ui/app/components/app/modals/cancel-transaction/cancel-transaction.container.js
+++ b/ui/app/components/app/modals/cancel-transaction/cancel-transaction.container.js
@ -44,6 +44,7 @@ const mapDispatchToProps = (dispatch) => {

 const mergeProps = (stateProps, dispatchProps, ownProps) => {
  const { transactionId, defaultNewGasPrice, ...restStateProps } = stateProps
+  // eslint-disable-next-line no-shadow
  const { createCancelTransaction, ...restDispatchProps } = dispatchProps

  return {
--- a/ui/app/components/app/modals/fade-modal.js
+++ b/ui/app/components/app/modals/fade-modal.js
@ -14,8 +14,7 @@ const insertRule = (css) => {
    extraSheet = extraSheet.sheet || extraSheet.styleSheet
  }

-  const index = (extraSheet.cssRules || extraSheet.rules).length
-  extraSheet.insertRule(css, index)
+  extraSheet.insertRule(css, (extraSheet.cssRules || extraSheet.rules).length)

  return extraSheet
 }
--- a/ui/app/components/app/modals/notification-modal/notification-modal.js
+++ b/ui/app/components/app/modals/notification-modal/notification-modal.js
@ -14,6 +14,7 @@ class NotificationModal extends Component {
      message,
      showCancelButton = false,
      showConfirmButton = false,
+      // eslint-disable-next-line no-shadow
      hideModal,
      onConfirm,
    } = this.props
--- a/ui/app/components/app/transaction-list-item/transaction-list-item.component.js
+++ b/ui/app/components/app/transaction-list-item/transaction-list-item.component.js
@ -72,7 +72,7 @@ export default function TransactionListItem ({ transactionGroup, isEarliestNonce
  }, [isUnapproved, history, id])

  const cancelButton = useMemo(() => {
-    const cancelButton = (
+    const btn = (
      <Button
        onClick={cancelTransaction}
        rounded
@ -87,11 +87,11 @@ export default function TransactionListItem ({ transactionGroup, isEarliestNonce
    }

    return cancelEnabled
-      ? cancelButton
+      ? btn
      : (
        <Tooltip title={t('notEnoughGas')} position="bottom">
          <div>
-            {cancelButton}
+            {btn}
          </div>
        </Tooltip>
      )
--- a/ui/app/components/ui/page-container/page-container-footer/tests/page-container-footer.component.test.js
+++ b/ui/app/components/ui/page-container/page-container-footer/tests/page-container-footer.component.test.js
@ -28,7 +28,7 @@ describe('Page Footer', function () {
  })

  it('should render a secondary footer inside page-container__footer when given children', function () {
-    const wrapper = shallow(
+    wrapper = shallow(
      <PageFooter>
        <div>Works</div>
      </PageFooter>,
--- a/ui/app/components/ui/qr-code/qr-code.js
+++ b/ui/app/components/ui/qr-code/qr-code.js
@ -29,9 +29,9 @@ function QrCodeView (props) {
        Array.isArray(message)
          ? (
            <div className="qr-code__message-container">
-              {props.Qr.message.map((message, index) => (
+              {props.Qr.message.map((msg, index) => (
                <div className="qr_code__message" key={index}>
-                  {message}
+                  {msg}
                </div>
              ))}
            </div>
--- a/ui/app/components/ui/tabs/tabs.component.js
+++ b/ui/app/components/ui/tabs/tabs.component.js
@ -41,7 +41,7 @@ export default class Tabs extends Component {
    return React.Children.map(this.props.children, (child, index) => {
      const tabName = child?.props.name
      return child && React.cloneElement(child, {
-        onClick: (index) => this.handleTabClick(index, tabName),
+        onClick: (idx) => this.handleTabClick(idx, tabName),
        tabIndex: index,
        isActive: numberOfTabs > 1 && index === this.state.activeTabIndex,
      })
--- a/ui/app/ducks/gas/gas-duck.test.js
+++ b/ui/app/ducks/gas/gas-duck.test.js
@ -71,7 +71,7 @@ describe('Gas Duck', function () {
      ? mockEthGasApiResponse
      : mockPredictTableResponse
    resolve({
-      json: () => new Promise((resolve) => resolve(dataToResolve)),
+      json: () => Promise.resolve(dataToResolve),
    })
  })

--- a/ui/app/helpers/utils/common.util.js
+++ b/ui/app/helpers/utils/common.util.js
@ -1,5 +1,5 @@
 export function camelCaseToCapitalize (str = '') {
  return str
    .replace(/([A-Z])/ug, ' $1')
-    .replace(/^./u, (str) => str.toUpperCase())
+    .replace(/^./u, (s) => s.toUpperCase())
 }
--- a/ui/app/hooks/useTokenTracker.js
+++ b/ui/app/hooks/useTokenTracker.js
@ -13,14 +13,14 @@ export function useTokenTracker (tokens) {
  const [error, setError] = useState(null)
  const tokenTracker = useRef(null)

-  const updateBalances = useCallback((tokensWithBalances) => {
-    setTokensWithBalances(tokensWithBalances)
+  const updateBalances = useCallback((tokenWithBalances) => {
+    setTokensWithBalances(tokenWithBalances)
    setLoading(false)
    setError(null)
  }, [])

-  const showError = useCallback((error) => {
-    setError(error)
+  const showError = useCallback((err) => {
+    setError(err)
    setLoading(false)
  }, [])

--- a/ui/app/hooks/useTransactionDisplayData.js
+++ b/ui/app/hooks/useTransactionDisplayData.js
@ -84,7 +84,7 @@ export function useTransactionDisplayData (transactionGroup) {
  // transfers, we pass an additional argument to these hooks that will be
  // false for non-token transactions. This additional argument forces the
  // hook to return null
-  const token = isTokenCategory && knownTokens.find((token) => token.address === recipientAddress)
+  const token = isTokenCategory && knownTokens.find(({ address }) => address === recipientAddress)
  const tokenData = useTokenData(initialTransaction?.txParams?.data, isTokenCategory)
  const tokenDisplayValue = useTokenDisplayValue(initialTransaction?.txParams?.data, token, isTokenCategory)
  const tokenFiatAmount = useTokenFiatAmount(token?.address, tokenDisplayValue, token?.symbol)
--- a/ui/app/pages/asset/asset.js
+++ b/ui/app/pages/asset/asset.js
@ -12,7 +12,7 @@ const Asset = () => {
  const tokens = useSelector(getTokens)
  const { asset } = useParams()

-  const token = tokens.find((token) => token.address === asset)
+  const token = tokens.find(({ address }) => address === asset)

  let content
  if (token) {
--- a/ui/app/pages/confirm-approve/confirm-approve.js
+++ b/ui/app/pages/confirm-approve/confirm-approve.js
@ -107,6 +107,7 @@ export default function ConfirmApprove () {
          showCustomizeGasModal={() => dispatch(showModal({ name: 'CUSTOMIZE_GAS', txData }))}
          showEditApprovalPermissionModal={
            ({
+              /* eslint-disable no-shadow */
              customTokenAmount,
              decimals,
              origin,
@ -114,6 +115,7 @@ export default function ConfirmApprove () {
              tokenAmount,
              tokenBalance,
              tokenSymbol,
+              /* eslint-enable no-shadow */
            }) => dispatch(
              showModal({
                name: 'EDIT_APPROVAL_PERMISSION',
--- a/ui/app/pages/connected-sites/connected-sites.container.js
+++ b/ui/app/pages/connected-sites/connected-sites.container.js
@ -76,6 +76,7 @@ const mergeProps = (stateProps, dispatchProps, ownProps) => {
  const {
    disconnectAccount,
    disconnectAllAccounts,
+    // eslint-disable-next-line no-shadow
    requestAccountsPermissionWithId,
  } = dispatchProps
  const { history } = ownProps
--- a/ui/app/pages/create-account/import-account/index.js
+++ b/ui/app/pages/create-account/import-account/index.js
@ -66,10 +66,10 @@ export default class AccountImportSubview extends Component {
            name="import-type-select"
            clearable={false}
            value={type || menuItems[0]}
-            options={menuItems.map((type) => {
+            options={menuItems.map((text) => {
              return {
-                value: type,
-                label: type,
+                value: text,
+                label: text,
              }
            })}
            onChange={(opt) => {
--- a/ui/app/pages/first-time-flow/onboarding-initiator-util.js
+++ b/ui/app/pages/first-time-flow/onboarding-initiator-util.js
@ -3,6 +3,7 @@ import log from 'loglevel'

 const returnToOnboardingInitiatorTab = async (onboardingInitiator) => {
  const tab = await (new Promise((resolve) => {
+    // eslint-disable-next-line no-shadow
    extension.tabs.update(onboardingInitiator.tabId, { active: true }, (tab) => {
      if (tab) {
        resolve(tab)
@ -27,6 +28,7 @@ const returnToOnboardingInitiatorTab = async (onboardingInitiator) => {

 export const returnToOnboardingInitiator = async (onboardingInitiator) => {
  const tab = await (new Promise((resolve) => {
+    // eslint-disable-next-line no-shadow
    extension.tabs.get(onboardingInitiator.tabId, (tab) => {
      if (tab) {
        resolve(tab)
--- a/ui/app/pages/keychains/restore-vault.js
+++ b/ui/app/pages/keychains/restore-vault.js
@ -76,9 +76,11 @@ class RestoreVaultPage extends Component {
  onClick = () => {
    const { password, seedPhrase } = this.state
    const {
+      // eslint-disable-next-line no-shadow
      createNewVaultAndRestore,
      leaveImportSeedScreenState,
      history,
+      // eslint-disable-next-line no-shadow
      initializeThreeBox,
    } = this.props

--- a/ui/app/pages/permissions-connect/permissions-connect.component.js
+++ b/ui/app/pages/permissions-connect/permissions-connect.component.js
@ -242,8 +242,8 @@ export default class PermissionConnect extends Component {
                  render={() => (
                    <PermissionPageContainer
                      request={permissionsRequest || {}}
-                      approvePermissionsRequest={(request, accounts) => {
-                        approvePermissionsRequest(request, accounts)
+                      approvePermissionsRequest={(...args) => {
+                        approvePermissionsRequest(...args)
                        this.redirect(true)
                      }}
                      rejectPermissionsRequest={(requestId) => this.cancelPermissionsRequest(requestId)}
--- a/ui/app/pages/permissions-connect/permissions-connect.container.js
+++ b/ui/app/pages/permissions-connect/permissions-connect.container.js
@ -32,7 +32,7 @@ const mapStateToProps = (state, ownProps) => {
  const currentAddress = getSelectedAddress(state)

  const permissionsRequest = permissionsRequests
-    .find((permissionsRequest) => permissionsRequest.metadata.id === permissionsRequestId)
+    .find((req) => req.metadata.id === permissionsRequestId)

  const { metadata = {} } = permissionsRequest || {}
  const { origin } = metadata
--- a/ui/app/pages/send/send-footer/send-footer.utils.js
+++ b/ui/app/pages/send/send-footer/send-footer.utils.js
@ -55,15 +55,15 @@ export function constructUpdatedTx ({
  }

  if (sendToken) {
-    const data = TOKEN_TRANSFER_FUNCTION_SIGNATURE + Array.prototype.map.call(
-      ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]),
-      (x) => ('00' + x.toString(16)).slice(-2),
-    ).join('')
-
    Object.assign(editingTx.txParams, addHexPrefixToObjectValues({
      value: '0',
      to: sendToken.address,
-      data,
+      data: (
+        TOKEN_TRANSFER_FUNCTION_SIGNATURE + Array.prototype.map.call(
+          ethAbi.rawEncode(['address', 'uint256'], [to, ethUtil.addHexPrefix(amount)]),
+          (x) => ('00' + x.toString(16)).slice(-2),
+        ).join('')
+      ),
    }))
  }

--- a/ui/app/pages/unlock-page/unlock-page.container.js
+++ b/ui/app/pages/unlock-page/unlock-page.container.js
@ -31,6 +31,7 @@ const mapDispatchToProps = (dispatch) => {
 }

 const mergeProps = (stateProps, dispatchProps, ownProps) => {
+  // eslint-disable-next-line no-shadow
  const { markPasswordForgotten, tryUnlockMetamask, ...restDispatchProps } = dispatchProps
  const { history, onSubmit: ownPropsSubmit, ...restOwnProps } = ownProps

--- a/ui/app/store/actions.js
+++ b/ui/app/store/actions.js
@ -1724,13 +1724,13 @@ export function exportAccount (password, address) {
          return
        }
        log.debug(`background.exportAccount`)
-        background.exportAccount(address, function (err, result) {
+        background.exportAccount(address, function (err2, result) {
          dispatch(hideLoadingIndication())

-          if (err) {
-            log.error(err)
+          if (err2) {
+            log.error(err2)
            dispatch(displayWarning('Had a problem exporting the account.'))
-            reject(err)
+            reject(err2)
            return
          }

@ -1756,14 +1756,14 @@ export function exportAccounts (password, addresses) {
        }
        log.debug(`background.exportAccounts`)
        const accountPromises = addresses.map((address) => new Promise(
-          (resolve, reject) => background.exportAccount(address, function (err, result) {
-            if (err) {
-              log.error(err)
+          (resolve2, reject2) => background.exportAccount(address, function (err2, result) {
+            if (err2) {
+              log.error(err2)
              dispatch(displayWarning('Had a problem exporting the account.'))
-              reject(err)
+              reject2(err2)
              return
            }
-            resolve(result)
+            resolve2(result)
            return
          }),
        ))
--- a/ui/index.js
+++ b/ui/index.js
@ -112,8 +112,8 @@ async function startApp (metamaskState, backgroundConnection, opts) {
    }))
  }

-  backgroundConnection.on('update', function (metamaskState) {
-    store.dispatch(actions.updateMetamaskState(metamaskState))
+  backgroundConnection.on('update', function (state) {
+    store.dispatch(actions.updateMetamaskState(state))
  })

  // global metamask api - used by tooling