0.5.2 • Published 6 months ago
react-arconnect v0.5.2
Usage:
Add it to your project:
yarn add react-arconnect
How to use react-arconnect in your React app:
//App.js | index.js
import React from 'react';
import { ArconnectProvider, ArconnectContext } from 'react-arconnect';
//wrap the root component with <ArconnectProvider />
export default function Home() {
const permissions = ["ACCESS_ADDRESS"]
return (
<ArconnectProvider permissions={permissions}>
<Name />
</ArconnectProvider>
)
}
API
<ArconnectProvider />
This is the provider component. It should be placed above all components using useArconnect()
.
useArconnect
This is the hook to be used throughout the app. It returns an object containing:
- walletPermissions
- walletConnected
- address
- ANS
- arconnectConnect
- arconnectDisconnect
- getPublicKey
- createSignature
- decrypt
- encrypt
walletPermissions
PermissionType[]
: Array of permissions granted to the site by the connected Arconnect wallet.
walletConnected
boolean
: ArConnect wallet connection state.
address
string
: Wallet address of the currently connected Arconnect wallet.
ANS
Learn more about ANS (Arweave Name service)
Returns:
address_color
: The ANS profile color.currentLabel
: The current ANS label in use.avatar
: The TXID for the ANS Avatar Image.
arconnectConnect
- Function used to request connecting site to ArConnect.
arconnectDisconnect
- Function used to request disconnecting site from ArConnect.
getPublicKey
- Function to get the public key of the connected wallet.
createSignature
- Function to create a signature for a given message. Useful for verifying user authentication.
Usage:
const data = new TextEncoder().encode('test message');
const signature = await createSignature(data);
// fQYlCxQSkgGMQdWnUZqAr3bu78GE2f9fa6i35+PzTg...S+fNDCjt0O/w9tOzHn45+UqmeWZ9kLzn2LyE=
decrypt
- Function to decrypt a message. Not recommended for production use.
encrypt
- Function to encrypt a message. Not recommended for production use.
Other exports
shortenAddress
- Function to shorten the wallet address with ellipsis Ex:
lIg5..._3Qg
PermissionType
string
: Permission type for the ArConnect wallet permissions.
ArweavePermissions
PermissionType[]
: All permissions available for the Arweave-based wallets.
defaultSignatureParams
object
: Default signature params for thecreateSignature
function.
ANS_URL
string
: API route for ANS (Arweave Name service) that returns all domains belonging to the wallet address.
Usage: https://ans-resolver.herokuapp.com/resolve-as-arpage/kaYP9bJtpqON8Kyy3RbqnqdtDBDUsPTQTNUCvZtKiFI
(deprecation notice: The URL will be swapped out in coming updates)
Examples
To run the examples, switch to the respective directories. Run npm install
or yarn install
, Then run npm start dev
or yarn dev
.
Check out our example app and components to see how to use react-arconnect
in your app.
License
This project is licensed under the MIT license