how to use useNavigate[react-router-dom] in Modal.method() [antd]

Question

repo : https://codesandbox.io/s/modal-flickering-vwqcww?file=/App.js

error message: useNavigate() may be used only in the context of a <Router> component.

import { Button } from "antd";
import Modal from "antd/es/modal/Modal";
import { useNavigate } from "react-router-dom";

const CustomCpn = () => {
  const navigate = useNavigate();
  return <div>Cpn</div>;
};

const App = () => {
  return (
    <Button
      onClick={() =>
        Modal.info({
          content: <CustomCpn />
        })
      }
    >
      show Modal
    </Button>
  );
};

export default App;

how to use useNavigate[react-router-dom] in Modal.method() [antd]