> For the complete documentation index, see [llms.txt](https://docs.digitalriver.com/commercetools-1/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.digitalriver.com/commercetools-1/use-the-commercetools-merchant-center-custom-application/enable-customer-management-options.md).

# Enable customer management options

Learn how to enable customer management options in the store.

The custom application can be used to manage saved payment methods and to upload tax certificates.

## Managing saved payment methods

You can save Digital River payment methods for a customer and they will be available for selection in the Drop-in Checkout. Summary details of the payment method will also be available on the commercetools customer to facilitate display and removal within an account area.

### Saving payment methods

To save a credit card you must use the Digital River drop-in Javascript library to capture the card details and then update the commercetools customer with the id of the source returned by Digital River. To do this use the following steps:

1. You will need your Digital River public API key. This is configured in the Digital River -> API Keys section of the commercetools Merchant Center and can be retrieved using the [custom objects API](https://docs.commercetools.com/api/projects/custom-objects#get-customobject-by-container-and-key) with the `digital_river` container and the key `public_api_key`.
2. Load the drop-in library from `https://js.digitalriverws.com/v1/DigitalRiver.js.`
3. Gather a billing address for the credit card.
4. Render the credit card form.

   ```js
   const apiKey = <your PUBLIC API key>; 
   const config = {
     options: {
       flow: "managePaymentMethods",
     },
     paymentMethodConfiguration: {
       enabledPaymentMethods: ['creditCard'], // only credit cards are supported
     },
     billingAddress: <the billing address>,
     onReady: function () {
       // handle onReady if required
     },
     onSuccess: async function (data) {
       await savePaymentDetails(data);
     },
     onCancel: function () {
       // handle onCancel if required
     },
     onError: function (error) {
       // handle onError if required
     }
   };
   const drPaymentMethods = new window.DigitalRiver(apiKey);
   const form = drPaymentMethods.createDropin(config);
   form.mount(<id of div in the page in which to render>);
   ```
5. Save the source against the commercetools customer.
   1. The data object passed to `savePaymentDetails` has the source id in data.source.id.
   2. Set the custom type of the customer to `drCustomerFields`, only when not already set (setting this when already set will clear existing field values).
   3. Set the source id on the custom field `drAttachSource`. This field will be automatically cleared as part of the save process.
6. Optionally, wait for the source to be saved. Saving is an asynchronous process, so if you want to display when this is complete you will need to poll the commercetools customer resource waiting until the `drSources` property is updated with the source you have saved.

See the [Digital River documentation](https://docs.digitalriver.com/digital-river-api/payment-integrations-1/drop-in/drop-in-integration-guide#using-drop-in-to-collect-payment-details-on-a-my-account-page) for more details on the managePaymentMethods flow.

Sources can also be saved in the drop-in checkout. You do not need to do anything to enable this for registered users. Sources added this way will automatically be added to the commercetools customer.

### Displaying payment methods

When a payment method is saved, summary details are added to the `drSources` custom field on the commercetools customer. This is a set of strings where each string is JSON encoded data about the payment, similar to

```json
{
  "id":"0472f4b5-87b4-4e90-bf02-d86be18a2ed6",
  "creditCard": {
    "brand":"Visa",
    "expirationMonth":12,
    "expirationYear":2023,
    "lastFourDigits":"1111"
  }
}
```

The data in the `creditCard` block is simply the data we receive from Digital River in the webhook.

### Deleting payment methods

To delete a payment source from a customer, simply set the value of the `drDetachSource` custom field on the customer. This field will be automatically cleared and the source removed from the customer in Digital River and commercetools.

Again, this is an asynchronous process. So if you want to display when this is complete you will need to poll the commercetools customer resource waiting until the `drSources` property is updated with the specified source removed.

## Adding a tax certificate

{% hint style="info" %}
**Note:** This feature is not currently enabled. You can add a tax certificate to a customer, but Digital River will not use it
{% endhint %}

US customers can upload a tax certificate to Digital River to allow them to make [tax-exempt purchases](https://docs.digitalriver.com/digital-river-api/customers/setting-tax-related-attributes#tax-certificates). To perform this via the integration with commercetools follow these steps:

1. Gather details of the tax certificate from the customer. The tax certificate file should be an image.
2. Set the custom type of the customer to drCustomerFields, only when not already set (setting this when already set will clear existing field values).
3. Set the custom fields as indicated in the table below.
4. Updating Digital River is an asynchronous process. To check it completes poll the commercetools customer and waits until the `drTaxCertificateFileId` custom field is updated.

<table><thead><tr><th>Custom field</th><th width="233">Value</th><th>Notes</th></tr></thead><tbody><tr><td>drTaxCertificateFileContents</td><td>Base64 encoded contents of the tax certificate</td><td>In JS you can use FileReader().readAsDataURL(file). Automatically cleared</td></tr><tr><td>drTaxCertificateFileName</td><td>Name of the tax certificate file</td><td></td></tr><tr><td>drTaxCertificateStartDate</td><td>Validity start date of the tax certificate</td><td>YYYY-MM-DD format</td></tr><tr><td>drTaxCertificateEndDate</td><td>Validity end date of the tax certificate</td><td>YYYY-MM-DD format</td></tr><tr><td>drTaxCertificateAuthority</td><td>Two letter state code of the issuing state</td><td></td></tr></tbody></table>