feat: Update Polygon from MATIC to POL

app/scripts/migrations/128.test.ts

@@ -0,0 +1,208 @@
+import { migrate, version } from './128';
+
+const oldVersion = 127;
+
+describe(`migration #${version}`, () => {
+  it('updates the version metadata', async () => {
+    const oldStorage = {
+      meta: { version: oldVersion },
+      data: {},
+    };
+
+    const newStorage = await migrate(oldStorage);
+
+    expect(newStorage.meta).toStrictEqual({ version });
+  });
+
+  it('Does nothing if `networkConfigurations` is not in the network controller state', async () => {
+    const oldState = {
+      NetworkController: {
+        selectedNetworkClientId: 'mainnet',
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(oldState);
+  });
+
+  it('Updates MATIC ticker to POL in networkConfigurations', async () => {
+    const oldState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x89': {
+            chainId: '0x89',
+            ticker: 'MATIC',
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x89': {
+            chainId: '0x89',
+            ticker: 'POL',
+          },
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(expectedState);
+  });
+
+  it('Does not update tickers for other network configurations', async () => {
+    const oldState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x89': {
+            chainId: '0x89',
+            ticker: 'MATIC',
+          },
+          '0x1': {
+            chainId: '0x1',
+            ticker: 'ETH',
+          },
+        },
+      },
+    };
+
+    const expectedState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x89': {
+            chainId: '0x89',
+            ticker: 'POL',
+          },
+          '0x1': {
+            chainId: '0x1',
+            ticker: 'ETH',
+          },
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(expectedState);
+  });
+
+  it('Does nothing if the ticker is already POL for the 0x89 chainId', async () => {
+    const oldState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x89': {
+            chainId: '0x89',
+            ticker: 'POL',
+          },
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(oldState);
+  });
+
+  it('Does nothing if Polygon ChainId (0x89) is not in networkConfigurations', async () => {
+    const oldState = {
+      NetworkController: {
+        networkConfigurations: {
+          '0x1': {
+            chainId: '0x1',
+            ticker: 'ETH',
+          },
+          '0x2a': {
+            chainId: '0x2a',
+            ticker: 'KOVAN',
+          },
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(oldState);
+  });
+
+  it('Updates Polygon ChainId (0x89) in ProviderConfig if exists, and ticker is set to MATIC', async () => {
+    const oldState = {
+      NetworkController: {
+        providerConfig: {
+          chainId: '0x89',
+          ticker: 'MATIC',
+        },
+      },
+    };
+
+    const expectedState = {
+      NetworkController: {
+        providerConfig: {
+          chainId: '0x89',
+          ticker: 'POL',
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(expectedState);
+  });
+
+  it('Does nothing if Polygon ChainId (0x89) is not in providerConfig', async () => {
+    const oldState = {
+      NetworkController: {
+        providerConfig: {
+          chainId: '0x1',
+          ticker: 'ETH',
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(oldState);
+  });
+
+  it('Does nothing if Polygon ChainId (0x89) is in providerConfig, but ticker is not MATIC', async () => {
+    const oldState = {
+      NetworkController: {
+        providerConfig: {
+          chainId: '0x89',
+          ticker: 'NOT_MATIC',
+        },
+      },
+    };
+
+    const transformedState = await migrate({
+      meta: { version: oldVersion },
+      data: oldState,
+    });
+
+    expect(transformedState.data).toStrictEqual(oldState);
+  });
+});

app/scripts/migrations/128.ts

@@ -0,0 +1,66 @@
+import { hasProperty, isObject } from '@metamask/utils';
+import { cloneDeep } from 'lodash';
+import { CHAIN_IDS } from '../../../shared/constants/network';
+
+export const version = 128;
+
+type VersionedData = {
+  meta: { version: number };
+  data: Record<string, unknown>;
+};
+
+/**
+ * Migrates MATIC ticker in Network Configuration to POL ticker as per the direction in https://polygon.technology/blog/save-the-date-matic-pol-migration-coming-september-4th-everything-you-need-to-know
+ *
+ * @param originalVersionedData - Versioned MetaMask extension state, exactly what we persist to dist.
+ * @param originalVersionedData.meta - State metadata.
+ * @param originalVersionedData.meta.version - The current state version.
+ * @param originalVersionedData.data - The persisted MetaMask state, keyed by controller.
+ * @returns Updated versioned MetaMask extension state.
+ */
+export async function migrate(
+  originalVersionedData: VersionedData,
+): Promise<VersionedData> {
+  const versionedData = cloneDeep(originalVersionedData);
+  versionedData.meta.version = version;
+  transformState(versionedData.data);
+  return versionedData;
+}
+
+function transformState(state: Record<string, unknown>) {
+  const networkControllerState = state.NetworkController;
+  if (
+    hasProperty(state, 'NetworkController') &&
+    isObject(networkControllerState) &&
+    hasProperty(networkControllerState, 'networkConfigurations') &&
+    isObject(networkControllerState.networkConfigurations)
+  ) {
+    for (const networkConfiguration of Object.values(
+      networkControllerState.networkConfigurations,
+    )) {
+      if (
+        isObject(networkConfiguration) &&
+        networkConfiguration.chainId === CHAIN_IDS.POLYGON &&
+        networkConfiguration.ticker === 'MATIC'
+      ) {
+        networkConfiguration.ticker = 'POL';
+      }
+    }
+  }
+
+  if (
+    hasProperty(state, 'NetworkController') &&
+    isObject(networkControllerState) &&
+    hasProperty(networkControllerState, 'providerConfig') &&
+    isObject(networkControllerState.providerConfig) &&
+    hasProperty(networkControllerState.providerConfig, 'chainId') &&
+    networkControllerState.providerConfig.chainId === CHAIN_IDS.POLYGON &&
+    networkControllerState.providerConfig.ticker === 'MATIC'
+  ) {
+    networkControllerState.providerConfig.ticker = 'POL';
+  }
+  return {
+    ...state,
+    NetworkController: networkControllerState,
+  };
+}

app/scripts/migrations/index.js

@@ -144,6 +144,7 @@ const migrations = [
   require('./125'),
   require('./126'),
   require('./127'),
+  require('./128'),
 ];
 
 export default migrations;

shared/constants/network.ts

@@ -295,6 +295,7 @@ export const CURRENCY_SYMBOLS = {
   HARMONY: 'ONE',
   PALM: 'PALM',
   MATIC: 'MATIC',
+  POL: 'POL',
   TEST_ETH: 'TESTETH',
   USDC: 'USDC',
   USDT: 'USDT',
@@ -368,6 +369,7 @@ const CHAINLIST_CURRENCY_SYMBOLS_MAP = {
 export const CHAINLIST_CURRENCY_SYMBOLS_MAP_NETWORK_COLLISION = {
   WETHIO: 'ZYN',
   CHZ: 'CHZ',
+  MATIC: 'POL',
 };
 
 export const ETH_TOKEN_IMAGE_URL = './images/eth_logo.svg';
@@ -376,7 +378,7 @@ export const LINEA_SEPOLIA_TOKEN_IMAGE_URL = './images/linea-logo-testnet.png';
 export const LINEA_MAINNET_TOKEN_IMAGE_URL = './images/linea-logo-mainnet.svg';
 export const TEST_ETH_TOKEN_IMAGE_URL = './images/black-eth-logo.svg';
 export const BNB_TOKEN_IMAGE_URL = './images/bnb.svg';
-export const MATIC_TOKEN_IMAGE_URL = './images/matic-token.svg';
+export const POL_TOKEN_IMAGE_URL = './images/pol-token.svg';
 export const AVAX_TOKEN_IMAGE_URL = './images/avax-token.svg';
 export const AETH_TOKEN_IMAGE_URL = './images/arbitrum.svg';
 export const FTM_TOKEN_IMAGE_URL = './images/fantom-opera.svg';
@@ -563,7 +565,7 @@ export const CHAIN_ID_TO_CURRENCY_SYMBOL_MAP = {
   [CHAINLIST_CHAIN_IDS_MAP.MAINNET]: CHAINLIST_CURRENCY_SYMBOLS_MAP.ETH,
   [CHAINLIST_CHAIN_IDS_MAP.OPBNB]: CHAINLIST_CURRENCY_SYMBOLS_MAP.OPBNB,
   [CHAINLIST_CHAIN_IDS_MAP.OPTIMISM]: CHAINLIST_CURRENCY_SYMBOLS_MAP.OPTIMISM,
-  [CHAINLIST_CHAIN_IDS_MAP.POLYGON]: CHAINLIST_CURRENCY_SYMBOLS_MAP.MATIC,
+  [CHAINLIST_CHAIN_IDS_MAP.POLYGON]: CHAINLIST_CURRENCY_SYMBOLS_MAP.POL,
   [CHAINLIST_CHAIN_IDS_MAP.ZKSYNC_ERA]:
     CHAINLIST_CURRENCY_SYMBOLS_MAP.ZKSYNC_ERA,
   [CHAINLIST_CHAIN_IDS_MAP.GOERLI]:
@@ -713,7 +715,7 @@ export const CHAIN_ID_TO_NETWORK_IMAGE_URL_MAP = {
   [CHAIN_IDS.LINEA_MAINNET]: LINEA_MAINNET_TOKEN_IMAGE_URL,
   [CHAIN_IDS.AVALANCHE]: AVAX_TOKEN_IMAGE_URL,
   [CHAIN_IDS.BSC]: BNB_TOKEN_IMAGE_URL,
-  [CHAIN_IDS.POLYGON]: MATIC_TOKEN_IMAGE_URL,
+  [CHAIN_IDS.POLYGON]: POL_TOKEN_IMAGE_URL,
   [CHAIN_IDS.ARBITRUM]: AETH_TOKEN_IMAGE_URL,
   [CHAIN_IDS.FANTOM]: FTM_TOKEN_IMAGE_URL,
   [CHAIN_IDS.HARMONY]: HARMONY_ONE_TOKEN_IMAGE_URL,
@@ -790,7 +792,7 @@ export const CHAIN_ID_TOKEN_IMAGE_MAP = {
   [CHAIN_IDS.MAINNET]: ETH_TOKEN_IMAGE_URL,
   [CHAIN_IDS.TEST_ETH]: TEST_ETH_TOKEN_IMAGE_URL,
   [CHAIN_IDS.BSC]: BNB_TOKEN_IMAGE_URL,
-  [CHAIN_IDS.POLYGON]: MATIC_TOKEN_IMAGE_URL,
+  [CHAIN_IDS.POLYGON]: POL_TOKEN_IMAGE_URL,
   [CHAIN_IDS.AVALANCHE]: AVAX_TOKEN_IMAGE_URL,
   [CHAIN_IDS.OPTIMISM]: ETH_TOKEN_IMAGE_URL,
   [CHAIN_IDS.CELO]: CELO_TOKEN_IMAGE_URL,
@@ -965,10 +967,10 @@ export const FEATURED_RPCS: RPCDefinition[] = [
     chainId: CHAIN_IDS.POLYGON,
     nickname: `${POLYGON_DISPLAY_NAME} ${capitalize(NETWORK_TYPES.MAINNET)}`,
     rpcUrl: `https://polygon-mainnet.infura.io/v3/${infuraProjectId}`,
-    ticker: CURRENCY_SYMBOLS.MATIC,
+    ticker: CURRENCY_SYMBOLS.POL,
     rpcPrefs: {
       blockExplorerUrl: 'https://polygonscan.com/',
-      imageUrl: MATIC_TOKEN_IMAGE_URL,
+      imageUrl: POL_TOKEN_IMAGE_URL,
     },
   },
   {

shared/constants/swaps.ts

@@ -2,7 +2,7 @@ import {
   ETH_TOKEN_IMAGE_URL,
   TEST_ETH_TOKEN_IMAGE_URL,
   BNB_TOKEN_IMAGE_URL,
-  MATIC_TOKEN_IMAGE_URL,
+  POL_TOKEN_IMAGE_URL,
   AVAX_TOKEN_IMAGE_URL,
   CURRENCY_SYMBOLS,
   CHAIN_IDS,
@@ -74,7 +74,7 @@ export const MATIC_SWAPS_TOKEN_OBJECT: SwapsTokenObject = {
   name: 'Matic',
   address: DEFAULT_TOKEN_ADDRESS,
   decimals: 18,
-  iconUrl: MATIC_TOKEN_IMAGE_URL,
+  iconUrl: POL_TOKEN_IMAGE_URL,
 } as const;
 
 export const AVAX_SWAPS_TOKEN_OBJECT: SwapsTokenObject = {

ui/components/multichain/network-list-item/__snapshots__/network-list-item.test.js.snap

@@ -11,7 +11,7 @@ exports[`NetworkListItem renders properly 1`] = `
       <img
         alt="Polygon logo"
         class="mm-avatar-network__network-image"
-        src="./images/matic-token.svg"
+        src="./images/pol-token.svg"
       />
     </div>
     <div