Make hasPathChanged on the Guard component configurable

[glennverschooren]

trafficstars

Description

The parent route will rerender (destroy and initialize) each time the user navigates between child routes. This can cause issues when fetching data inside a container/parent component or when the parent component must hold some state because the component will lose his current state each time the user navigates between the child routes.

Therefore I thought it will be a good idea to make the hasPathChanged function configurable so the developer can choose when the guards of the parent should be called.

Example: Navigate to /users => check user guards Navigate from /users to /users/123 => don't check the /user guards (don't destroy the /users route) Navigate from /users/123 to /users/overview => don't check the /user guards (don't destroy the /users route)

What this does

It will allow the developer to set his own hasPathChanged function.

const isPathChanged = (
    routePrevProps: RouteComponentProps,
    routeProps: RouteComponentProps,
    path?: string | string[]): boolean =>  {
    // custome isPathChanged function
    return true;
}

<GuardedRoute
    path={route.path}
    pathChanged={isPathChanged}
    component={UsersComponent}/>