@acctglobal/session-storage-client

Session Storage Client

This package offers a typed abstraction layer for interacting with the browser's sessionStorage through a generically typed TypeScript class, SessionStorageClient.

🔧 Installation

npm i @acctglobal/session-storage-client

🖱️ Usage

// Import the library
import { SessionStorageClient } from '@acctglobal/session-storage-client';

// Define the structure for what's to be stored
interface ExampleInterface {
  prop1: string;
  prop2: number;
}

// Create a new instance using the defined interface
const exampleClient = new SessionStorageClient<ExampleInterface>('exampleKey');

The exampleClient variable now has a couple of things going for you:

/*
 * You can interact strictly with declared interface properties, and set
 * values strictly by their type, anything else results in a compile error
 */
exampleClient.setProperty('prop1', 'this is an example');
exampleClient.setProperty('prop2', 2);

// Nope
exampleClient.setProperty('prop3', 2);

// Nope²
exampleClient.setProperty('prop1', 42);

// Can't get data outside what you expect. "Prop1" is typed, by the way.
const prop1 = exampleClient.getProperty('prop1');

// You can also set the entire object
let obj = {
  prop1: 'this is a string',
  prop2: 12
} as ExampleInterface;

exampleClient.setFullObject(obj);

// And, get the whole object as well

const fullObject = exampleClient.getFullObject();

// Wanna wipe everything clean? You got it!
exampleClient.resetStorage();

//Important reminder!!
//Whenever you change the value of a storage an event will be triggered with the name of the sessionStorage Item

//In this example, the key is exampleKey, so, to catch the changes on this sessionStorage item you can do the following:

window.addEventListener('exampleKey', function () {
  //Do whatever you want here
});

✒️ Authors

• João Castro - Documentation / Developer - João Castro
• Felipe Felix - Developer - Felipe Felix
• Carlos Pellizzari - Solutions Architect - Carlos Pellizzari