Skip to content

Commit

Permalink
Implement session storage/cache utility functions
Browse files Browse the repository at this point in the history
To persist the current active theme mode when changing the route (which
unmounts the `Root` component and therefore resets the state), the value
will be written to the browser's session storage (1). The storage type
has been preferred over the local storage (2) since this would persist
the active theme mode even when the user closes the tab, but the desired
behavior is to optimize the site for the "bright snow flurry" aura theme
mode.

To simplify the read- and write handling as well as prevent possible
errors due to wrong storage keys, two utility functions have been
implemented:

- `readSessionCache(key : string)` - Reads the value of the given key
  from the session storage (if available).
- `writeSessionCache(key : string, value : any)` - Writes the given
  key-value pair to the session storage (if available).

References:
  (1) https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage
  (2) https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Associated epic: GH-51
GH-57
  • Loading branch information
arcticicestudio committed Dec 4, 2018
1 parent 85498ca commit 8565156
Show file tree
Hide file tree
Showing 3 changed files with 122 additions and 0 deletions.
43 changes: 43 additions & 0 deletions src/config/stores/caches/constants.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
/*
* Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
* Copyright (C) 2018-present Sven Greb <[email protected]>
*
* Project: Nord Docs
* Repository: https://github.com/arcticicestudio/nord-docs
* License: MIT
*/

/**
* @file Provides internally cache related store constants.
* @author Arctic Ice Studio <[email protected]>
* @author Sven Greb <[email protected]>
* @since 0.2.0
*/

import { metadataNordDocs } from "data/project";

/**
* The prefix for keys stored in the session/local storage.
*
* @constant {string}
* @since 0.2.0
*/
const SESSIONSTORAGE_KEY_PREFIX = `${metadataNordDocs.name}`;

/**
* The separator for keys stored in the session/local storage.
*
* @constant {string}
* @since 0.2.0
*/
const SESSIONSTORAGE_KEY_SEPARATOR = ":";

/**
* The session/local storage key for the theme mode.
*
* @constant {string}
* @since 0.2.0
*/
const SESSIONSTORAGE_KEY_THEME_MODE = `${SESSIONSTORAGE_KEY_PREFIX}${SESSIONSTORAGE_KEY_SEPARATOR}themeMode`;

export { SESSIONSTORAGE_KEY_PREFIX, SESSIONSTORAGE_KEY_SEPARATOR, SESSIONSTORAGE_KEY_THEME_MODE };
19 changes: 19 additions & 0 deletions src/utils/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
/*
* Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
* Copyright (C) 2018-present Sven Greb <[email protected]>
*
* Project: Nord Docs
* Repository: https://github.com/arcticicestudio/nord-docs
* License: MIT
*/

/**
* @file Provides utility functions and classes.
* @author Arctic Ice Studio <[email protected]>
* @author Sven Greb <[email protected]>
* @since 0.2.0
*/

import { readSessionCache, writeSessionCache } from "./sessionCache";

export { readSessionCache, writeSessionCache };
60 changes: 60 additions & 0 deletions src/utils/sessionCache.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
/*
* Copyright (C) 2018-present Arctic Ice Studio <[email protected]>
* Copyright (C) 2018-present Sven Greb <[email protected]>
*
* Project: Nord Docs
* Repository: https://github.com/arcticicestudio/nord-docs
* License: MIT
*/

/**
* @file Provides utility functions for session storage and caching.
* @author Arctic Ice Studio <[email protected]>
* @author Sven Greb <[email protected]>
* @since 0.2.0
*/

/**
* Checks if the global session storage object is available in the current environment.
*
* @private
* @method hasSessionStorage
* @return {Boolean} `true` if the global session storage object is available, `false` otherwise.
* @see https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage
* @see https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects
*/
const hasSessionStorage = () => typeof window !== "undefined" && window.sessionStorage !== "undefined";

/**
* Reads the value of the given key from the session storage (if available).
*
* @method readSessionCache
* @param {string} key The name of the key from which the value should be read.
* @return {string|null} The value of the given key, `null` otherwise if the global session storage is not available in
* the current environment.
*/
const readSessionCache = key => {
if (hasSessionStorage()) {
return sessionStorage.getItem(key);
}
return null;
};

/**
* Writes the given key-value pair to the session storage (if available).
*
* @method writeSessionCache
* @param {string} key The name of the key for the paired value.
* @param {string} value The value for the given key.
* @return {void}, `true` if the value has been set, `false` otherwise if the global session storage is not available
* in the current environment.
*/
const writeSessionCache = (key, value) => {
if (hasSessionStorage()) {
sessionStorage.setItem(key, value);
return true;
}
return false;
};

export { readSessionCache, writeSessionCache };

0 comments on commit 8565156

Please sign in to comment.