Skip to content

Instantly share code, notes, and snippets.

@HKhademian
Created April 21, 2021 12:09
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save HKhademian/165f4c520b727cecd9fac3837f47426b to your computer and use it in GitHub Desktop.
Save HKhademian/165f4c520b727cecd9fac3837f47426b to your computer and use it in GitHub Desktop.
import {useState, useEffect} from 'preact/hooks';
export const getStorage = (key, initValue = undefined, session = false, decode = data => data) => {
if (typeof window == "undefined") return initValue;
const item = session ?
window.sessionStorage.getItem(key) :
window.localStorage.getItem(key);
return item !== undefined && item !== null ? decode(item) : initValue;
};
export const setStorage = (key, value, session = false, encode = data => data) => {
if (typeof window == "undefined") return;
session ?
window.sessionStorage.setItem(key, encode(value)) :
window.localStorage.setItem(key, encode(value));
};
export const removeStorage = (key, session = false) => {
if (typeof window == "undefined") return;
session ?
window.sessionStorage.removeItem(key) :
window.localStorage.removeItem(key);
};
export const useStorage = (key, initValue = undefined, session = false, decode = data => data, encode = data => data) => {
const [state, setState] = useState(() => getStorage(key, initValue, session, decode));
const updateValue = (val) => {
if (typeof window == "undefined") return;
if (val !== state) {
setStorage(key, val, session, encode);
setState(val);
}
};
const removeValue = () => {
if (typeof window == "undefined") return;
removeStorage(key, session);
setState(undefined);
};
useEffect(() => {
if (typeof window == "undefined") return;
if (session) return;
const listener = (e) => {
if (e.key === key)
setState(decode(e.newValue));
};
// register change listener
window.addEventListener('storage', listener);
// unregister at destroy
return () => window.removeEventListener('storage', listener);
}, [key, session]);
return [state, updateValue, removeValue];
};
export const setJsonStorage = (key, value, session = false) =>
setStorage(key, value, session, JSON.stringify);
export const getJsonStorage = (key, initValue = undefined, session = false) =>
getStorage(key, initValue, session, JSON.parse);
export const useJsonStorage = (key, initValue = undefined, session = false) =>
useStorage(key, initValue, session, JSON.parse, JSON.stringify);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment