# useSelectedPaymentOptions

Returns payment options selected by the buyer.

```jsx
import React from 'react';
import {
  render,
  Banner,
  useSelectedPaymentOptions,
} from '@shopify/checkout-ui-extensions-react';

render('Checkout::Dynamic::Render', () => (
  <Extension />
));

function Extension() {
  const options = useSelectedPaymentOptions();

  if (
    options.some(
      (option) => option.type === 'creditCard',
    )
  ) {
    return (
      <Banner>
        All credit card transactions are secure
      </Banner>
    );
  }

  return null;
}

```

## 

### UseSelectedPaymentOptionsGeneratedType

Returns payment options selected by the buyer.

#### Returns: PaymentOption[]
export function useSelectedPaymentOptions<
  ID extends RenderExtensionPoint = RenderExtensionPoint,
>(): PaymentOption[] {
  const selectedPaymentOptions = useSubscription(
    useApi<ID>().selectedPaymentOptions,
  );
  const availablePaymentOptions = useSubscription(
    useApi<ID>().availablePaymentOptions,
  );

  return useMemo(() => {
    const availablePaymentOptionsMap: {[key: string]: PaymentOption} = {};

    for (const option of availablePaymentOptions) {
      availablePaymentOptionsMap[option.handle] = option;
    }

    return selectedPaymentOptions.map((paymentOption) => {
      return {
        handle: paymentOption.handle,
        type: availablePaymentOptionsMap[paymentOption.handle]?.type,
      };
    });
  }, [availablePaymentOptions, selectedPaymentOptions]);
}


### PaymentOption

A payment option presented to the buyer.

### type

value: `"creditCard" | "deferred" | "local" | "manualPayment" | "offsite" | "other" | "paymentOnDelivery" | "redeemable" | "wallet" | "customOnsite"`

The type of the payment option.

Shops can be configured to support many different payment options. Some options are only available to buyers in specific regions.

| Type  | Description  |
|---|---|
| `creditCard`  |  A vaulted or manually entered credit card.  |
| `deferred`  |  A [deferred payment](https://help.shopify.com/en/manual/orders/deferred-payments), such as invoicing the buyer and collecting payment at a later time.  |
| `local`  |  A [local payment option](https://help.shopify.com/en/manual/payments/shopify-payments/local-payment-methods) specific to the current region or market  |
| `manualPayment`  |  A manual payment option such as an in-person retail transaction.  |
| `offsite`  |  A payment processed outside of Shopify's checkout, excluding integrated wallets.  |
| `other`  |  Another type of payment not defined here.  |
| `paymentOnDelivery`  |  A payment that will be collected on delivery.  |
| `redeemable`  |  A redeemable payment option such as a gift card or store credit.  |
| `wallet`  |  An integrated wallet such as PayPal, Google Pay, Apple Pay, etc.  |
| `customOnsite` | A custom payment option that is processed through a checkout extension with a payments app. |

### handle

value: `string`

The unique handle for the payment option.

This is not a globally unique identifier. It may be an identifier specific to the given checkout session or the current shop.

## Related

- [useAvailablePaymentOptions](https://shopify.dev/docs/api/checkout-ui-extensions/react-hooks/payments/useavailablepaymentoptions)
- [StandardApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/standardapi)
- [CheckoutApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/checkoutapi)
- [OrderStatusApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/orderstatusapi)
- [CartLineDetailsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/cartlinedetailsapi)
- [PickupPointsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/pickuppointsapi)
- [PickupLocationsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/pickuplocationsapi)
- [ShippingMethodDetailsApi](https://shopify.dev/docs/api/checkout-ui-extensions/apis/shippingmethoddetailsapi)
- [ExtensionPoints](https://shopify.dev/docs/api/checkout-ui-extensions/apis/extensionpoints)