Local storage

localStorage is permanent browser storage, which is available across all browser tabs of your application and after page refresh. You can find more details about it here.

To save data to the localStorage, you can use the Save to Local Storage action or the JavaScript Code action - setItem.

After that, you'll be able to use the data from either of these actions with {{localStorage.getItem('varName')}}, where varName is the name of the variable used in the action.

Using localStorage API

Method	Description
getItem(key)	Retrieves the value associated with the specified key.
async setItem(key, value)	Adds key's value or updates key's value if it already exists. Method throws an error when size quota is exceeded.
async removeItem(key)	Removes the key-value pair with the specified key.
async clear()	Clears all key-value pairs stored in localStorage.

Examples of usage:

// Save data to localStorage
await {{localStorage}}.setItem('foo', 'bar');

// Retrieve data from localStorage
const username = {{localStorage}}.getItem('foo');

// Remove data from localStorage
await {{localStorage}}.removeItem('foo');

// Clear all data from localStorage
await {{localStorage}}.clear();

Use case: Saving a draft message

In this example, we will show you how you can use local storage to save a draft message so that it's not lost upon page refresh or closing the app.

1. Start with adding a Text input component to the working area.

2. Next, create a Save to Local Storage action, and specify the variable name and value.

3. Assign this action to the OnChange trigger of the Text input component.

4. Finally, assign the localStorage variable to the Value filed of the Text input: {{localStorage.getItem('draft')}}.