# Private data

**Luma has offered us a JavaScript API to handle private data - retrieved from the server and stored in local storage. Here is the Loki Theme alternative.**

## Magento overview
Messages that are triggered from PHP are sent to the frontend in various ways: AJAX calls can be made towards the URL `customer/section/load` (with an optional GET parameter `sections`) to retrieve private data. The resulting JSON is received by the Knockout.js component `customer-data` and then stored in local storage under the key `mage-cache-storage`.

## Alpine store `localStorage`
An Alpine store `LumaLocalStorage` has been added as a front for the logic of the original Knockout.js component. When the store is initialized, it checks whether local storage data is available under the key `mage-cache-storage`. If so, the data will be copied into the store. If the data is not there (because of a new session or a previous reset), an AJAX call will be made to retrieve the data from the URL `customer/section/load`.

The store offers the following methods:

- `get(sectionName)`: Retrieving all data of a specific section. If a section is empty, an AJAX call will be made;
- `set(sectionName, data)`: Set the internal data of a specific section and save everything to local storage;
- `remove(sectionName)`: Remove the internal data of a specific section and save everything to local storage;
- `refresh(sectionNames)`: Trigger an AJAX refresh and save everything to local storage;
- `save()`: Saving all internal data into local storage;
- `reset()`: Remove all internal data and local storage (and force a refresh at the next call);

## Examples

Retrieve the summary count from the `cart` section:
```js
const cartSection = Alpine.store('LumaLocalStorage').get('cart');
const summaryCount = cartSection.summary_count ?? 0;
```

Refresh the customer section:
```js
Alpine.store('LumaLocalStorage').refresh('customer');
```

> Note that for messaging, it is easier to use the `LumaMessageStore` store instead