@hoangman1108/aptos-adapter v0.0.25

aptos-wallet-adapter

React WalletProvider supporting loads of aptos wallets.

Supports:

• Aptos official wallet
• Martian wallet
• Fewcha wallet
• Hippo wallet
• Hippo web wallet
• Pontem Wallet

Working on (PR welcome):

• Nightly wallet

Installation

with yarn

yarn add @hoangman1108/aptos-adapter

with npm

npm install @hoangman1108/aptos-adapter

Examples

Frontend Integration

Here's an example of how we integrate the adapter into hippo's frontend:

Wallet integration

Wallets source code here.

Use React Provider

import React from "react";
import {
  WalletProvider,
  HippoWalletAdapter,
  AptosWalletAdapter,
  HippoExtensionWalletAdapter,
  MartianWalletAdapter,
  FewchaWalletAdapter,
  PontemWalletAdapter
} from '@hoangman1108/aptos-adapter';

const wallets = [
  new HippoWalletAdapter(),
  new MartianWalletAdapter(),
  new AptosWalletAdapter(),
  new FewchaWalletAdapter(),
  new HippoExtensionWalletAdapter(),
  new PontemWalletAdapter()
];

const App: React.FC = () => {
  return (
    <WalletProvider
      wallets={wallets}
      onError={(error: Error) => {
        console.log('Handle Error Message', error)
      }}>
      {/* your website */}
    </WalletProvider>
  );
};

export default App;

Web3 Hook

import { useWallet } from '@hoangman1108/aptos-adapter';

const { connected, account, ...rest } = useWallet();

/*
  ** Properties available: **

  wallets: Wallet[]; - Array of wallets
  wallet: Wallet | null; - Selected wallet
  account(): AccountKeys | null; - Wallet info: address, publicKey, authKey
  connected: boolean; - check the website is connected yet
  connect(walletName: string): Promise<void>; - trigger connect popup
  disconnect(): Promise<void>; - trigger disconnect action
  signAndSubmitTransaction(
    transaction: TransactionPayload
  ): Promise<PendingTransaction>; - function to sign and submit the transaction to chain
*/

Connect & Disconnect

import { AptosWalletName, useWallet } from "@hoangman1108/aptos-adapter"

...

const { connect, disconnect, connected } = useWallet();

if (!connected) {
  return (
    <button
      onClick={() => {
        connect(AptosWalletName); // E.g. connecting to the Aptos official wallet
      }}
    >
      Connect
    </button>
  );
} else {
  return (
    <button
      onClick={() => {
        disconnect();
      }}
    >
      Disconnect
    </button>
  );
}

source: `typescript @manahippo/aptos-wallet-adapter