# useSolanaWallet

> @web3auth/modal Vue Composables useSolanaWallet | Embedded Wallets

Composable to retrieve and manage Solana wallet, accounts, and connection from Embedded Wallets in Vue.

### Import

```ts

```

### Usage

```html
<script setup lang="ts">

  const { solanaWallet, accounts, connection } = useSolanaWallet()
</script>

<template>
  
    Accounts: {{ accounts?.length ? accounts.join(", ") : "No accounts" }}
    SolanaWallet: {{ solanaWallet ? "Available" : "Not available" }}
    Connection: {{ connection ? "Connected" : "Not connected" }}
  
</template>
```

### Return type

```ts

```

#### `accounts`

`string[] | null`

The list of Solana account addresses, or null if not available.

#### `SolanaWallet`

`SolanaWallet | null`

The SolanaWallet instance for interacting with the Solana blockchain, or null if not available.

####

`Connection | null`

The Solana Connection instance for making RPC calls, or null if not available.

### Example: Fetching SOL balance

```html title="getBalance.vue"
<script setup lang="ts">

  const { web3Auth } = useWeb3Auth()
  const { accounts, connection } = useSolanaWallet()
  const balance = ref<number | null>(null)
  const isLoading = ref(false)
  const error = ref<string | null>(null)

  const fetchBalance = async () => {
    if (!web3Auth.value?.connected) {
      error.value = 'Please connect your wallet first'
      return
    }
    try {
      isLoading.value = true
      error.value = null
      // Check if accounts exist and have values before creating PublicKey
      if (!accounts.value || accounts.value.length === 0) {
        console.error('No accounts found. Please connect your wallet.', accounts.value)
        throw new Error('No accounts found. Please connect your wallet.')
      }
      const publicKey = new PublicKey(accounts.value[0])
      const balanceResult = await connection.value!.getBalance(publicKey)
      balance.value = balanceResult
    } catch (err) {
      console.error('Error fetching balance:', err)
      error.value = err instanceof Error ? err.message : 'Unknown error'
      balance.value = null
    } finally {
      isLoading.value = false
    }
  }

  // Fetch balance when connection or accounts change
  watch([connection, accounts], () => {
    if (web3Auth.value?.connected) {
      fetchBalance()
    }
  })

  // Initial fetch on component mount
  onMounted(() => {
    if (web3Auth.value?.connected) {
      fetchBalance()
    }
  })
</script>

<template>
  
    Balance
    
      {{ balance / LAMPORTS_PER_SOL }} SOL
    
    Loading...
    Error: {{ error }}
    <button @click="fetchBalance" type="button" class="card" :disabled="isLoading">
      Fetch Balance
    </button>
  
</template>
```