commas

frontend/src/hook/useInterval.js

@@ -0,0 +1,23 @@
+import { useEffect, useRef } from 'react';
+
+// https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+const useInterval = (callback, delay) => {
+  const savedCallback = useRef();
+
+  // Remember the latest callback.
+  useEffect(() => {
+    savedCallback.current = callback;
+  }, [callback]);
+
+  // Set up the interval.
+  useEffect(() => {
+    const tick = () => savedCallback.current();
+    if (delay !== null) {
+      const id = setInterval(tick, delay);
+      return () => clearInterval(id);
+    }
+    return () => {};
+  }, [delay]);
+};
+
+export default useInterval;

frontend/src/hook/usePersist.js

@@ -0,0 +1,16 @@
+import { useEffect } from 'react';
+
+const DEFAULT_STATE_KEY = 'state';
+
+export const usePersistedContext = (context, key = DEFAULT_STATE_KEY) => {
+  const persistedContext = localStorage.getItem(key);
+  return persistedContext ? JSON.parse(persistedContext) : context;
+};
+
+export const usePersistedReducer = ([state, dispatch], key = DEFAULT_STATE_KEY) => {
+  useEffect(
+    () => localStorage.setItem(key, JSON.stringify(state)),
+    [key, state],
+  );
+  return [state, dispatch];
+};