Estoy trabajando en un proyecto de reacción en el que creé un componente usando <Promp/> de react-router para implementar un cuadro de diálogo de confirmación que aparece cuando el usuario intenta abandonar la ruta sin guardar los cambios actuales:

El componente funciona correctamente cuando trato de salir de la ruta actual, pero también quiero mostrar el cuadro de diálogo cuando el usuario hace clic en un botón destinado a descartar los cambios intencionalmente. Dado que modal solo se muestra en función de un cambio de ruta, una solución que podría pensar es llamar a history.push cuando se hace clic en el botón:

 const history = useHistory(); const { pathname } = useLocation(); const onCancel = () => { history.push(pathname); };

que empuja la misma ruta y de esta manera los cambios se descartan y el usuario permanece en la misma página como si nada sucediera, pero ahora el problema con esta solución es que el usuario no podrá volver a la ruta anterior porque la pila de historial se está acumulando lleno con la misma ubicación, así que para resolver esto traté de usar history.replace , que está destinado a reemplazar la parte superior de la pila en lugar de insertar un nuevo elemento, pero no funciona de esta manera y actúa como history.push added nuevos elementos con la misma ubicación.

¿Es este error o me estoy perdiendo algo? ¿Qué podría ser una solución para esto?
Cualquier sugerencia es bienvenida.