From 4666d7871a9e064a3b3033c7c1daa9c3c4972d98 Mon Sep 17 00:00:00 2001 From: Logan Hunt Date: Thu, 19 Jan 2023 14:04:10 -0700 Subject: Web Client (#11) * Github Oauth * A simple frontend * Add middleware proxy on dev * Forward proxy and rewrite path, add oauth to frontend, increase jwt expiry time to 12 hours * Some simple style changes * Add keys as user * Checkpoint - auth is broken * Fix auth and use player model, unrelated to this pr: flip board if dark * Close player session when password or key deleted or put * Add build script - this branch is quickly becoming cringe * Docker v2 - add migration and scripts, fix local storage and index that caused build issues * Ignore keys, proxy api correctly nginx * Finally nginx is resolved jesus christ * Remove max screen dimension limits cuz cringe * Cursor highlight * Add password form, some minor frontend changes as well * Remove cringe on home page * Move to 127.0.0.1 loopback in env * Add github id in player structs for tests --- front/src/hooks/useLocalStorage.js | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 front/src/hooks/useLocalStorage.js (limited to 'front/src/hooks') diff --git a/front/src/hooks/useLocalStorage.js b/front/src/hooks/useLocalStorage.js new file mode 100644 index 0000000..f00a11b --- /dev/null +++ b/front/src/hooks/useLocalStorage.js @@ -0,0 +1,31 @@ +import { useState, useEffect } from "react"; + +const STORAGE_KEYS_PREFIX = "chessh-"; + +const useStorage = (storage, keyPrefix) => (storageKey, fallbackState) => { + if (!storageKey) + throw new Error( + `"storageKey" must be a nonempty string, but "${storageKey}" was passed.` + ); + + const storedString = storage.getItem(keyPrefix + storageKey); + let parsedObject = null; + + if (storedString !== null) parsedObject = JSON.parse(storedString); + + // eslint-disable-next-line react-hooks/rules-of-hooks + const [value, setValue] = useState(parsedObject ?? fallbackState); + + // eslint-disable-next-line react-hooks/rules-of-hooks + useEffect(() => { + storage.setItem(keyPrefix + storageKey, JSON.stringify(value)); + }, [value, storageKey]); + + return [value, setValue]; +}; + +// eslint-disable-next-line react-hooks/rules-of-hooks +export const useLocalStorage = useStorage( + window.localStorage, + STORAGE_KEYS_PREFIX +); -- cgit v1.2.3-70-g09d2