diff --git a/docs/guides/build-wallet.md b/docs/guides/build-wallet.md index 9c06d4eba6..e8dfce1f43 100644 --- a/docs/guides/build-wallet.md +++ b/docs/guides/build-wallet.md @@ -18,8 +18,7 @@ First you need to create a bridge between your extension and the page. This can ```js import browser from 'webextension-polyfill' import { - BrowserRuntimeConnection, BrowserWindowMessageConnection, MESSAGE_DIRECTION, - ContentScriptBridge + BrowserRuntimeConnection, BrowserWindowMessageConnection, MESSAGE_DIRECTION, connectionProxy } from '@aeternity/aepp-sdk' const readyStateCheckInterval = setInterval(function () { @@ -27,15 +26,14 @@ const readyStateCheckInterval = setInterval(function () { clearInterval(readyStateCheckInterval) const port = browser.runtime.connect() - const extConnection = BrowserRuntimeConnection({ port }) - const pageConnection = BrowserWindowMessageConnection({ + const extConnection = new BrowserRuntimeConnection({ port }) + const pageConnection = new BrowserWindowMessageConnection({ + target: window, origin: window.origin, sendDirection: MESSAGE_DIRECTION.to_aepp, receiveDirection: MESSAGE_DIRECTION.to_waellet }) - - const bridge = ContentScriptBridge({ pageConnection, extConnection }) - bridge.run() + connectionProxy(pageConnection, extConnection) } }, 10) ``` @@ -106,7 +104,7 @@ async function init () { }).then(wallet => { chrome.runtime.onConnect.addListener(async function (port) { // create connection - const connection = await BrowserRuntimeConnection({ port }) + const connection = new BrowserRuntimeConnection({ port }) // add new aepp to wallet wallet.addRpcClient(connection) // share wallet details @@ -190,7 +188,7 @@ async function init () { }).then(wallet => { chrome.runtime.onConnect.addListener(async function (port) { // create connection - const connection = await BrowserRuntimeConnection({ port }) + const connection = new BrowserRuntimeConnection({ port }) // add new aepp to wallet wallet.addRpcClient(connection) // share wallet details @@ -206,7 +204,7 @@ init().then(_ => console.log('Wallet initialized!')) ``` ## iFrame-based Wallet -The **iFrame-based** approach works similar to the **WebExtension** approach except that the `ContentScriptBridge` in between isn't needed. +The **iFrame-based** approach works similar to the **WebExtension** approach except that the `connectionProxy` in between isn't needed. You can take a look into the implementation of the following example to see how it works: diff --git a/docs/guides/connect-aepp-to-wallet.md b/docs/guides/connect-aepp-to-wallet.md index 8d3da3fb97..e6190dfb8a 100644 --- a/docs/guides/connect-aepp-to-wallet.md +++ b/docs/guides/connect-aepp-to-wallet.md @@ -10,7 +10,7 @@ You can build your own wallet in the next example ## 1. Specify imports and constants and state ```js -import { RpcAepp, WalletDetector, BrowserWindowMessageConnection, Node } from '@aeternity/aepp-sdk' +import { RpcAepp, walletDetector, BrowserWindowMessageConnection, Node } from '@aeternity/aepp-sdk' const TESTNET_NODE_URL = 'https://testnet.aeternity.io' const MAINNET_NODE_URL = 'https://mainnet.aeternity.io' @@ -62,16 +62,13 @@ methods: { const handleWallets = async function ({ wallets, newWallet }) { newWallet = newWallet || Object.values(wallets)[0] if (confirm(`Do you want to connect to wallet ${newWallet.name}`)) { - detector.stopScan() + stopScan() // connect to the wallet, see step 4. await this.connect(newWallet) } } - - const scannerConnection = BrowserWindowMessageConnection() - - const detector = await WalletDetector({ connection: scannerConnection }) - detector.scan(handleWallets.bind(this)) + const scannerConnection = new BrowserWindowMessageConnection() + const stopScan = walletDetector(scannerConnection, handleWallets.bind(this)) } } ``` diff --git a/docs/guides/error-handling.md b/docs/guides/error-handling.md index 5ff39706a5..57c17cb464 100644 --- a/docs/guides/error-handling.md +++ b/docs/guides/error-handling.md @@ -98,7 +98,6 @@ BaseError │ └̌───WalletError │ │ AlreadyConnectedError -│ │ MessageDirectionError │ │ NoWalletConnectedError │ │ RpcConnectionError ``` diff --git a/examples/browser/aepp/src/Connect.vue b/examples/browser/aepp/src/Connect.vue index 8c8f519ebf..9b9f027b8c 100644 --- a/examples/browser/aepp/src/Connect.vue +++ b/examples/browser/aepp/src/Connect.vue @@ -40,7 +40,7 @@