The persistence key
The initial value when no stored value exists
A tuple of [value, setValue] identical to useState
Works like useState, but values persist between page loads and remain in
sync across multiple browser tabs of the same origin. Safe to call in SSR
(returns defaultValue until hydration). Corrupted persisted values fall
back to defaultValue.
import { usePersistedState } from '@hiyve/utilities';
function JoinForm() {
const [userName, setUserName] = usePersistedState('hiyve-userName', '');
const [roomName, setRoomName] = usePersistedState('hiyve-roomName', '');
return (
<>
<input value={userName} onChange={(e) => setUserName(e.target.value)} />
<input value={roomName} onChange={(e) => setRoomName(e.target.value)} />
</>
);
}
React hook that persists state across sessions and synchronizes across tabs.