Skip to content

Instantly share code, notes, and snippets.

@fedek6
Created August 2, 2021 20:32
Show Gist options
  • Star 7 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save fedek6/fd494ee3d33e79d0a3968d4741e646d7 to your computer and use it in GitHub Desktop.
Save fedek6/fd494ee3d33e79d0a3968d4741e646d7 to your computer and use it in GitHub Desktop.
Working useLocalStorage hook for Next.js (no warnings in console)
/* eslint-disable no-console */
/* eslint-disable react-hooks/exhaustive-deps */
import { useState, useEffect } from "react";
export const useLocalStorage = <T>(key: string, initialValue: T) => {
const [storedValue, setStoredValue] = useState<T | undefined>();
const setValue = (value: T) => {
window.localStorage.setItem(key, JSON.stringify(value));
};
useEffect(() => {
const value = window.localStorage.getItem(key);
if (value) {
try {
const parsed = JSON.parse(value) as T;
setStoredValue(parsed);
} catch (error) {
console.log(error);
setStoredValue(initialValue);
}
} else {
setStoredValue(initialValue);
}
}, []);
useEffect(() => {
if (storedValue) {
setValue(storedValue);
}
}, [storedValue]);
return [storedValue as T, setStoredValue] as const;
};
@erycson-cubo
Copy link

thanks bro

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment