forked from aurora-is-near/doc.aurora.dev
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add AuroraPass documentation (aurora-is-near#96)
* Add AuroraPass documentation * Fix linting errors * Fix spellcheck errors * v2 of the AP docs * Fix linter + rename Aurora Chains article * Spellcheck * Grammarly Applied * Grammarly Clarity rewrites applied * Merge Integration Example Page with Web3Modal - Fix Discord invite link - Add Troubleshooting sections to every other page
- Loading branch information
Showing
25 changed files
with
696 additions
and
17 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,67 @@ | ||
| --- | ||
| title: "Introduction" | ||
| --- | ||
|
|
||
| # Aurora Pass | ||
|
|
||
| Aurora Pass is a mobile cryptocurrency wallet that makes your interactions with Aurora or any of the Aurora Chains easier than ever, whether transferring your assets or using a DApp. | ||
| It also helps onboard your users, even ones unfamiliar with the Web3 ecosystem. | ||
|
|
||
| ## Key Features | ||
|
|
||
| - Simple and user-friendly interface. | ||
| - 50 free transactions for each user per month. | ||
| - Secure and non-custodial wallet. | ||
| - Send and receive assets on Aurora Mainnet and Aurora Chains. | ||
| - View your portfolio balances and recent transactions. | ||
| - Connect to DApps via WalletConnect v2. | ||
|
|
||
| ## Integration | ||
|
|
||
| Connecting Aurora Pass to a DApp is done like every other EVM wallet implementing a [WalletConnect v2](https://docs.walletconnect.com/). | ||
| See more info on configuring or adding WalletConnect [here](/onboard/wallet-connect). | ||
|
|
||
| We propose two options for displaying the wallets for your users: Web3Modal or Rainbow Kit. You can follow the step-by-step integration examples here: | ||
|
|
||
| - [Web3Modal Example](/onboard/wallets/web3modal#integrate-web3modal) | ||
| - [RainbowKit Example](/onboard/wallets/rainbowkit#integrate-rainbowkit) | ||
|
|
||
| That will help you to understand better how the different components work together. E.g., wallet modals, promo widgets and UI frameworks. | ||
|
|
||
| ## Promo Widget | ||
|
|
||
| Add a [Promo Widget](/onboard/promo-widget) to your DApp to allow new users to install Aurora Pass quickly. | ||
| It will direct a user to download the Aurora Pass application on a mobile phone in the most convenient way. | ||
|
|
||
| It is optional to add it to your DApp. Otherwise, you will need to implement some other way to lead users to the installation of the wallet. | ||
| We advise everyone to use it as an onboarding entry point in their DApps. | ||
|
|
||
| ## Free transactions | ||
|
|
||
| Aurora Pass requires a login with an email or Apple/Google auth, which will provide them with free transactions on Aurora Mainnet. | ||
| The basic plan for Aurora Pass users is 50 free transactions per month. This feature is achieved by using the Gasless Management feature of Aurora Chains. | ||
| At the same time, DApps can also pay for their users’ EOA transaction fees by getting their own gasless deal using our Gasless Management product. | ||
|
|
||
| If the monthly free transaction limit is reached or the transaction is not sponsored by a DApp, a pack of transactions can be purchased from within the Aurora Pass app. | ||
| Currently, only one transaction pack is available: 500 free transactions for around $4.99 (the price can depend on the country). | ||
|
|
||
| ## Security | ||
|
|
||
| Aurora Pass is a non-custodial crypto wallet, meaning the user will be given a 12-word recovery seed phrase that grants them access to their assets. | ||
|
|
||
| Users won’t have to save that seed phrase on signup as it is securely saved on the device but can choose to export it anytime. | ||
| Excluding such details provides better onboarding while also giving users the ownership of their assets in a non-custodial way. | ||
|
|
||
| The seed phrase is the only way to recover access to the wallet in case of loss or when installing the wallet on a new device. | ||
|
|
||
| Using the wallet requires biometric authentication (e.g., faceID or touchID). In case it is absent, the PIN code for a device will be used. | ||
| The seed phrase is stored using [expo-secure-store](https://docs.expo.dev/versions/latest/sdk/securestore/): | ||
|
|
||
| - on Android, values are stored in SharedPreferences, encrypted with Android’s Keystore system; | ||
| - on iOS, values are stored using the keychain services. | ||
|
|
||
| ## Troubleshooting | ||
|
|
||
| If you encounter any issues, please visit our [Troubleshooting Page](/onboard/troubleshooting) to find a solution. | ||
| In case you still have questions, please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT) | ||
| on Discord and open a support ticket there. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,3 @@ | ||
| --- | ||
| sidebar_label: Create your own wallet (AP Pro) | ||
| --- |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,118 @@ | ||
| --- | ||
| title: "Promo Widget" | ||
| --- | ||
|
|
||
| # Promo Widget | ||
|
|
||
| If you develop a DApp, you will need a way to get your users to install the Aurora Pass application on their phones. We have created a widget to simplify this step. | ||
| This modal leads a user to download the wallet application for iOS or Android by scanning a QR code: | ||
|
|
||
|  | ||
|
|
||
| Users can always say they already have the wallet installed, and this popup won't be shown for them next time. | ||
|
|
||
| ## Quick integration guide | ||
|
|
||
| 1. Load a script from this [link](https://pass.auroracloud.dev/promo.js), and import it to your project. | ||
| 2. This adds a function to the `window` object called `openPromo`. | ||
| 3. To open the widget, call `window.openPromo` and pass the `onComplete` function as a parameter `window.openPromo({ onComplete: function })` | ||
| 4. You can also check if the function is available before calling it `window.openPromo ? window.openPromo({ onComplete: function }) : function()` | ||
| 5. Optionally, you can hide the _Update your app_ header by passing the `hideUpdateAppBlock` variable via the `config` argument: | ||
| `window.openPromo({ onComplete: () => {...}, config: {hideUpdateAppBlock: true}})` | ||
|
|
||
| You can also find the same instructions [here](https://pass.auroracloud.dev/). | ||
| A more detailed example of integration is below. | ||
|
|
||
| ## Detailed integration guide | ||
|
|
||
| In the case of building a React app, you can add the `promo.js` script to it by using the `useEffect` hook like this: | ||
|
|
||
| ```jsx title="aurora-pass-example/src/App.js" | ||
| ... | ||
| import { useEffect } from "react"; | ||
|
|
||
| let scriptAdded = false; | ||
|
|
||
| function App() { | ||
| useEffect(() => { | ||
| if(!scriptAdded) { | ||
| const script = document.createElement("script"); | ||
| script.src = "https://pass.auroracloud.dev/promo.js"; | ||
| script.async = true; | ||
| document.body.appendChild(script); | ||
| } | ||
| }, []); | ||
|
|
||
| ... | ||
| } | ||
| ``` | ||
|
|
||
| :::note | ||
| We assume the project we're working on here is a default `create-react-app` application to simplify things. You can read more about it [here](https://create-react-app.dev/docs/getting-started/). | ||
| ::: | ||
|
|
||
| Then, let's add a function `openModal` to display our Promo Widget just after the imports somewhere: | ||
|
|
||
| ```jsx title="aurora-pass-example/src/App.js" | ||
| ... | ||
| const openWeb3Modal = () => { | ||
| alert("Just a placeholder for now. We will add Web3Modal here later.") | ||
| }; | ||
|
|
||
| const openWidget = () => { | ||
| window.openPromo | ||
| ? window.openPromo({ onComplete: openWeb3Modal, config: {hideUpdateAppBlock: true} }) | ||
| : openWeb3Modal() | ||
| } | ||
| ... | ||
| ``` | ||
|
|
||
| Now, we can set the `onClick` attribute of one of our UI components to display the modal. We can re-use the already existing `App-link` element to use the `openWidget` function: | ||
|
|
||
| ```jsx title="aurora-pass-example/src/App.js" | ||
|
|
||
| function App() { | ||
| ... | ||
|
|
||
| return ( | ||
| <div className="App"> | ||
| <header className="App-header"> | ||
| ... | ||
| <a | ||
| className="App-link" | ||
| href="#" | ||
| onClick={openWidget} | ||
| > | ||
| Open Promo | ||
| </a> | ||
| </header> | ||
| </div> | ||
| ); | ||
| } | ||
| ``` | ||
|
|
||
| If you click on the `Open Promo` link, you will be able to see the Promo Widget now: | ||
|  | ||
|
|
||
| And then, if you click further on the 'Skip, I have a wallet' button, you will see the placeholder message about Web3Modal: | ||
|  | ||
|
|
||
| You can also look at the more extensive [integration example here](/onboard/wallets/web3modal#integrate-web3modal) to learn how to add Web3Modal to your project, | ||
| particular section describing it is [here](/onboard/wallets/web3modal#add-web3modal). | ||
|
|
||
| ### What should be called in the `onComplete` function? | ||
|
|
||
| The widget calls any function you pass to it. So you could pass anything to it, whether that’s opening Web3Modal or RainbowKit popups or any other function. | ||
| But it works best and is meant to be used with WebModal v3 since the modal is styled similarly. | ||
|
|
||
| ## Examples of integration | ||
|
|
||
| To see the widget in use, visit one of the projects on the list: | ||
|
|
||
| - [Aurora+](https://aurora.plus/) | ||
| - [Pipeflare](https://pipeflare.io/flare2-token/spin) | ||
|
|
||
| ## Troubleshooting | ||
|
|
||
| Please, take a look at our [Troubleshooting Page](/onboard/troubleshooting). In case you still have questions, please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT) | ||
| on Discord and open a support ticket there. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| --- | ||
| title: Troubleshooting | ||
| --- | ||
|
|
||
| ### I have sent my tokens to the wrong wallet - can I recover them? | ||
|
|
||
| Aurora Pass does not currently support other EVM chains and L2s, except Aurora and Aurora Chains. | ||
| Sometimes, by mistake, users can send assets to their address on those non-supported networks instead. | ||
|
|
||
| E.g., suppose you have sent your assets to some of your Ethereum addresses. | ||
|
|
||
| These tokens can be quickly recovered by importing your address into a compatible wallet, e.g., MetaMask, using your private key or a seed phrase. | ||
| After that, you can bridge them back from Aurora to your Ethereum address. Or transfer the tokens to any other address on Aurora, like your AuroraPass address. | ||
|
|
||
| If you have transferred them to a CEX address, you can only recover these tokens if that CEX supports Aurora later. Currently, we support Coinbase, KuCoin, and Gate.io CEXes. | ||
|
|
||
| ### I can't find the token [XYZ] in my wallet – can I add it somehow? | ||
|
|
||
| - If you are a developer, please add a PR to [this repository](https://github.com/aurora-is-near/bridge-assets) following [this example](https://github.com/aurora-is-near/bridge-assets/pull/273/files). | ||
| - If you are a user, don't hesitate to get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT) via Discord, and we will help you resolve this issue. | ||
|
|
||
| ### I have paid for my transaction pack but got no transactions added | ||
|
|
||
| Please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT), and we will help you get your transaction pack. | ||
|
|
||
| ### I can't see my balances in Aurora Pass | ||
|
|
||
| Sometimes, such a situation could happen because of local restrictions in your country of residence. Try using another internet connection or VPN to solve the issue. | ||
|
|
||
| ### I get the 'Pairing failed: Pairing already exists' error while connecting to a DApp | ||
|
|
||
| This error looks like this: | ||
|  | ||
|
|
||
| This error means that DApp is already using some existing pairing, but the wallet doesn't know it was disconnected, so there is some non-sync state between them. | ||
|
|
||
| To fix it, please try to follow the next steps: | ||
|
|
||
| 1. Try to disconnect all previously connected wallets from that DApp. | ||
| 2. Re-connect with your AuroraPass wallet to a DApp. | ||
|
|
||
| If the problem persists, please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT). | ||
|
|
||
| ### I see symbols like 0xab4... while signing a DApp transaction in Aurora Pass - what do they mean? | ||
|
|
||
| If you are a user, don't hesitate to get in touch with either the DApp support team or the [Aurora Support Team](https://discord.gg/WXfbGsSUbT) and ask them to verify the contracts used in that DApp. | ||
|
|
||
| If you are a developer, verify your DApp contracts in [Aurora Explorer](https://explorer.aurora.dev/). We're using Blockscout | ||
| so that you can read more about it [here](https://docs.blockscout.com/for-users/verifying-a-smart-contract). | ||
| Verifying your contracts will ensure that a user sees nicely formatted information - function name and its arguments' names while using the Aurora Pass wallet. | ||
|
|
||
| In a non-verified contract, a user will see a non-decoded function name and arguments, which will look incomprehensible and unclear. | ||
|
|
||
| We advise you to verify all (or most) of your contracts, which gives your users a better understanding of their interactions with your product via Aurora Pass. | ||
|
|
||
| ### I have a problem which is not on the list | ||
|
|
||
| Please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT) on Discord and open a ticket describing your problem. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,30 @@ | ||
| --- | ||
| title: "Integrate Wallet Connect" | ||
| --- | ||
|
|
||
| # Wallet Connect Integration | ||
|
|
||
| Aurora Pass is meant to be used with [WalletConnect v2](https://docs.walletconnect.com/). It is an industry standard to create an encrypted connection between a DApp and EVM wallet, | ||
| initialized by scanning a QR code or via a [deep link](https://docs.walletconnect.com/web3wallet/mobileLinking) for mobile apps and browsers. | ||
|
|
||
| ## Integration Guide | ||
|
|
||
| To integrate WalletConnect into your DApp, follow these steps: | ||
|
|
||
| 1. If you don't have Wallet Connect yet, please follow the instructions in the [next section](/onboard/wallet-connect#add-your-wallets-modal). | ||
| 2. If you use WalletConnect v1, [migrate to WalletConnect v2](https://docs.walletconnect.com/2.0/advanced/migration-from-v1.x/overview) first. | ||
| 3. If you already have WalletConnect v2, add the Aurora Pass wallet to your wallet modal: | ||
| e.g., [Web3Modal](/onboard/wallets/web3modal#adding-aurora-pass) or [RainbowKit](/onboard/wallet-connect#add-your-wallets-modal) | ||
|
|
||
| Please get in touch with our [Support Team](https://discord.gg/WXfbGsSUbT) if you need some help | ||
|
|
||
| ## Add your wallet modal | ||
|
|
||
| You must integrate one of the Wallet Modals to display the list of wallets for a user to connect to your DApp. | ||
| Currently on the market, these are the two most popular options to choose from: | ||
|
|
||
| 1. [Web3Modal](https://docs.walletconnect.com/web3modal/about) – popup developed by the WalletConnect team. You can read more about it [here](/onboard/wallets/web3modal/). | ||
| 2. [RainbowKit](https://www.rainbowkit.com/) is another popular wallet modal in the Ethereum ecosystem. More information on integrating it is [here](/onboard/wallets/rainbowkit/). | ||
|
|
||
| Both of these are based on WalletConnect v2 out of the box, so if you are not using it yet – that is the place to start. After adding one of these modals, | ||
| you can add Aurora Pass to your wallet list and make it one of the primary options for a user, which is done in the next section *'Add your wallets'*. |
Oops, something went wrong.