Feature: Add support for injected wallet download URL for unavailable injected wallets

[Adamj1232]

Description

This PR adds the ability for a download or homepage link to be defined per injected wallet and displayed if that wallet is unavailable and selected by the user.
There is also a refinement to the init option displayUnavailable allowing an array to also be passed (along with still supporting a boolean to display all unavailable) to more easily define which wallets to display if unavailable. This all based on passing in ProviderLabel.${walletName} to the array.

This solves the problem of easily allowing dapps (often driven by partnerships with wallets) to easily choose which unavailable wallets to display.
Also, solving the issue of injected wallets creating separate modules just to get this functionality - with even less complexity for dapp devs to support the request.

There is also an update to the displayed message if a wallet is unavailable and selected and a URL is available hyperlinking the install text within the message displayed to the user.

/**
 * The ProviderExternalUrl enum represents the external URLs associated
 * with different injected providers. It is used to direct end users who
 * do not have a wallet installed to the corresponding wallet installation page.
 * For this to be displayed a dapp must set `displayUnavailable` 
 * to an array (to specify displayed unavailable wallets) or 
 * true (to display all unavailable wallets) and a user select that wallet.
 */
export enum ProviderExternalUrl {
  Binance = 'https://www.bnbchain.org/ru/blog/binance-extension-wallet/',
  Coinbase = 'https://www.coinbase.com/wallet/downloads',
  MetaMask = 'https://metamask.io/download/',
  Phantom = 'https://phantom.app/download',
  Talisman = 'https://www.talisman.xyz/',
  Trust = 'https://trustwallet.com/download/',
}

export interface InjectedWalletOptions {
  ...

  /**If set to true: Will display all unavailable injected wallets even if they
   * are not currently available to the end user.
   * If set to an array of ProviderLabel.walletLabel
   * those wallets will be the only unavailable injected wallets shown
   * For example [ProviderLabel.MetaMask, ProviderLabel.Trust] 
   */
  displayUnavailable?: boolean | string[]
}

export interface InjectedWalletModule extends WalletModule {
   ...

  /**  
   * A Url to link users to a download page for the wallet 
   * to be shown if not installed or available on the browser
  */
  externalUrl?: string
}

Example init usage (also seen in docs and README):

const injected = injectedModule({
    // display all unavailable injected wallets
    // displayUnavailable: true,
    // ||
    // display specific unavailable wallets
    displayUnavailable: [ProviderLabel.MetaMask, ProviderLabel.Trust],
    walletUnavailableMessage: wallet =>
      wallet.externalUrl
        ? `Oops ${wallet.label} is unavailable! Please <a href="${wallet.externalUrl}" target="_blank">install</a>`
        : `Oops ${wallet.label} is unavailable!`
 })

Resulting in:

Checklist

• Increment the version field in package.json of the package you have made changes in following semantic versioning and using alpha release tagging
• Check the box that allows repo maintainers to update this PR
• Test locally to make sure this feature/fix works
• Run yarn check-all to confirm there are not any associated errors
• Confirm this PR passes Circle CI checks
• Add or update relevant information in the documentation

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
web3-onboard-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 6, 2023 3:33pm

[leightkt]

Looks good- tested in the demo app and working as expected

[lnbc1QWFyb24]

Looks good. Nice work on this!

[socket-security]

New and updated dependency changes detected. Learn more about Socket for GitHub ↗︎

Packages		Version	New capabilities	Transitives1	Size	Publisher
@web3-onboard/core	🆕	2.19.2	None	+0	661 kB	cmeisl

Footnotes

1. https://docs.socket.dev ↩