@dutchfurniturefulfilment/skik-client/docs/examples/storing-configurations.md

Javascript package for integrating a SKIK configurator inside web projects.

_[SKIK Client](../index) / Examples / Storing configurations and retrieving product manifests_
# Storing configurations and retrieving product manifests

You'll typically want to be able to store identifiers for configurations locally to:
- Retrieve the product manifest at any time in the future  
_For example to add the required products to your shopping cart._

- Reload a certain configuration at any time in the future  
_For example to reload a user's favorite / saved configuration inside the configurator._

The SKIK client instance provides the method [`Client # getConfigurationHash()`](../api/client#requesting-a-configuration-hash) to retrieve a unique string that identifies the current configuration. A promise is returned that should eventually resolve to the unique hash:

```typescript
const skikClient = SKIKClient.create({ /* ... */ });

// Retrieve a promise that resolves to the new hash
const hashPromise: Promise<string> = skikClient.getConfigurationHash();

hashPromise.then(function(hash) {
    // Do something with `hash` here
});
```


## Retrieving the product manifest for a certain configuration

In order to work with the products required for a certain configuration, a manifest can be accessed at the SKIK API. This manifest is an array of objects listing all products required and their quantities, identified by their EAN code. Product manifests can be requested at the following URL:

**`GET https://api.basiclabel.nl/api/skik/product-data/:hash`**

The `:hash` parameter is to be replaced with the configuration hash value. An example response for a configuration with hash `5a296ec531978` can be [viewed here](https://api.basiclabel.nl/api/skik/product-data/5a296ec531978).

The response content is of type `application/json`, and is equivalent to the interface below:

```typescript
interface ProductDataResponse {
    hash: string;
    contents: Array<{ ean_code: string; quantity: number; description: string; }>;
}
```

### Some typical todo-lists

---

#### Adding products to the shopping-cart

The following bullet list shows the basic steps required to add SKIK configurations to your shopping cart:

- Request a configuration hash from the SKIK Client instance
- Send the hash to server
- Fetch the product manifest as described above
- Find all products in your local database
- Optionally transform the set of products to a purchasable compound entity (so that it appears to be 1 product)
- Add all products with their respective quantities to the shopping cart

---

#### Associating the configuration hash with a certain user account

You might for example want to have a **Favorites** or **My SKIK closets** section in the user account section of your website:

- User clicks **save my configuration**  
_**Save my configuration** is a hypothetical interface element that allows them to save the current configuration to their account._
- Request a configuration hash from the SKIK Client instance
- Send the hash to server
- Create a new user's favorite storing the hash value
- At some point in the future: User clicks **Edit my configuration**  
_**Edit my configuration** is a hypothetical interface element that allows a user to reload the configuration into the configurator_
- Direct the user to the configurator page, and instantiate a `Client` instance with `{ configurationHash: <stored-hash> }`