[Proposal] Add Navigate feature

[bstivenprz]

Hey there!

I propose to add Navigate component from react-router-dom to makeRoute, something like this:

export default function AuthenticationLayout() {
  if (!authenticated)
    return <LoginRoute.Navigate />;

  return <HomeRoute.Navigate />;
}

I made this changes for my own:

export type RouteBuilder<
  Params extends z.ZodSchema,
  Search extends z.ZodSchema
> = {
  Navigate: React.FC<
    Omit<NavigateProps, "to"> & z.input<Params> & { search?: z.input<Search> }
  >;
};

routeBuilder.Navigate = function RouteLink({
  search: linkSearch,
  ...props
}: Omit<NavigateProps, "to"> & z.input<Params> & { search?: z.input<Search> }) {
  const params = info.params.parse(props);
  const extraProps = { ...props };
  for (const key of Object.keys(params)) {
    delete extraProps[key];
  }
  return (
    <Navigate
      {...props}
      to={routeBuilder(info.params.parse(props), linkSearch)}
    />
  );
};

This would work great for this cases. Works for me.

What do you think?

hgd

[jherr]

Is this just for the React-router?

[jherr]

This would probably be better as a PR.

[DJanocha]

@bstivenprz
Can’t you just use code like this below?
‘’’
export default function AuthenticationLayout() {
const router =useRouter()
//option1 for react:

const href = authenticated? LoginRoute(): HomeRoute();
router.push(href)
return null;

//option2 for next js:

const href = authenticated? LoginRoute(): HomeRoute();
navigate(href)
}

‘’’
Sorry for syntax, I’m texting from my phone

[jherr]

I really don't understand what you want. Do you want to add authentication to the routebuilder? You can modify the source in your project to add that.

[DJanocha]

If you ask me, @jherr , I was trying to propose an alternative way to achieve the same thing as that Navigate component would do, but using current state of declarative routing :)

[jherr]

I was just confused by the authentication stuff in your recent comment. My original point was that the code you provided is good enough for a PR so you should just make a PR and then we can integrate it into the project.

[DJanocha]

@jherr I believe you might have mistaken me with @bstivenprz 😅