useStateWithHistory.js

function useStateWithHistory(defaultValue) {
  const history = useRef([defaultValue])
  const [index, setIndex] = useState(0)

  function undo() {
    setIndex(index > 0 ? index - 1 : index)
  }
  function redo() {
    setIndex(index < history.current.length - 1 ? index + 1 : index)
  }
  function setValue(newValue) {
    history.current.push(newValue)
    setIndex(index + 1)
  }

  return [history.current[index], setValue, undo, redo]
}

// Use it like this:
const [value, setValue, undo, redo] = useStateWithHistory('some value')