TokensController.addToken use networkClientId (#1676)

Currently, TokenController only uses the global selected provider. We
want to see how it feels making this controller consume any network
provider the NetworkController may have available. We do this by
extending the `addToken()` interface with an optional `networkClientId`
param, but continuing to use the provider proxy as a fallback.

~~TODO: specs have not been updated to test the networkClientId case~~
added


* Fixes MetaMask/MetaMask-planning#1020
* See MetaMask/metamask-extension#20916

## Explanation

<!--
Thanks for your contribution! Take a moment to answer these questions so
that reviewers have the information they need to properly understand
your changes:

* What is the current state of things and why does it need to change?
* What is the solution your changes offer and how does it work?
* Are there any changes whose purpose might not obvious to those
unfamiliar with the domain?
* If your primary goal was to update one package but you found you had
to update another one along the way, why did you do so?
* If you had to upgrade a dependency, why did you do so?
-->

## References

<!--
Are there any issues that this pull request is tied to? Are there other
links that reviewers should consult to understand these changes better?

For example:

* Fixes #12345
* Related to #67890
-->

## Changelog

<!--
If you're making any consumer-facing changes, list those changes here as
if you were updating a changelog, using the template below as a guide.

(CATEGORY is one of BREAKING, ADDED, CHANGED, DEPRECATED, REMOVED, or
FIXED. For security-related issues, follow the Security Advisory
process.)

Please take care to name the exact pieces of the API you've added or
changed (e.g. types, interfaces, functions, or methods).

If there are any breaking changes, make sure to offer a solution for
consumers to follow once they upgrade to the changes.

Finally, if you're only making changes to development scripts or tests,
you may replace the template below with "None".
-->

### `@metamask/assets-controllers`

- **BREAKING**: `TokensController` now expects `getNetworkClientById` in
constructor options
- **BREAKING**: `TokensController. addToken()` now accepts a single
options object
  ```
    {
      address: string;
      symbol: string;
      decimals: number;
      name?: string;
      image?: string;
      interactingAddress?: string;
      networkClientId?: NetworkClientId;
    }
  ```  
- **CHANGED**: `TokensController. addToken()` will use the chain ID
value derived from state for `networkClientId` if provided
- **CHANGED**: `TokensController. addTokens()` now accepts an optional
`networkClientId` as the last parameter
- **CHANGED**: `TokensController. addTokens()` will use the chain ID
value derived from state for `networkClientId` if provided
- **CHANGED**: `TokensController. watchAsset()` options now accepts
optional `networkClientId` which is used to get the ERC-20 token name if
provided

## Checklist

- [x] I've updated the test suite for new or updated code as appropriate
- [x] I've updated documentation (JSDoc, Markdown, etc.) for new or
updated code as appropriate
- [x] I've highlighted breaking changes using the "BREAKING" category
above as appropriate

packages/assets-controllers/src/TokenBalancesController.test.ts

@@ -146,6 +146,7 @@ describe('TokenBalancesController', () => {
         messenger.subscribe('NetworkController:stateChange', listener),
       onTokenListStateChange: sinon.stub(),
       getERC20TokenName: sinon.stub(),
+      getNetworkClientById: sinon.stub() as any,
       messenger: undefined as unknown as TokensControllerMessenger,
     });
     const address = '0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0';
@@ -185,6 +186,7 @@ describe('TokenBalancesController', () => {
         messenger.subscribe('NetworkController:stateChange', listener),
       onTokenListStateChange: sinon.stub(),
       getERC20TokenName: sinon.stub(),
+      getNetworkClientById: sinon.stub() as any,
       messenger: undefined as unknown as TokensControllerMessenger,
     });
     const errorMsg = 'Failed to get balance';
@@ -241,6 +243,7 @@ describe('TokenBalancesController', () => {
         messenger.subscribe('NetworkController:stateChange', listener),
       onTokenListStateChange: sinon.stub(),
       getERC20TokenName: sinon.stub(),
+      getNetworkClientById: sinon.stub() as any,
       messenger: undefined as unknown as TokensControllerMessenger,
     });
 
@@ -256,7 +259,11 @@ describe('TokenBalancesController', () => {
       { interval: 1337 },
     );
     const updateBalances = sinon.stub(tokenBalances, 'updateBalances');
-    await tokensController.addToken('0x00', 'FOO', 18);
+    await tokensController.addToken({
+      address: '0x00',
+      symbol: 'FOO',
+      decimals: 18,
+    });
     const { tokens } = tokensController.state;
     const found = tokens.filter((token: Token) => token.address === '0x00');
     expect(found.length > 0).toBe(true);

packages/assets-controllers/src/TokenDetectionController.test.ts

@@ -170,8 +170,8 @@ describe('TokenDetectionController', () => {
     preferences = new PreferencesController({}, { useTokenDetection: true });
     controllerMessenger = getControllerMessenger();
     sinon
-      .stub(TokensController.prototype, '_instantiateNewEthersProvider')
-      .callsFake(() => null);
+      .stub(TokensController.prototype, '_createEthersContract')
+      .callsFake(() => null as any);
 
     tokensController = new TokensController({
       chainId: ChainId.mainnet,
@@ -180,6 +180,7 @@ describe('TokenDetectionController', () => {
         onNetworkStateChangeListeners.push(listener),
       onTokenListStateChange: sinon.stub(),
       getERC20TokenName: sinon.stub(),
+      getNetworkClientById: sinon.stub() as any,
       messenger: undefined as unknown as TokensControllerMessenger,
     });
 
@@ -336,18 +337,18 @@ describe('TokenDetectionController', () => {
 
     await tokenDetection.start();
 
-    await tokensController.addToken(
-      sampleTokenA.address,
-      sampleTokenA.symbol,
-      sampleTokenA.decimals,
-    );
+    await tokensController.addToken({
+      address: sampleTokenA.address,
+      symbol: sampleTokenA.symbol,
+      decimals: sampleTokenA.decimals,
+    });
 
-    await tokensController.addToken(
-      sampleTokenB.address,
-      sampleTokenB.symbol,
-      sampleTokenB.decimals,
-      { name: sampleTokenB.name },
-    );
+    await tokensController.addToken({
+      address: sampleTokenB.address,
+      symbol: sampleTokenB.symbol,
+      decimals: sampleTokenB.decimals,
+      name: sampleTokenB.name,
+    });
 
     tokensController.ignoreTokens([sampleTokenA.address]);
 
@@ -368,11 +369,11 @@ describe('TokenDetectionController', () => {
 
     await tokenDetection.start();
 
-    await tokensController.addToken(
-      sampleTokenA.address,
-      sampleTokenA.symbol,
-      sampleTokenA.decimals,
-    );
+    await tokensController.addToken({
+      address: sampleTokenA.address,
+      symbol: sampleTokenA.symbol,
+      decimals: sampleTokenA.decimals,
+    });
 
     tokensController.ignoreTokens([sampleTokenA.address]);