The error state > Unhandled Rejection (TypeError): Cannot read properties of undefined (reading 'undo') History.undo

please how can I implement a code to undoDisable and redoDisabled that would make my code stop running once the last undo/redo have been triggered so I don't get the error again**

below is my code that handles the undo and redo action

  const handleUndokey = async (e: KeyboardEvent) => {
    const zKey = 'z';
    if (e.ctrlKey && e.key === zKey) {
      designer.clearSelectedElements();
      await history.undo();
      dispatch(updateDesigner(designer));
      saveDesigner();
    }
  };

  useEffect(() => {
    document.addEventListener('keydown', handleUndokey);
    return () => {
      document.removeEventListener('keydown', handleUndokey);
    };
  }, []);

  const handleRedoKey = async (e: KeyboardEvent) => {
    const yKey = 'y';
    if (e.ctrlKey && e.key === yKey) {
      designer.clearSelectedElements();
      await history.redo();
      dispatch(updateDesigner(designer));
      saveDesigner();
    }
  };

  useEffect(() => {
    document.addEventListener('keydown', handleRedoKey);
    return () => {
      document.removeEventListener('keydown', handleRedoKey);
    };
  }, []);