Consistent namespaced routes (#1622)

* Update app routes with consistent namespace.

* Update catalog routes.

* Update header links.

dashboard/src/components/AppList/AppListItem.test.tsx

@@ -32,7 +32,7 @@ it("renders an app item", () => {
       .find(Link)
       .at(0)
       .props().to,
-  ).toBe("/apps/ns/default/foo");
+  ).toBe("/ns/default/apps/foo");
   expect(card.find(".type-color-light-blue").text()).toBe("myapp v1.0.0");
   expect(card.find(".deployed").exists()).toBe(true);
   expect(card.find(".ListItem__content__info_tag-1").text()).toBe("default");

dashboard/src/components/AppList/AppListItem.tsx

@@ -21,7 +21,7 @@ class AppListItem extends React.Component<IAppListItemProps> {
     return (
       <InfoCard
         key={app.releaseName}
-        link={`/apps/ns/${app.namespace}/${app.releaseName}`}
+        link={`/ns/${app.namespace}/apps/${app.releaseName}`}
         title={app.releaseName}
         icon={icon}
         info={`${app.chart} v${app.version || "-"}`}

dashboard/src/components/AppView/AppControls/AppControls.test.tsx

@@ -40,7 +40,7 @@ it("calls delete function when clicking the button", done => {
     wrapper.update();
     const redirect = wrapper.find(Redirect);
     expect(redirect.props()).toMatchObject({
-      to: `/apps/ns/${namespace}`,
+      to: `/ns/${namespace}/apps`,
     } as any);
     done();
   }, 1);

dashboard/src/components/AppView/AppControls/AppControls.tsx

@@ -83,7 +83,7 @@ class AppControls extends React.Component<IAppControlsProps, IAppControlsState>
             )
           }
         />
-        {this.state.redirectToAppList && <Redirect to={`/apps/ns/${namespace}`} />}
+        {this.state.redirectToAppList && <Redirect to={`/ns/${namespace}/apps`} />}
       </div>
     );
   }

dashboard/src/components/AppView/AppControls/UpgradeButton.test.tsx

