TypeError: blocker.reset is not a function – useBlocker from react router dom v6.24

I’m using the useBlocker hook to display a custom modal alerting users about unsaved changes. The custom popup successfully triggers when the user attempts to navigate away. After form submission, the user should be redirected to the dashboard, so I’m calling blocker.proceed or blocker.reset to prevent the page from being blocked. but getting following error

TypeError: blocker.reset is not a function

index.js

const blocker = useBlocker(
    ({ currentLocation, nextLocation }) =>
      formData.projectName !== '' &&
      currentLocation.pathname !== nextLocation.pathname
  );

  useEffect(() => {
    if (createSolutionSpaceRes || createSolutionSpaceErrorRes) {

     blocker?.proceed() // error TypeError: blocker.proceed is not a function 
    }
    return () => {
      blocker?.reset();// error TypeError: blocker.reset is not a function 
    };
  }, [createSolutionSpaceRes, createSolutionSpaceErrorRes,blocker]);

following this example react router dom useBlocker hook