-
-
Notifications
You must be signed in to change notification settings - Fork 25
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Implement session storage/cache utility functions
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
1 parent
85498ca
commit 8565156
Showing
3 changed files
with
122 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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 }; |