> ## Documentation Index
> Fetch the complete documentation index at: https://primer.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# fetchVaultedPaymentMethods

Get a list of `VaultedPaymentMethod` for the `customerId` attached to the [client session](https://primer.io/docs/api-reference/v2.4/api-reference/client-session-api/create-a-client-session.md#body-customer-id).
Build your own UI to display, manage and perform payments with them.

> [!WARNING]
>
> The list of vaulted payment methods is not affected by the checkout builder's conditions.
> For example, if you configured the checkout builder to not show `Paypal` with the current client session,
> but `Paypal` was vaulted previously, `fetchVaultedPaymentMethods` will still return it.
>
> \*\*  The mentioned issue will be addressed and resolved in an upcoming release, improving
> the overall functionality of the Vault Manager. \*\*

```typescript TYPESCRIPT theme={"dark"}
    async fetchVaultedPaymentMethods(): Promise<VaultedPaymentMethod[]>
```

## Returns

The `fetchVaultedPaymentMethods` method fetches the vaulted payment methods for the `customerId` attached to the [client session](https://primer.io/docs/api-reference/v2.4/api-reference/client-session-api/create-a-client-session.md#body-customer-id)
and returns a Promise of `VaultedPaymentMethod[]`.

In case of successful operation, this method will return:

&#x20;

**Returns**

**VaultedPaymentMethod\[]**

**PrimerVaultedPaymentMethod**

**id** `string`

A *temporary* identifier for the vaulted payment method. You should use this id with [deleteVaultedPaymentMethod](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/deleteVaultedPaymentMethod.md),
[validate](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/validate.md) and [startPaymentFlow](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/startPaymentFlow.md).

ℹ️ This id changes with each call to [fetchVaultedPaymentMethods](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/fetchVaultedPaymentMethods.md).

**analyticsId** `string`

An identifier for the vaulted payment method that doesn't change across calls to [fetchVaultedPaymentMethods](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/fetchVaultedPaymentMethods.md).

**paymentInstrumentType** `string`

The type of the payment instrument associated to the vaulted payment method.

**paymentMethodType** `string`

A unique string identifier for the payment method.

**paymentInstrumentData** `object`

Data associated to the payment instrument. You can use this information to display the vaulted payment method in your UI.

**Properties**

**network** `string?`

The human readable representation of card network (e.g., Visa, Mastercard).

**cardholderName** `string?`

The name of the cardholder.

**first6Digits** `number?`

The first 6 digits of the card number.

**firstDigits** `number?`

The first 6 or 8 digits of the card number within PCI guidelines.

**last4Digits** `number?`

The last 4 digits of the card number.

**accountNumberLast4Digits** `number?`

The last 4 digits of the account number.

**expirationMonth** `number?`

The expiration month of the card, in 2-digit format.

**expirationYear** `number?`

The expiration year of the card, in 4-digit format.

**externalPayerInfo** `IExternalPayerInfo?`

Additional PayPal data.

**Properties**

**email** `string`

The payer's email address.

**externalPayerId** `string?`

The payer's unique ID.

**firstName** `string?`

The payer's given name.

**lastName** `string`

The payer's given surname.

**klarnaCustomerToken** `string?`

**sessionData** `IKlarnaSessionData?`

**paymentMethodType** `string?`

A unique string identifier for the payment method. (e.g. `PAYPAL`, `GOOGLE_PAY`)

**binData** `IBinData?`

Additional BIN data.

**Properties**

**network** `string?`

The card network (e.g., VISA, MASTERCARD, AMEX).

**bankName** `string?`

The name of the bank.

**threeDSecureAuthentication** `object`

## Example

The `VaultManager` needs to be configured before `fetchVaultedPaymentMethods` can be called.
Refer to the following example for [configuring](https://primer.io/docs/sdk/react-native/v2.x.x/primer-headless-checkout/vault-manager/configure.md) the `VaultManager`.

```typescript TYPESCRIPT theme={"dark"}
async function handleFetchPaymentMethods() {
  try {
    //Ensure the Vault Manager has been configured
    const availablePaymentMethods =
      await vaultManager.fetchVaultedPaymentMethods();
    console.log("Payment methods fetched successfully");
  } catch (error) {
    console.error("Error fetching payment methods:", error);
  }
}
```


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.