Merge pull request #7284 from AlexSCorey/7232-ApplicationsRouteStub

Adds routing stubs for Applications

Reviewed-by: https://github.com/apps/softwarefactory-project-zuul

awx/ui_next/src/routeConfig.js

@@ -138,7 +138,7 @@ function getRouteConfig(i18n) {
           screen: InstanceGroups,
         },
         {
-          title: i18n._(t`Integrations`),
+          title: i18n._(t`Applications`),
           path: '/applications',
           screen: Applications,
         },

awx/ui_next/src/screens/Application/Application/Application.jsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import { Route, Switch, Redirect } from 'react-router-dom';
+import ApplicationEdit from '../ApplicationEdit';
+import ApplicationDetails from '../ApplicationDetails';
+
+function Application() {
+  return (
+    <>
+      <Switch>
+        <Redirect
+          from="/applications/:id"
+          to="/applications/:id/details"
+          exact
+        />
+        <Route path="/applications/:id/edit">
+          <ApplicationEdit />
+        </Route>
+        <Route path="/applications/:id/details">
+          <ApplicationDetails />
+        </Route>
+      </Switch>
+    </>
+  );
+}
+
+export default Application;

awx/ui_next/src/screens/Application/Application/index.js

@@ -0,0 +1 @@
+export { default } from './Application';

awx/ui_next/src/screens/Application/ApplicationAdd/ApplicationAdd.jsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Card, PageSection } from '@patternfly/react-core';
+
+function ApplicatonAdd() {
+  return (
+    <>
+      <PageSection>
+        <Card>
+          <div>Applications Add</div>
+        </Card>
+      </PageSection>
+    </>
+  );
+}
+export default ApplicatonAdd;

awx/ui_next/src/screens/Application/ApplicationAdd/index.js

@@ -0,0 +1 @@
+export { default } from './ApplicationAdd';

awx/ui_next/src/screens/Application/ApplicationDetails/ApplicationDetails.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Card, PageSection } from '@patternfly/react-core';
+
+function ApplicationDetails() {
+  return (
+    <PageSection>
+      <Card>Application Details</Card>
+    </PageSection>
+  );
+}
+export default ApplicationDetails;

awx/ui_next/src/screens/Application/ApplicationDetails/index.js

@@ -0,0 +1 @@
+export { default } from './ApplicationDetails';

awx/ui_next/src/screens/Application/ApplicationEdit/ApplicationEdit.jsx

@@ -0,0 +1,11 @@
+import React from 'react';
+import { Card, PageSection } from '@patternfly/react-core';
+
+function ApplicationEdit() {
+  return (
+    <PageSection>
+      <Card>Application Edit</Card>
+    </PageSection>
+  );
+}
+export default ApplicationEdit;

awx/ui_next/src/screens/Application/ApplicationEdit/index.js

@@ -0,0 +1 @@
+export { default } from './ApplicationEdit';

awx/ui_next/src/screens/Application/Applications.jsx

@@ -1,26 +1,49 @@
-import React, { Component, Fragment } from 'react';
+import React, { useState, useCallback } from 'react';
 import { withI18n } from '@lingui/react';
 import { t } from '@lingui/macro';
-import {
+import { Route, Switch } from 'react-router-dom';
-  PageSection,
-  PageSectionVariants,
-  Title,
-} from '@patternfly/react-core';
 
-class Applications extends Component {
+import ApplicationsList from './ApplicationsList';
-  render() {
+import ApplicationAdd from './ApplicationAdd';
-    const { i18n } = this.props;
+import Application from './Application';
-    const { light } = PageSectionVariants;
+import Breadcrumbs from '../../components/Breadcrumbs';
 
-    return (
+function Applications({ i18n }) {
-      <Fragment>
+  const [breadcrumbConfig, setBreadcrumbConfig] = useState({
-        <PageSection variant={light} className="pf-m-condensed">
+    '/applications': i18n._(t`Applications`),
-          <Title size="2xl">{i18n._(t`Applications`)}</Title>
+    '/applications/add': i18n._(t`Create New Application`),
-        </PageSection>
+  });
-        <PageSection />
+
-      </Fragment>
+  const buildBreadcrumbConfig = useCallback(
-    );
+    application => {
-  }
+      if (!application) {
+        return;
+      }
+
+      setBreadcrumbConfig({
+        '/applications': i18n._(t`Applications`),
+        '/applications/add': i18n._(t`Create New Application`),
+        [`/application/${application.id}`]: `${application.name}`,
+      });
+    },
+    [i18n]
+  );
+  return (
+    <>
+      <Breadcrumbs breadcrumbConfig={breadcrumbConfig} />
+      <Switch>
+        <Route path="/applications/add">
+          <ApplicationAdd />
+        </Route>
+        <Route path="/applications/:id">
+          <Application setBreadcrumb={buildBreadcrumbConfig} />
+        </Route>
+        <Route path="/applications">
+          <ApplicationsList />
+        </Route>
+      </Switch>
+    </>
+  );
 }
 
 export default withI18n()(Applications);

awx/ui_next/src/screens/Application/Applications.test.jsx

@@ -7,12 +7,10 @@ import Applications from './Applications';
 describe('<Applications />', () => {
   let pageWrapper;
   let pageSections;
-  let title;
 
   beforeEach(() => {
     pageWrapper = mountWithContexts(<Applications />);
     pageSections = pageWrapper.find('PageSection');
-    title = pageWrapper.find('Title');
   });
 
   afterEach(() => {
@@ -21,9 +19,7 @@ describe('<Applications />', () => {
 
   test('initially renders without crashing', () => {
     expect(pageWrapper.length).toBe(1);
-    expect(pageSections.length).toBe(2);
+    expect(pageSections.length).toBe(1);
-    expect(title.length).toBe(1);
-    expect(title.props().size).toBe('2xl');
     expect(pageSections.first().props().variant).toBe('light');
   });
 });

awx/ui_next/src/screens/Application/ApplicationsList/ApplicationsList.jsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Card, PageSection } from '@patternfly/react-core';
+
+function ApplicationsList() {
+  return (
+    <>
+      <PageSection>
+        <Card>
+          <div>Applications List</div>
+        </Card>
+      </PageSection>
+    </>
+  );
+}
+export default ApplicationsList;

awx/ui_next/src/screens/Application/ApplicationsList/index.js

@@ -0,0 +1 @@
+export { default } from './ApplicationsList';