clean and fix discrepancy between injected keyword and specific extension

apps/remix-ide/src/app/providers/injected-provider-default.tsx

@@ -25,7 +25,7 @@ export class InjectedProviderDefaultBase extends InjectedProvider {
 }
 
 const profile = {
-  name: 'injected',
+  name: 'injected', // the name will be overwritten in the constructor.
   displayName: 'Injected Provider',
   kind: 'provider',
   description: 'injected Provider',

apps/remix-ide/src/app/udapp/run-tab.js

@@ -155,26 +155,28 @@ export class RunTab extends ViewPlugin {
       })
     }
 
-    const addCustomInjectedProvider = async (position, event, name, networkId, urls, nativeCurrency) => {
+    const addCustomInjectedProvider = async (position, event, name, displayName, networkId, urls, nativeCurrency) => {
       // name = `${name} through ${event.detail.info.name}`
       await this.engine.register([new InjectedCustomProvider(event.detail.provider, name, networkId, urls, nativeCurrency)])
-      await addProvider(position, name, name, true, false, false)
+      await addProvider(position, name, displayName, true, false, false)
     }
     const registerInjectedProvider = async (event) => {
       console.log('registerInjectedProvider', event)
-      await this.engine.register([new InjectedProviderDefault(event.detail.provider, event.detail.info.name)])
-      await addProvider(0, event.detail.info.name, 'Injected Provider - ' + event.detail.info.name, true, false, false)
+      const name = 'injected-' + event.detail.info.name
+      const displayName = 'Injected Provider - ' + event.detail.info.name
+      await this.engine.register([new InjectedProviderDefault(event.detail.provider, name)])
+      await addProvider(0, name, displayName, true, false, false)
 
       if (event.detail.info.name === 'MetaMask') {
-        await addCustomInjectedProvider(5, event, 'L2 - Optimism', '0xa', ['https://mainnet.optimism.io'])
-        await addCustomInjectedProvider(6, event, 'L2 - Arbitrum One', '0xa4b1', ['https://arb1.arbitrum.io/rpc'])    
-        await addCustomInjectedProvider(7, event, 'Sepolia Testnet', '0xaa36a7', [],
+        await addCustomInjectedProvider(5, event, 'injected-metamask-optimism', 'L2 - Optimism', '0xa', ['https://mainnet.optimism.io'])
+        await addCustomInjectedProvider(6, event, 'injected-metamask-arbitrum', '0xa4b1', ['https://arb1.arbitrum.io/rpc'])    
+        await addCustomInjectedProvider(7, event, 'injected-metamask-sepolia', '0xaa36a7', [],
           {
             "name": "Sepolia ETH",
             "symbol": "ETH",
             "decimals": 18
           })    
-        await addCustomInjectedProvider(8, event, 'Ephemery Testnet', '', ['https://otter.bordel.wtf/erigon', 'https://eth.ephemeral.zeus.fyi'],
+        await addCustomInjectedProvider(8, event, 'injected-metamask-ephemery', 'Ephemery Testnet', '', ['https://otter.bordel.wtf/erigon', 'https://eth.ephemeral.zeus.fyi'],
           {
             "name": "Ephemery ETH",
             "symbol": "ETH",

apps/remix-ide/src/blockchain/blockchain.tsx

@@ -61,6 +61,7 @@ export class Blockchain extends Plugin {
   }
   providers: {[key: string]: VMProvider | InjectedProvider | NodeProvider}
   transactionContextAPI: TransactionContextAPI
+  registeredPluginEvents: string[]
 
   // NOTE: the config object will need to be refactored out in remix-lib
   constructor(config: Config) {
@@ -91,6 +92,7 @@ export class Blockchain extends Plugin {
 
     this.networkcallid = 0
     this.networkStatus = {network: {name: ' - ', id: ' - '}}
+    this.registeredPluginEvents = []
     this.setupEvents()
     this.setupProviders()
   }
@@ -103,34 +105,23 @@ export class Blockchain extends Plugin {
 
   onActivation() {
     this.active = true
-    this.on('injected', 'chainChanged', () => {
-      this.detectNetwork((error, network) => {
-        this.networkStatus = {network, error}
-        this._triggerEvent('networkStatus', [this.networkStatus])
-      })
-    })
-
-    this.on('injected-trustwallet', 'chainChanged', () => {
-      this.detectNetwork((error, network) => {
-        this.networkStatus = {network, error}
-        this._triggerEvent('networkStatus', [this.networkStatus])
-      })
-    })
-
-    this.on('walletconnect', 'chainChanged', () => {
-      this.detectNetwork((error, network) => {
-        this.networkStatus = {network, error}
-        this._triggerEvent('networkStatus', [this.networkStatus])
-      })
+    this.on('manager', 'pluginActivated', (plugin) => {
+      if (plugin && plugin.name && (plugin.name.startsWith('injected') || plugin.name === 'walletconnect')) {
+        this.on(plugin.name, 'chainChanged', () => {
+          this.detectNetwork((error, network) => {
+            this.networkStatus = {network, error}
+            this._triggerEvent('networkStatus', [this.networkStatus])
+          })
+        })
+      }
     })
   }
 
   onDeactivation() {
     this.active = false
-    this.off('injected', 'chainChanged')
-    this.off('injected-trustwallet', 'chainChanged')
-    this.off('walletconnect', 'chainChanged')
-    this.off('walletconnect', 'accountsChanged')
+    for (const plugin of this.registeredPluginEvents) {
+      this.off(plugin, 'chainChanged')
+    }
   }
 
   setupEvents() {
@@ -175,6 +166,7 @@ export class Blockchain extends Plugin {
   getCurrentProvider() {
     const provider = this.getProvider()
     if (provider && provider.startsWith('vm')) return this.providers['vm']
+    if (provider && provider.startsWith('injected')) return this.providers['injected']
     if (this.providers[provider]) return this.providers[provider]
     return this.providers.web3 // default to the common type of provider
   }
@@ -534,16 +526,6 @@ export class Blockchain extends Plugin {
     return this.executionContext.getCurrentFork()
   }
 
-  isWeb3Provider() {
-    const isVM = this.executionContext.isVM()
-    const isInjected = this.getProvider() === 'injected'
-    return !isVM && !isInjected
-  }
-
-  isInjectedWeb3() {
-    return this.getProvider() === 'injected'
-  }
-
   signMessage(message, account, passphrase, cb) {
     this.getCurrentProvider().signMessage(message, account, passphrase, cb)
   }

apps/remix-ide/src/blockchain/providers/injected.ts

@@ -48,8 +48,4 @@ export class InjectedProvider {
       cb(e.message)
     }
   }
-
-  getProvider () {
-    return 'injected'
-  }
 }

apps/remix-ide/src/blockchain/providers/node.ts

@@ -55,8 +55,4 @@ export class NodeProvider {
       cb(e.message)
     }
   }
-
-  getProvider () {
-    return this.executionContext.getProvider()
-  }
 }

apps/remix-ide/src/blockchain/providers/vm.ts

@@ -134,9 +134,5 @@ export class VMProvider {
     this.web3.eth.sign(message, account)
       .then(signedData => cb(null, bytesToHex(messageHash), signedData))
       .catch(error => cb(error))
-  }
-
-  getProvider () {
-    return this.executionContext.getProvider()
-  }
+  }  
 }

apps/remix-ide/src/remixAppManager.js

@@ -52,7 +52,6 @@ let requiredModules = [ // services + layout views + system views
   'ganache-provider',
   'foundry-provider',
   'basic-http-provider',
-  'injected',
   'injected-trustwallet',
   'injected-optimism-provider',
   'injected-arbitrum-one-provider',
@@ -122,7 +121,6 @@ export function isNative(name) {
     'injected-arbitrum-one-provider',
     'injected-skale-chaos-testnet-provider',
     'injected-ephemery-testnet-provider',
-    'injected',
     'doc-gen',
     'doc-viewer',
     'circuit-compiler',

libs/remix-ui/debugger-ui/src/lib/debugger-ui.tsx

@@ -106,7 +106,7 @@ export const DebuggerUI = (props: DebuggerUIProps) => {
     const providerChanged = () => {
       debuggerModule.onEnvChanged((provider) => {
         setState((prevState) => {
-          const isLocalNodeUsed = !provider.startsWith('vm') && provider !== 'injected'
+          const isLocalNodeUsed = !provider.startsWith('vm') && !provider.startsWith('injected')
           return {...prevState, isLocalNodeUsed: isLocalNodeUsed}
         })
       })

libs/remix-ui/run-tab/src/lib/actions/account.ts

@@ -30,7 +30,7 @@ export const fillAccountsList = async (plugin: RunTab, dispatch: React.Dispatch<
       }
       const provider = plugin.blockchain.getProvider()
 
-      if (provider === 'injected') {
+      if (provider && provider.startsWith('injected')) {
         const selectedAddress = plugin.blockchain.getInjectedWeb3Address()
         if (!(Object.keys(loadedAccounts).includes(toChecksumAddress(selectedAddress)))) setAccount(dispatch, null)
       }

libs/remix-ui/run-tab/src/lib/actions/events.ts

@@ -116,9 +116,29 @@ export const setupEvents = (plugin: RunTab, dispatch: React.Dispatch<any>) => {
     })
   })
 
-  plugin.on('manager', 'pluginActivated', (plugin: Plugin) => {
-    if (plugin.name === 'remixd') {
+  plugin.on('manager', 'pluginActivated', (activatedPlugin: Plugin) => {
+    if (activatedPlugin.name === 'remixd') {
       dispatch(setRemixDActivated(true))
+    } else {
+      if (activatedPlugin && activatedPlugin.name.startsWith('injected')) {
+        plugin.on(activatedPlugin.name, 'accountsChanged', (accounts: Array<string>) => {
+          const accountsMap = {}
+          accounts.map(account => { accountsMap[account] = shortenAddress(account, '0')})
+          dispatch(fetchAccountsListSuccess(accountsMap))
+        })
+      } else if (activatedPlugin && activatedPlugin.name === 'walletconnect') {
+        plugin.on('walletconnect', 'accountsChanged', async (accounts: Array<string>) => {
+          const accountsMap = {}
+      
+          await Promise.all(accounts.map(async (account) => {
+            const balance = await plugin.blockchain.getBalanceInEther(account)
+            const updated = shortenAddress(account, balance)
+      
+            accountsMap[account] = updated
+          }))
+          dispatch(fetchAccountsListSuccess(accountsMap))
+        })
+      }
     }
   })
 
@@ -150,29 +170,6 @@ export const setupEvents = (plugin: RunTab, dispatch: React.Dispatch<any>) => {
     dispatch(clearRecorderCount())
   })
 
-  plugin.on('injected', 'accountsChanged', (accounts: Array<string>) => {
-    const accountsMap = {}
-    accounts.map(account => { accountsMap[account] = shortenAddress(account, '0')})
-    dispatch(fetchAccountsListSuccess(accountsMap))
-  })
-
-  plugin.on('injected-trustwallet', 'accountsChanged', (accounts: Array<string>) => {
-    const accountsMap = {}
-    accounts.map(account => { accountsMap[account] = shortenAddress(account, '0')})
-    dispatch(fetchAccountsListSuccess(accountsMap))
-  })
-
-  plugin.on('walletconnect', 'accountsChanged', async (accounts: Array<string>) => {
-    const accountsMap = {}
-
-    await Promise.all(accounts.map(async (account) => {
-      const balance = await plugin.blockchain.getBalanceInEther(account)
-      const updated = shortenAddress(account, balance)
-
-      accountsMap[account] = updated
-    }))
-    dispatch(fetchAccountsListSuccess(accountsMap))
-  })
 
   setInterval(() => {
     fillAccountsList(plugin, dispatch)

libs/remix-ui/run-tab/src/lib/components/account.tsx

@@ -26,69 +26,69 @@ export function AccountUI(props: AccountProps) {
 
   useEffect(() => {
     props.setAccount('')
-    switch (selectExEnv) {
-    case 'injected':
+    if (selectExEnv && selectExEnv.startsWith('injected')) {
       setPlusOpt({
         classList: 'udapp_disableMouseEvents',
         title: intl.formatMessage({id: 'udapp.injectedTitle'})
       })
-      break
-        
-    case 'vm-cancun':
-      setPlusOpt({
-        classList: '',
-        title: intl.formatMessage({id: 'udapp.createNewAccount'})
-      })
-      break
-        
-    case 'vm-paris':
-      setPlusOpt({
-        classList: '',
-        title: intl.formatMessage({id: 'udapp.createNewAccount'})
-      })
-      break
-
-    case 'vm-london':
-      setPlusOpt({
-        classList: '',
-        title: intl.formatMessage({id: 'udapp.createNewAccount'})
-      })
-      break
-
-    case 'vm-berlin':
-      setPlusOpt({
-        classList: '',
-        title: intl.formatMessage({id: 'udapp.createNewAccount'})
-      })
-      break
-
-    case 'vm-shanghai':
-      setPlusOpt({
-        classList: '',
-        title: intl.formatMessage({id: 'udapp.createNewAccount'})
-      })
-      break
-
-    case 'web3':
-      if (!personalMode) {
-        setPlusOpt({
-          classList: 'disableMouseEvents',
-          title: intl.formatMessage({id: 'udapp.web3Title'})
-        })
-      } else {
-        setPlusOpt({
-          classList: '',
-          title: intl.formatMessage({id: 'udapp.createNewAccount'})
-        })
-      }
-      break
-
-    default:
-      setPlusOpt({
-        classList: 'disableMouseEvents',
-        title: intl.formatMessage({id: 'udapp.defaultTitle'}, {selectExEnv})
-      })
-    }
+    } else {
+      switch (selectExEnv) {           
+        case 'vm-cancun':
+          setPlusOpt({
+            classList: '',
+            title: intl.formatMessage({id: 'udapp.createNewAccount'})
+          })
+          break
+            
+        case 'vm-paris':
+          setPlusOpt({
+            classList: '',
+            title: intl.formatMessage({id: 'udapp.createNewAccount'})
+          })
+          break
+    
+        case 'vm-london':
+          setPlusOpt({
+            classList: '',
+            title: intl.formatMessage({id: 'udapp.createNewAccount'})
+          })
+          break
+    
+        case 'vm-berlin':
+          setPlusOpt({
+            classList: '',
+            title: intl.formatMessage({id: 'udapp.createNewAccount'})
+          })
+          break
+    
+        case 'vm-shanghai':
+          setPlusOpt({
+            classList: '',
+            title: intl.formatMessage({id: 'udapp.createNewAccount'})
+          })
+          break
+    
+        case 'web3':
+          if (!personalMode) {
+            setPlusOpt({
+              classList: 'disableMouseEvents',
+              title: intl.formatMessage({id: 'udapp.web3Title'})
+            })
+          } else {
+            setPlusOpt({
+              classList: '',
+              title: intl.formatMessage({id: 'udapp.createNewAccount'})
+            })
+          }
+          break
+    
+        default:
+          setPlusOpt({
+            classList: 'disableMouseEvents',
+            title: intl.formatMessage({id: 'udapp.defaultTitle'}, {selectExEnv})
+          })
+        }
+    }    
   }, [selectExEnv, personalMode])
 
   const newAccount = () => {

libs/remix-ui/run-tab/src/lib/components/universalDappUI.tsx

@@ -297,7 +297,7 @@ export function UniversalDappUI(props: UdappProps) {
             <label>
               <b><FormattedMessage id="udapp.balance" />:</b> {instanceBalance} ETH
             </label>
-            {props.exEnvironment === 'injected' && <i className="fas fa-edit btn btn-sm p-0" onClick={() => {props.editInstance(props.instance)}}></i>}
+            {props.exEnvironment.indexOf('Injected Provider') > -1 && <i className="fas fa-edit btn btn-sm p-0" onClick={() => {props.editInstance(props.instance)}}></i>}
           </div>
           { props.isPinnedContract && props.instance.pinnedAt ? (
             <div className="d-flex" data-id="instanceContractPinnedAt">

libs/remix-ui/run-tab/src/lib/types/blockchain.d.ts

@@ -47,8 +47,6 @@ export class Blockchain extends Plugin<any, any> {
      * @return {String} - fork name
      */
   getCurrentFork(): string;
-  isWeb3Provider(): boolean;
-  isInjectedWeb3(): boolean;
   signMessage(message: any, account: any, passphrase: any, cb: any): void;
   web3(): any;
   getTxListener(opts: any): any;

libs/remix-ui/run-tab/src/lib/types/injected.d.ts

@@ -8,5 +8,4 @@ declare class InjectedProvider {
   getBalanceInEther(address: any): Promise<string>;
   getGasPrice(cb: any): void;
   signMessage(message: any, account: any, _passphrase: any, cb: any): void;
-  getProvider(): string;
 }

libs/remix-ui/run-tab/src/lib/types/node.d.ts

@@ -9,5 +9,4 @@ declare class NodeProvider {
   getBalanceInEther(address: any): Promise<string>;
   getGasPrice(cb: any): void;
   signMessage(message: any, account: any, passphrase: any, cb: any): void;
-  getProvider(): any;
 }

libs/remix-ui/run-tab/src/lib/types/vm.d.ts

@@ -12,5 +12,4 @@ declare class VMProvider {
   getBalanceInEther(address: any): Promise<string>;
   getGasPrice(cb: any): void;
   signMessage(message: any, account: any, _passphrase: any, cb: any): void;
-  getProvider(): string;
 }