@@ -17,7 +17,7 @@ it("renders a redirect when clicking upgrade", () => {
 
   button.simulate("click");
   expect(push.mock.calls.length).toBe(1);
-  expect(push.mock.calls[0]).toEqual(["/apps/ns/default/upgrade/foo"]);
+  expect(push.mock.calls[0]).toEqual(["/ns/default/apps/foo/upgrade"]);
 });
 
 context("when a new version is available", () => {

dashboard/src/components/AppView/AppControls/UpgradeButton.tsx

@@ -11,7 +11,7 @@ interface IUpgradeButtonProps {
 
 const UpgradeButton: React.SFC<IUpgradeButtonProps> = props => {
   const { newVersion, push, releaseName, releaseNamespace } = props;
-  const onClick = () => push(`/apps/ns/${releaseNamespace}/upgrade/${releaseName}`);
+  const onClick = () => push(`/ns/${releaseNamespace}/apps/${releaseName}/upgrade`);
   let upgradeButton = (
     <button className="button" onClick={onClick}>
       Upgrade

dashboard/src/components/AppView/ChartInfo.tsx

@@ -99,7 +99,7 @@ class ChartInfo extends React.Component<IChartInfoProps> {
               {update}
               <br />
               <span>
-                Click <Link to={`/apps/ns/${app.namespace}/upgrade/${app.name}`}>here</Link> to
+                Click <Link to={`/ns/${app.namespace}/apps/${app.name}/upgrade`}>here</Link> to
                 upgrade.
               </span>
             </React.Fragment>

dashboard/src/components/ChartView/ChartDeployButton.test.tsx

@@ -30,11 +30,11 @@ it("renders a button to deploy the chart version", () => {
 
 it("renders a redirect with the correct URL when the button is clicked", () => {
   const testCases = [
-    { namespace: "test", version: "1.2.3", url: "/apps/ns/test/new/testrepo/test/versions/1.2.3" },
+    { namespace: "test", version: "1.2.3", url: "/ns/test/apps/new/testrepo/test/versions/1.2.3" },
     {
       namespace: "foo",
       version: "alpha-0",
-      url: "/apps/ns/foo/new/testrepo/test/versions/alpha-0",
+      url: "/ns/foo/apps/new/testrepo/test/versions/alpha-0",
     },
   ];
 

dashboard/src/components/ChartView/ChartDeployButton.tsx

@@ -31,7 +31,7 @@ class ChartDeployButton extends React.Component<IChartDeployButtonProps, IChartD
         {this.state.clicked && (
           <Redirect
             push={true}
-            to={`/apps/ns/${namespace}/new/${repoName}/${chartName}/versions/${versionStr}`}
+            to={`/ns/${namespace}/apps/new/${repoName}/${chartName}/versions/${versionStr}`}
           />
         )}
       </div>

dashboard/src/components/Config/AppRepoList/AppRepoListItem.tsx

@@ -26,7 +26,7 @@ export class AppRepoListItem extends React.Component<IAppRepoListItemProps, IApp
     return (
       <tr key={repo.metadata.name}>
         <td>
-          <Link to={`/catalog/ns/${namespace}/${repo.metadata.name}`}>{repo.metadata.name}</Link>
+          <Link to={`/ns/${namespace}/catalog/${repo.metadata.name}`}>{repo.metadata.name}</Link>
         </td>
         {renderNamespace && <td>{repo.metadata.namespace}</td>}
         <td>{repo.spec && repo.spec.url}</td>

dashboard/src/components/DeploymentForm/DeploymentForm.test.tsx

@@ -180,7 +180,7 @@ it("triggers a deployment when submitting the form", done => {
   wrapper.find("form").simulate("submit");
   expect(deployChart).toHaveBeenCalledWith(versions[0], releaseName, namespace, appValues, schema);
   setTimeout(() => {
-    expect(push).toHaveBeenCalledWith("/apps/ns/default/my-release");
+    expect(push).toHaveBeenCalledWith("/ns/default/apps/my-release");
     done();
   }, 1);
 });

dashboard/src/components/DeploymentForm/DeploymentForm.tsx

@@ -166,7 +166,7 @@ class DeploymentForm extends React.Component<IDeploymentFormProps, IDeploymentFo
       );
       this.setState({ isDeploying: false });
       if (deployed) {
-        push(`/apps/ns/${namespace}/${releaseName}`);
+        push(`/ns/${namespace}/apps/${releaseName}`);
       }
     }
   };

dashboard/src/components/DeploymentFormBody/DeploymentFormBody.tsx

@@ -144,7 +144,7 @@ class DeploymentFormBody extends React.Component<
       getChartVersion(chartID, e.currentTarget.value);
     } else {
       this.props.push(
-        `/apps/ns/${this.props.namespace}/new/${this.props.chartID}/versions/${e.currentTarget.value}`,
+        `/ns/${this.props.namespace}/apps/new/${this.props.chartID}/versions/${e.currentTarget.value}`,
       );
     }
   };

dashboard/src/components/Header/Header.test.tsx

@@ -24,9 +24,9 @@ it("renders the header links and titles", () => {
   const menubar = wrapper.find(".header__nav__menu").first();
   const items = menubar.children().map(p => p.props().children.props);
   const expectedItems = [
-    { children: "Applications", to: "/apps" },
-    { children: "Catalog", to: "/catalog" },
-    { children: "Service Instances (alpha)", to: "/services/instances" },
+    { children: "Applications", to: "apps" },
+    { children: "Catalog", to: "catalog" },
+    { children: "Service Instances (alpha)", to: "services/instances" },
   ];
   items.forEach((item, index) => {
     expect(item.children).toBe(expectedItems[index].children);

dashboard/src/components/Header/Header.tsx

@@ -43,17 +43,17 @@ class Header extends React.Component<IHeaderProps, IHeaderState> {
       children: "Applications",
       exact: true,
       namespaced: true,
-      to: "/apps",
+      to: "apps",
     },
     {
       children: "Catalog",
       namespaced: true,
-      to: "/catalog",
+      to: "catalog",
     },
     {
       children: "Service Instances (alpha)",
       namespaced: true,
-      to: "/services/instances",
+      to: "services/instances",
     },
   ];
 

dashboard/src/components/Header/HeaderLink.tsx

@@ -19,7 +19,7 @@ class HeaderLink extends React.Component<IHeaderLinkProps> {
 
   public renderInternalLink() {
     const { currentNamespace, namespaced, to } = this.props;
-    const link = currentNamespace && namespaced ? `${to}/ns/${currentNamespace}` : to;
+    const link = currentNamespace && namespaced ? `/ns/${currentNamespace}/${to}` : to;
     return (
       <NavLink
         to={link}

dashboard/src/components/OperatorInstance/OperatorInstance.test.tsx

@@ -104,7 +104,7 @@ describe("renders a resource", () => {
     expect(deleteResource).toHaveBeenCalledWith(defaultProps.namespace, "foo", resource);
     // wait async calls
     await new Promise(r => r());
-    expect(push).toHaveBeenCalledWith(`/apps/ns/${defaultProps.namespace}`);
+    expect(push).toHaveBeenCalledWith(`/ns/${defaultProps.namespace}/apps`);
   });
 
   it("updates the state with the CRD resources", () => {

dashboard/src/components/OperatorInstance/OperatorInstance.tsx

@@ -262,7 +262,7 @@ class OperatorInstance extends React.Component<IOperatorInstanceProps, IOperator
     const deleted = await this.props.deleteResource(namespace, crd!.name.split(".")[0], resource!);
     this.closeModal();
     if (deleted) {
-      this.props.push(`/apps/ns/${namespace}`);
+      this.props.push(`/ns/${namespace}/apps`);
     }
   };
 }

dashboard/src/components/UpgradeForm/UpgradeForm.test.tsx

@@ -109,7 +109,7 @@ it("triggers an upgrade when submitting the form", done => {
   wrapper.find("form").simulate("submit");
   expect(upgradeApp).toHaveBeenCalledWith(versions[0], releaseName, namespace, appValues, schema);
   setTimeout(() => {
-    expect(push).toHaveBeenCalledWith("/apps/ns/default/my-release");
+    expect(push).toHaveBeenCalledWith("/ns/default/apps/my-release");
     done();
   }, 1);
 });

dashboard/src/components/UpgradeForm/UpgradeForm.tsx

@@ -137,7 +137,7 @@ class UpgradeForm extends React.Component<IUpgradeFormProps, IUpgradeFormState>
       );
       this.setState({ isDeploying: false });
       if (deployed) {
-        push(`/apps/ns/${namespace}/${releaseName}`);
+        push(`/ns/${namespace}/apps/${releaseName}`);
       }
     }
   };

dashboard/src/containers/RoutesContainer/Routes.test.tsx

@@ -41,7 +41,7 @@ it("should render a redirect to the default namespace", () => {
     </StaticRouter>,
   );
   expect(wrapper.find(NotFound)).not.toExist();
-  expect(wrapper.find(Redirect).prop("to")).toEqual("/apps/ns/default");
+  expect(wrapper.find(Redirect).prop("to")).toEqual("/ns/default/apps");
 });
 
 it("should render a redirect to the login page", () => {

dashboard/src/containers/RoutesContainer/Routes.tsx

@@ -25,19 +25,19 @@ import ServiceInstanceViewContainer from "../../containers/ServiceInstanceViewCo
 type IRouteComponentPropsAndRouteProps = RouteProps & RouteComponentProps<any>;
 
 const privateRoutes = {
-  "/apps/ns/:namespace": AppListContainer,
-  "/apps/ns/:namespace/:releaseName": AppViewContainer,
-  "/apps/ns/:namespace/new/:repo/:id/versions/:version": AppNewContainer,
-  "/apps/ns/:namespace/upgrade/:releaseName": AppUpgradeContainer,
-  "/catalog/ns/:namespace": CatalogContainer,
-  "/catalog/ns/:namespace/:repo": CatalogContainer,
+  "/ns/:namespace/apps": AppListContainer,
+  "/ns/:namespace/apps/:releaseName": AppViewContainer,
+  "/ns/:namespace/apps/:releaseName/upgrade": AppUpgradeContainer,
+  "/ns/:namespace/apps/new/:repo/:id/versions/:version": AppNewContainer,
+  "/ns/:namespace/catalog": CatalogContainer,
+  "/ns/:namespace/catalog/:repo": CatalogContainer,
   "/charts/:repo/:id": ChartViewContainer,
   "/charts/:repo/:id/versions/:version": ChartViewContainer,
   "/config/brokers": ServiceBrokerListContainer,
   "/services/brokers/:brokerName/classes/:className": ServiceClassViewContainer,
   "/services/brokers/:brokerName/instances/ns/:namespace/:instanceName": ServiceInstanceViewContainer,
   "/services/classes": ServiceClassListContainer,
-  "/services/instances/ns/:namespace": ServiceInstanceListContainer,
+  "/ns/:namespace/services/instances": ServiceInstanceListContainer,
 } as const;
 
 // Public routes that don't require authentication
@@ -96,7 +96,7 @@ class Routes extends React.Component<IRoutesProps> {
   }
   private rootNamespacedRedirect = () => {
     if (this.props.namespace && this.props.authenticated) {
-      return <Redirect to={`/apps/ns/${this.props.namespace}`} />;
+      return <Redirect to={`/ns/${this.props.namespace}/apps`} />;
     }
     // There is not a default namespace, redirect to login page
     return <Redirect to={"/login"} />;