I want to make protected route using Reach Router. In React Router v4 I could use Route render() method to achive this:
function PrivateRoute({ component: Component, ...rest }) {
return (
<Route
{...rest}
render={props =>
fakeAuth.isAuthenticated ? (
<Component {...props} />
) : (
<Redirect
to={{
pathname: "/login",
state: { from: props.location }
}}
/>
)
}
/>
);
}
and then declare route:
<PrivateRoute path="/protected" component={Protected} />
I don't know how to access or modify render() method in Reach Router:
<Router>
<Results path="/" />
<Details path="/details/:id" />
</Router>
How can I do this using Reach Router? There has to be a better way then writing conditions in render() method inside a protected component.