# Redux Checkout State

Reducers and selectors should be used as `observe(stateReducerOrSelectorName).subscribe(...)` in the constructor within the js file where actions for the .view file in question are carried out.

For instance;

```
constructor() {
  observe(selectPaymentOptions).subscribe((paymentOptions) => {
   ...
   ...
  });
}
```

Here we take out of `selectPaymentOptions` selector *(i.e.state.checkout)* the **paymentOptions** property and carried out actions through these in the method.

## <mark style="color:red;">Selector</mark>​ <a href="#selector" id="selector"></a>

There are currently numerous selectors under `node_modules/shop-packages/redux/checkout/selectors.js` that will adjust to different usage scenarios.

Selectors are as follows:

* `selectIsReady`
* `selectTab`
* `selectErrors`
* `selectPending`
* `selectDeliveryOptions`
* `selectCurrentDeliveryOptionId`
* `selectAddresses`
* `selectCurrentAddressId`
* `selectCurrentAddress`
* `selectCurrentAddressCity`
* `selectCurrentBillingId`
* `selectCurrentBillingAddress`
* `selectShippingOptions`
* `selectCurrentShippingId`
* `selectCurrentShipping`
* `selectShippingAmount`
* `selectTotalAmount`
* `selectPreOrderBasket`
* `selectSummaryData`
* `selectAddressAndShippingSet`
* `selectAddressAndShipping`
* `selectSameBillAddress`
* `selectCurrency`
* `selectPaymentOptions`
* `selectCurrentPaymentOptionId`
* `selectCurrentPaymentOption`
* `selectCardHolder`
* `selectCardNumber`
* `selectCardMonth`
* `selectCardYear`
* `selectCardCVV`
* `selectUseThreeD`
* `selectBinNumber`
* `selectCardType`
* `selectCardTypeName`
* `selectCardTypeImage`
* `selectInstallments`
* `selectCurrentInstallmentId`
* `selectAgreement`
* `selectFundsTransferAccounts`
* `selectCurrentFundsTransferAccountId`
* `selectCurrentFundsTransferAccount`
* `selectCreditPaymentOptions`
* `selectCurrentCreditPaymentOptionId`
* `selectCurrentCreditPaymentOption`
* `selectPayOnDeliveryMethods`
* `selectCurrentPayOnDeliveryMethod`

{% hint style="info" %}
Users can review the `node_modules/shop-packages/redux/checkout/selectors.js` file for further details on all selectors.
{% endhint %}

## <mark style="color:red;">Reducer​</mark> <a href="#reducer" id="reducer"></a>

There are currently numerous reducers under `node_modules/shop-packages/redux/checkout/reducer.js` that will adjust to different usage scenarios.

Reducers are as follows:

* `setReady`
* `setTab`
* `setCardHolder`
* `setCardCVV`
* `setCardMonth`
* `setCardNumber`
* `setCardYear`
* `setAgreement`
* `setThreeD`
* `setSameBillAddress`
* `setShippingAddressId`
* `setBillingAddressId`
* `setAddresses`
* `setFundsTransferAccountId`
* `setCreditPaymentOptionId`
* `setPayOnDeliveryMethodName`
* `clearErrors`
* `setPending`
* `setErrors`
* `setPreOrder`

{% hint style="info" %}
Users can review the `node_modules/shop-packages/redux/checkout/reducer.js` file for further details on all reducers.
{% endhint %}

## <mark style="color:red;">Actions</mark>​ <a href="#actions" id="actions"></a>

There are currently numerous actions under `node_modules/shop-packages/redux/checkout/actions.js` that will adjust to different usage scenarios.

Actions are as follows:

* `fetchCheckout` --> `GET` (Sends no parameters.)

  \| ? | -> Receives entire checkout data from API.
* `fetchAddresses` --> `GET` (Sends no parameters.)

  \| ? | -> Receives address data from API.
* `setDeliveryOption` --> `POST` (Sends delivery option pk.)

  \| ? | -> Sets selected delivery option.
* `setAddress` --> `POST` (Sends address pk.)

  \| ? | -> Sets selected shipping address.
* `setBillingAddress` --> `POST` (Sends address pk.)

  \| ? | -> Sets selected invoice address.
* `setShippingOption` --> `POST` (Sends shipping option pk.)

  \| ? | -> Sets selected shipping option.
* `setPaymentOption` --> `POST` (Sends payment option pk.)

  \| ? | -> Sets selected payment option.
* `setBinNumber` --> `POST` (Sends BIN number.)

  \| ? | -> Sets BIN number in credit card payment method.
* `setInstallment` --> `POST` (Sends installment pk.)

  \| ? | -> Sets selected installment quantity in credit card payment option.
* `setSameBillingAddress` --> `POST` (Sends boolean value.)

  \| ? | -> Determines whether invoice and shipping addresses are same.
* `completeCheckout` --> `POST` (Sends no parameters.)

  \| ? | -> Receives set parameters values and completes order with credit card payment option.
* `setFundsTransferAccount` --> `POST` (Sends funds transfer account pk.)

  \| ? | -> Sets selected bank account in bank transfer payment option.
* `completeFundsTransfer` --> `POST` (Sends no parameters.)

  \| ? | -> Receives set parameters values and completes order with bank transfer payment option.
* `setCreditPaymentOption` --> `POST` (Sends pk for selected payment option.)

  \| ? | -> Sets selected credit payment option.
* `creditPaymentConfirmation` --> `POST` (Sends no parameters.)

  \| ? | -> Receives set parameters values and completes order with credit payment option.
* `setPayOnDeliveryMethod` --> `POST` (Sends pk on selected pay-on-delivery option.)

  \| ? | -> Sets selected pay-on-delivery payment option.
* `completePayOnDeliveryMethod` --> `POST` (Sends no parameters.)

  \| ? | -> Receives set parameters values and completes order with pay-on-delivery payment option.

{% hint style="info" %}
Users can review the `node_modules/shop-packages/redux/checkout/actions.js` file for further details on all actions.
{% endhint %}