@supunlakmal/hooks/dist/hooks/state-management/useHistoryState.js

A collection of reusable React hooks

import { useState, useCallback } from 'react';
export function useHistoryState(initialState) {
    const [state, setState] = useState({
        history: [initialState],
        pointer: 0,
    });
    const present = state.history[state.pointer];
    const setPresentState = useCallback((newState) => {
        setState((prevState) => {
            const newHistory = prevState.history.slice(0, prevState.pointer + 1);
            return {
                history: [...newHistory, newState],
                pointer: prevState.pointer + 1,
            };
        });
    }, []);
    const goBack = useCallback(() => {
        setState((prevState) => (Object.assign(Object.assign({}, prevState), { pointer: Math.max(0, prevState.pointer - 1) })));
    }, []);
    const goForward = useCallback(() => {
        setState((prevState) => (Object.assign(Object.assign({}, prevState), { pointer: Math.min(prevState.history.length - 1, prevState.pointer + 1) })));
    }, []);
    const canGoBack = state.pointer > 0;
    const canGoForward = state.pointer < state.history.length - 1;
    return [present, setPresentState, goBack, goForward, canGoBack, canGoForward];
}
//# sourceMappingURL=useHistoryState.js.map