> For the complete documentation index, see [llms.txt](https://docs.akinon.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.akinon.com/technical-guides/project-zero/django/page-types/basket-page/redux-basket-state.md).

# Redux Basket 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.

```
constructor() {
  observe(basketReducer).subscribe(({ basket, pending }) => {
   ...
   ...
  });
}
```

is used as such. Here, we take **basket** and **pending** properties from the basketReducer (i.e. state.basket) 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/basket/selectors.js` that will adjust to different usage scenarios.

**Selectors created for general use are as below:​**

* `basketReducer` --> `state.basket` Takes complete basket state. Includes `basket`, `errors`, `pending` properties.
  * Corresponds to `basket` --> `basketSelector`.
  * Corresponds to `errors` --> `errorSelector`.
  * Corresponds to `pending` --> `pendingSelector`.

`observe(basketReducer).subscribe(({ basket, errors, pending }) => { ... });` can be used as such.

Or, it can be used with relevant selectors as described below.

* `basketSelector` --> `state.basket.basket` Contains items to be shown in the basket such as the list of basket items, discounts, prices and campaigns. Can be used as `observe(basketSelector).subscribe(basket => { ... });` .
* `errorSelector` --> `state.basket.errors` Contains basket errors. Can be used as `observe(errorSelector).subscribe(errors => { ... });` .
* `pendingSelector` --> `state.basket.pending` Contains basket hold status data as `boolean`. Initially returns as `true`. It means `state.basket.basket` and `state.basket.errors` properties are empty. When the state is modified and data is filled in the `state.basket.basket` and `state.basket.errors` properties, `pending` property will be `false`. It can be used as `observe(pendingSelector).subscribe(pending => { ... });` .

**Selectors created for specific use are as follows:​**

* `basketItemListSelector`
* `basketItemSelector`
* `giftNoteSelector`
* `quantitySelector`
* `discountsSelector`
* `basketListSelector`
* `basketErrorSelector`
* `basketPendingSelector`
* `observe(aSelectorName).subscribe(name => { ... });` can be used as such.

{% hint style="danger" %}
You can review `node_modules/shop-packages/redux/basket/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/basket/reducer.js` that will adjust to different usage scenarios.

Reducers are as follows:

* setBasket
* errorBasket
* clearErrorBasket
* pending

{% hint style="danger" %}
You can review `node_modules/shop-packages/redux/basket/reducer.js` file for further details on all reducers.
{% endhint %}

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

We need actions to modify data in the basket.

Actions are as follows:

* `fetchBasket` --> `GET` (Sends no parameters.) Receives basket data from API, updates state and returns basket data as promise. `setQuantity` --> `PUT` (Sends product knowledge (pk) and quantity.) Sends request to API to update item quantity, updates state and returns basket data as promise. `removeProduct` --> `PUT` (Sends pk) Sends request to API to remove item from basket, updates state and returns basket data as promise. `addProduct` --> `POST` (Sends pk and item quantity on demand. If quantity is not specified, it is accepted as one.) Sends request to API to add item in the basket, updates state and returns basket data as promise. `setDiscount` --> `PATCH` (Sends voucher code.) Sends request to API to apply voucher code to the basket, updates state and returns basket data as promise. `removeDiscount` --> `PATCH` (Sends no parameters.) Sends request to API to remove active voucher code in the basket, updates state and returns basket data as promise.

{% hint style="danger" %}
You can review `node_modules/shop-packages/redux/basket/actions.js` file for further details on all actions.
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.akinon.com/technical-guides/project-zero/django/page-types/basket-page/redux-basket-state.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.