Merge pull request #2126 from JoinColony/fix/2121-back-button-breaks-app

Consistent back button redirects

Author: rdig

src/modules/dashboard/components/ColonyHome/ColonyHome.tsx

@@ -117,6 +117,9 @@ const ColonyHome = ({ match, location }: Props) => {
         return [{ id: 'domain.root' }];
 
       default:
+        if (!domains) {
+          return [{ id: 'domain.root' }];
+        }
         return domains[filteredDomainId]
           ? [{ id: 'domain.root' }, domains[filteredDomainId].name]
           : [{ id: 'domain.root' }];

src/routes/ConnectedOnlyRoute.tsx

@@ -4,11 +4,13 @@ import { Route, Redirect, RouteProps } from 'react-router-dom';
 import { CONNECT_ROUTE } from './routeConstants';
 import { RouteComponentProps } from '~pages/RouteLayouts';
 
+type routePropsFn = (params: any) => RouteComponentProps;
+
 interface Props extends RouteProps {
   component: ComponentType<any>;
   layout: ComponentType<any>;
   isConnected?: boolean;
-  routeProps?: RouteComponentProps;
+  routeProps?: RouteComponentProps | routePropsFn;
 }
 
 const ConnectedOnlyRoute = ({
@@ -24,11 +26,16 @@ const ConnectedOnlyRoute = ({
      * Render props that are passed directly to the route Component
      */
     render={props => {
-      const { location } = props;
+      const {
+        location,
+        match: { params },
+      } = props;
+      const passedDownRouteProps =
+        typeof routeProps !== 'function' ? routeProps : routeProps(params);
       if (isConnected) {
         return (
-          <Layout routeProps={routeProps} {...props}>
-            <Component routeProps={routeProps} {...props} />
+          <Layout routeProps={passedDownRouteProps} {...props}>
+            <Component routeProps={passedDownRouteProps} {...props} />
           </Layout>
         );
       }

src/routes/Routes.tsx

@@ -124,29 +124,32 @@ const Routes = () => {
         path={ADMIN_DASHBOARD_ROUTE}
         component={AdminDashboard}
         layout={NavBar}
-        routeProps={{
+        routeProps={({ colonyName }) => ({
           backText: ColonyBackText,
-        }}
+          backRoute: `/colony/${colonyName}`,
+        })}
       />
       <ConnectedOnlyRoute
         exact
         isConnected={isConnected}
         path={TASK_ROUTE}
         component={Task}
         layout={NavBar}
-        routeProps={{
+        routeProps={({ colonyName }) => ({
           backText: ColonyBackText,
-        }}
+          backRoute: `/colony/${colonyName}`,
+        })}
       />
       <ConnectedOnlyRoute
         exact
         isConnected={isConnected}
         path={LEVEL_EDIT_ROUTE}
         component={LevelEdit}
         layout={NavBar}
-        routeProps={{
+        routeProps={({ colonyName, programId }) => ({
           backText: ProgramBackText,
-        }}
+          backRoute: `/colony/${colonyName}/program/${programId}`,
+        })}
       />
       <ConnectedOnlyRoute
         isConnected={isConnected}