Enhancement: Remove built in UnstoppableDomain resolution, create unstoppable-resolution package for opt in support (#1641)

* Add unstoppable resolution package and remove built in ability

* Add new package commit and docs

* Fix some docs links

* Remove deprecated prop from demo init

* Merge in dev

Author: Adamj1232

.circleci/config.yml

@@ -375,6 +375,12 @@ jobs:
     working_directory: ~/web3-onboard-monorepo/packages/taho
     steps:
       - node-build-steps
+  build-unstoppable-resolution:
+    docker:
+      - image: cimg/node:16.13.1
+    working_directory: ~/web3-onboard-monorepo/packages/unstoppable-resolution
+    steps:
+      - node-build-steps
 
   # Build staging/Alpha releases
   build-staging-core:
@@ -587,6 +593,12 @@ jobs:
     working_directory: ~/web3-onboard-monorepo/packages/taho
     steps:
       - node-staging-build-steps
+  build-staging-unstoppable-resolution:
+    docker:
+      - image: cimg/node:16.13.1
+    working_directory: ~/web3-onboard-monorepo/packages/unstoppable-resolution
+    steps:
+      - node-staging-build-steps
 
 workflows:
   version: 2
@@ -801,3 +813,9 @@ workflows:
           <<: *deploy_production_filters
       - build-staging-taho:
           <<: *deploy_staging_filters
+  unstoppable-resolution:
+    jobs:
+      - build-unstoppable-resolution:
+          <<: *deploy_production_filters
+      - build-staging-unstoppable-resolution:
+          <<: *deploy_staging_filters

.github/ISSUE_TEMPLATE/BUG.yml

@@ -1,6 +1,5 @@
 name: Bug Report
 description: File a bug report
-title: '[Bug]: '
 labels: [bug]
 assignees:
   - taylorjdawson

docs/src/routes/docs/[...3]modules/core.md

@@ -229,11 +229,10 @@ type ConnectModalOptions = {
    */
   wheresMyWalletLink?: string
   /**
-   * Define support for Unstoppable Domains resolutions
-   * after a user connects. Similar to ens, uns can be used for users who
-   * have minted an Unstoppable Domain and associated it with their wallet.
-   * ENS resolution takes precedent over UNS
-   * Defaults to false
+   * @deprecated Has no effect unless `@web3-onboard/unstoppable-resolution`
+   * package has been added and passed into the web3-onboard initialization
+   * In this case remove the `@web3-onboard/unstoppable-resolution` package
+   * to remove unstoppableDomain resolution support
    */
   disableUDResolution?: boolean
 }
@@ -429,7 +428,8 @@ unsubscribe()
 ```
 
 ##### **Notifications as Toast Messages**
-The Notifications messages can also be used to send fully customized Dapp toast messages and updated. Check out the [customNotifications API docs for examples and code snippets](#customnotification) 
+
+The Notifications messages can also be used to send fully customized Dapp toast messages and updated. Check out the [customNotifications API docs for examples and code snippets](#customnotification)
 
 ```ts
 type NotifyOptions = {
@@ -640,6 +640,7 @@ const onboard = Onboard({
 ```
 
 ---
+
 ## Connecting a Wallet
 
 To initiate a user to select and connect a wallet you can call the `connectWallet` function on an initialized Onboard instance. It will return a `Promise` that will resolve when the user either successfully connects a wallet, or when they dismiss the UI. The resolved value from the promise will be the latest state of the `wallets` array. The order of the wallets array is last to first, so the most recently selected wallet will be the first item in the array and can be thought of as the "primary wallet". If no wallet was selected, then the `wallets` array will have the same state as it had before calling `connectWallet`.
@@ -1016,7 +1017,7 @@ The `customNotification` method also returns a `dismiss` method that is called w
 
 #### **preflightNotifications**
 
-Notify can be used to deliver standard notifications along with preflight updates by passing a `PreflightNotificationsOptions` object to the `preflightNotifications` API action. 
+Notify can be used to deliver standard notifications along with preflight updates by passing a `PreflightNotificationsOptions` object to the `preflightNotifications` API action.
 
 <img src="{notifyPreflightImg}" alt="Preflight notifications image"/>
 
@@ -1033,6 +1034,7 @@ Preflight event types include:
 This API call will return a promise that resolves to the transaction hash (if `sendTransaction` resolves the transaction hash and is successful), the internal notification id (if no `sendTransaction` function is provided) or return nothing if an error occurs or `sendTransaction` is not provided or doesn't resolve to a string.
 
 Example:
+
 ```typescript copy
 const balanceValue = Object.values(balance)[0]
 // if using ethers v6 this is:
@@ -1544,7 +1546,7 @@ export default config
 
 ### SvelteKit + Vite
 
-Checkout a boilerplate example (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-sveltekit]
+Checkout a boilerplate example [here](https://github.com/blocknative/web3-onboard/tree/develop/examples/with-sveltekit)
 
 Add the following dev dependencies:
 
@@ -1657,7 +1659,7 @@ See [this github issue](https://github.com/blocknative/web3-onboard/issues/1568#
 
 ### Vite
 
-Checkout a boilerplate example for Vite-React (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-vite-react]
+Checkout a boilerplate example for Vite-React [here](https://github.com/blocknative/web3-onboard/tree/develop/examples/with-vite-react)
 
 Add the following dev dependencies:
 
@@ -1732,9 +1734,9 @@ build: {
 
 ### Next.js
 
-Checkout a boilerplate example for NextJS v13 (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-nextjs-13]
+Checkout a boilerplate example for NextJS v13 [here](https://github.com/blocknative/web3-onboard/tree/develop/examples/with-nextjs-13)
 
-Checkout a boilerplate example for NextJS (here)[https://github.com/blocknative/web3-onboard/tree/develop/examples/with-nextjs]
+Checkout a boilerplate example for NextJS [here](https://github.com/blocknative/web3-onboard/tree/develop/examples/with-nextjs)
 
 :::admonition type=note
 

docs/src/routes/docs/[...3]modules/unstoppable-resolution.md

@@ -0,0 +1,38 @@
+# Unstoppable Domains Resolution
+
+A module to add Unstoppable Domain resolution to web3-onboard.
+
+### Install
+
+<Tabs values={['yarn', 'npm']}>
+<TabPanel value="yarn">
+
+```sh copy
+yarn add @web3-onboard/unstoppable-resolution
+```
+
+  </TabPanel>
+  <TabPanel value="npm">
+
+```sh copy
+npm install @web3-onboard/unstoppable-resolution
+```
+
+  </TabPanel>
+</Tabs>
+
+### Standalone Setup
+
+```typescript
+import Onboard from '@web3-onboard/core'
+import unstoppableResolution from '@web3-onboard/unstoppable-resolution'
+
+const onboard = Onboard({
+  // ... other Onboard options
+  unstoppableResolution
+})
+```
+
+## Build Environments
+
+For build env configurations and setups please see the Build Env section [here](/docs/modules/core#build-environments)

packages/core/README.md

@@ -206,11 +206,10 @@ type ConnectModalOptions = {
    */
   wheresMyWalletLink?: string
   /**
-   * Define support for Unstoppable Domains resolutions
-   * after a user connects. Similar to ens, uns can be used for users who
-   * have minted an Unstoppable Domain and associated it with their wallet.
-   * ENS resolution takes precedent over UNS
-   * Defaults to false
+   * @deprecated Has no effect unless `@web3-onboard/unstoppable-resolution`
+   * package has been added and passed into the web3-onboard initialization
+   * In this case remove the `@web3-onboard/unstoppable-resolution` package
+   * to remove unstoppableDomain resolution support
    */
   disableUDResolution?: boolean
 }

packages/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/core",
-  "version": "2.16.2",
+  "version": "2.17.0-alpha.1",
   "description": "Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardized spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
   "keywords": [
     "Ethereum",
@@ -71,6 +71,7 @@
     "@typescript-eslint/parser": "^4.31.1",
     "@web3-onboard/gas": "^2.1.5",
     "@web3-onboard/transaction-preview": "^2.0.5",
+    "@web3-onboard/unstoppable-resolution": "^2.0.0-alpha.1",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-svelte3": "^3.2.1",
@@ -84,7 +85,6 @@
     "typescript": "^4.5.5"
   },
   "dependencies": {
-    "@unstoppabledomains/resolution": "^8.0",
     "@web3-onboard/common": "^2.3.1",
     "bignumber.js": "^9.0.0",
     "bnc-sdk": "^4.6.7",

packages/core/src/configuration.ts

@@ -9,7 +9,8 @@ export let configuration: Configuration = {
   initialWalletInit: [],
   gas: null,
   containerElements: { accountCenter: null, connectModal: null },
-  transactionPreview: null
+  transactionPreview: null,
+  unstoppableResolution: null
 }
 
 export function updateConfiguration(update: Partial<Configuration>): void {

packages/core/src/index.ts

@@ -97,7 +97,8 @@ function init(options: InitOptions): OnboardAPI {
     containerElements,
     transactionPreview,
     theme,
-    disableFontDownload
+    disableFontDownload,
+    unstoppableResolution
   } = options
 
   if (containerElements) updateConfiguration({ containerElements })
@@ -205,7 +206,8 @@ function init(options: InitOptions): OnboardAPI {
     apiKey,
     initialWalletInit: wallets,
     gas,
-    transactionPreview
+    transactionPreview,
+    unstoppableResolution
   })
 
   if (apiKey && transactionPreview) {

packages/core/src/provider.ts

@@ -9,6 +9,7 @@ import { validEnsChain } from './utils.js'
 import disconnect from './disconnect.js'
 import { state } from './store/index.js'
 import { getBNMulitChainSdk } from './services.js'
+import { configuration } from './configuration.js'
 
 import type {
   ChainId,
@@ -26,11 +27,12 @@ import type {
   Address,
   Balances,
   Ens,
-  Uns,
   WalletPermission,
   WalletState
 } from './types.js'
 
+import type { Uns } from '@web3-onboard/unstoppable-resolution'
+
 export const ethersProviders: {
   [key: string]: providers.StaticJsonRpcProvider
 } = {}
@@ -383,27 +385,14 @@ export async function getUns(
   address: Address,
   chain: Chain
 ): Promise<Uns | null> {
-  const { connect } = state.get()
+  const { unstoppableResolution } = configuration
 
   // check if address is valid ETH address before attempting to resolve
   // chain we don't recognize and don't have a rpcUrl for requests
-  if (connect.disableUDResolution || !utils.isAddress(address) || !chain)
-    return null
+  if (!unstoppableResolution || !utils.isAddress(address) || !chain) return null
 
   try {
-    let uns = null
-    const { Resolution } = await import('@unstoppabledomains/resolution')
-
-    const resolutionInstance = new Resolution()
-    const name = await resolutionInstance.reverse(address)
-
-    if (name) {
-      uns = {
-        name
-      }
-    }
-
-    return uns
+    return await unstoppableResolution(address)
   } catch (error) {
     console.error(error)
     return null

packages/core/src/types.ts

@@ -12,6 +12,7 @@ import type {
 } from '@web3-onboard/common'
 
 import type gas from '@web3-onboard/gas'
+import type unstoppableResolution from '@web3-onboard/unstoppable-resolution'
 import type { TransactionPreviewAPI } from '@web3-onboard/transaction-preview'
 
 import type en from './i18n/en.json'
@@ -77,6 +78,13 @@ export interface InitOptions {
    * the Theme initialization object or set as css variable
    */
   disableFontDownload?: boolean
+  /**
+   * Type of unstoppableResolution module
+   * A small module that can bee added to allow Unstoppable Domain
+   * address resolution similar to that of ens (Ethereum Name Service)
+   * ENS resolution will take president if available
+   */
+  unstoppableResolution?: typeof unstoppableResolution
 }
 
 export type Theme = ThemingMap | BuiltInThemes | 'system'
@@ -176,6 +184,7 @@ export type Configuration = {
   gas?: typeof gas
   containerElements?: ContainerElements
   transactionPreview?: TransactionPreviewAPI
+  unstoppableResolution?: typeof unstoppableResolution
 }
 
 export type Locale = string
@@ -193,15 +202,15 @@ export type ConnectModalOptions = {
    * Defaults to false
    */
   disableClose?: boolean
-  /** 
-   * If set to true, the most recently connected wallet will store in 
-   * local storage. Then on init, onboard will try to reconnect to 
+  /**
+   * If set to true, the most recently connected wallet will store in
+   * local storage. Then on init, onboard will try to reconnect to
    * that wallet with no modals displayed
    */
   autoConnectLastWallet?: boolean
-  /** 
-   * If set to true, all previously connected wallets will store in 
-   * local storage. Then on init, onboard will try to reconnect to 
+  /**
+   * If set to true, all previously connected wallets will store in
+   * local storage. Then on init, onboard will try to reconnect to
    * each wallet with no modals displayed
    */
   autoConnectAllPreviousWallet?: boolean
@@ -219,11 +228,10 @@ export type ConnectModalOptions = {
    */
   wheresMyWalletLink?: string
   /**
-   * Define support for Unstoppable Domains resolutions
-   * after a user connects. Similar to ens, uns can be used for users who
-   * have minted an Unstoppable Domain and associated it with their wallet.
-   * ENS resolution takes precedent over UNS
-   * Defaults to false
+   * @deprecated Has no effect unless `@web3-onboard/unstoppable-resolution`
+   * package has been added and passed into the web3-onboard initialization
+   * In this case remove the `@web3-onboard/unstoppable-resolution` package
+   * to remove unstoppableDomain resolution support
    */
   disableUDResolution?: boolean
 }
@@ -315,7 +323,7 @@ export type Notification = {
    */
   message: string
   /**
-   * handle codes in your own way - see codes here under the notify 
+   * handle codes in your own way - see codes here under the notify
    * prop default en file at ./packages/core/src/i18n/en.json
    */
   eventCode: string
@@ -324,14 +332,14 @@ export type Notification = {
    */
   type: NotificationType
   /**
-   * time (in ms) after which the notification will be dismissed. If set 
-   * to `0` the notification will remain on screen until the user dismisses the 
-   * notification, refreshes the page or navigates away from the site 
+   * time (in ms) after which the notification will be dismissed. If set
+   * to `0` the notification will remain on screen until the user dismisses the
+   * notification, refreshes the page or navigates away from the site
    * with the notifications
    */
   autoDismiss: number
   /**
-   * add link to the transaction hash. For instance, a link to the 
+   * add link to the transaction hash. For instance, a link to the
    * transaction on etherscan
    */
   link?: string
@@ -394,7 +402,7 @@ export type Action =
   | UpdateConnectModalAction
 
 export type AddChainsAction = { type: 'add_chains'; payload: Chain[] }
-export type UpdateChainsAction = { type: 'update_chains'; payload: Chain}
+export type UpdateChainsAction = { type: 'update_chains'; payload: Chain }
 export type AddWalletAction = { type: 'add_wallet'; payload: WalletState }
 
 export type UpdateWalletAction = {