# Aptos dApp Integration

## Install CLV Wallet

To use CLV Wallet for your Aptos dApp, your users need to install [CLV Wallet Chrome extension](https://chrome.google.com/webstore/detail/clv-wallet/nhnkbkgjikgcigadomkphalanndcapjk) in their browser. CLV Wallet injects an <mark style="color:blue;">clover\_aptos</mark> object into the [window](https://developer.mozilla.org/en-US/docs/Web/API/Window) of any dApp that the user visits.

To check whether the user has installed CLV Wallet, please use the following check:

```javascript
const isCLVInstalled = window.clover_aptos
```

If CLV Wallet is not installed, you can navigate user to install CLV Wallet first. For example

<pre class="language-javascript"><code class="lang-javascript">const getCLVWallet = () => {
    if ('clover_aptos' in window) {
        return window.clover_aptos;
    } else {
        window.open('https://clv.org/?type=wallet', `_blank`);
    }
<strong>}
</strong></code></pre>

## Connect to CLV Wallet

After <mark style="color:blue;">clover\_aptos</mark> object is injected into the dApp, we can connect to CLV Wallet by calling <mark style="color:blue;">wallet.connect()</mark>. When this function is called, it will prompt user a dialog to approve or reject the interactions between your web app and CLV Wallet. Once connection is approved, you can easily get user's current wallet address. Sample code:

```javascript
const wallet = getCLVWallet();
try {
    const response = await wallet.connect();
    console.log(response); // { address: string, publicKey: string }

    const account = await wallet.account();
    console.log(account); // { address: string, publicKey: string }
} catch (error) {
    // { code: 500, message: "The request was cancelled."}
}
```

## Disconnect CLV Wallet

If you want the dApp to disconnect from CLV Wallet, you should just call <mark style="color:blue;">wallet.disconnect()</mark>.&#x20;

```javascript
await wallet.disconnect();
```

## Transaction Signing

Once your dApp is connected with CLV Wallet, it can prompt to user to sign and send transactions to the Aptos blockchain.

### Case 1: Sign and Submit

```javascript
const wallet = getCLVWallet();

const transaction = {
    arguments: [address, '1'],
    function: '0x1::coin::transfer',
    type: 'entry_function_payload',
    type_arguments: ['0x1::aptos_coin::MyCoin'],
};

try {
    const tx = await wallet.signAndSubmitTransaction(transaction);
    console.log(tx.hash); // this is the transaction hash
    
    return tx;
} catch (error) {
    // see "Errors"
}
```

### Case 2: Sign only

```javascript
const wallet = getAptosWallet(); // see "Connecting"

// Example Transaction
const transaction = {
    arguments: [address, '1'],
    function: '0x1::coin::transfer',
    type: 'entry_function_payload',
    type_arguments: ['0x1::aptos_coin::MyCoin'],
};

try {
    const signTransaction = await wallet.signTransaction(transaction);
    console.log(signTransaction); // Uint8Arry for signed transaction
} catch (error) {
    // see "Errors"
}
```

## Message Signing

A dApp can call <mark style="color:blue;">wallet.signMessage(payload: SignMessagePayload)</mark> to sign a message using CLV Wallet.

The above function call will return <mark style="color:blue;">Promise\<SignMessageResponse></mark>. Types info are:

```javascript
export interface SignMessagePayload {
  address?: boolean; // Should we include the address of the account in the message
  application?: boolean; // Should we include the domain of the dapp
  chainId?: boolean; // Should we include the current chain id the wallet is connected to
  message: string; // The message to be signed and displayed to the user
  nonce: string; // A nonce the dapp should generate
}

export interface SignMessageResponse {
  address: string;
  application: string;
  chainId: number;
  fullMessage: string; // The message that was generated to sign
  message: string; // The message passed in by the user
  nonce: string,
  prefix: string, // Should always be APTOS
  signature: string; // The signed full message
}
```

### Example message and response

```javascript
signMessage({nonce: 1234, message: "Welcome to CLV Wallet!" });
```

The above would generate a full message to be signed and returned as the signature:

```json
APTOS
nonce: 1234
message: Welcome to CLV Wallet!
```

### Signature Verifying

```javascript
import nacl from 'tweetnacl';

const message = "hello";
const nonce = "random_string"

try {
  const response = await window.clover_aptos.signMessage({
    message,
    nonce,
  });
  const { publicKey } = await window.clover_aptos.account();
  // Remove the 0x prefix
  const key = publicKey!.slice(2, 66);
  const verified = nacl.sign.detached.verify(
    Buffer.from(response.fullMessage), 
    Buffer.from(response.signature, 'hex'), 
    Buffer.from(key, 'hex')
  );
  console.log(verified);
} catch (error) {
  console.error(error);
}
```