Why NavigateFunction type is shown cannot be found when assigning it to react-router navigate?

I am trying to migrate my functions from function components to a separate file.

Function component code:

const Signup = () => {
  let navigate = useNavigate();   

  return (
    ............
    <Form className="SignupForm" onSubmit={() => onSignupHandler(navigate)}>
  )
}

Here is the onSignUpHandler function code:

export const onSignupHandler = (navigate: NavigateFunction) => {
  // Some code ...............
};

I am trying to assign navigate type of NavigateFunction but I get error as Cannot find name 'NavigateFunction'.

>Solution :

You are missing it the imports. Add to the file where onSignUpHandler is:

import { NavigateFunction } from "react-router-dom";