diff --git a/awx/ui_next/src/screens/Project/ProjectJobTemplates/ProjectJobTemplates.jsx b/awx/ui_next/src/screens/Project/ProjectJobTemplates/ProjectJobTemplates.jsx
index b80f1a4c61..72b9af7989 100644
--- a/awx/ui_next/src/screens/Project/ProjectJobTemplates/ProjectJobTemplates.jsx
+++ b/awx/ui_next/src/screens/Project/ProjectJobTemplates/ProjectJobTemplates.jsx
@@ -1,10 +1,9 @@
-import React, { Component } from 'react';
-import { CardBody } from '@components/Card';
+import React from 'react';
+import { withRouter } from 'react-router-dom';
+import TemplateList from '../../Template/TemplateList/TemplateList';
-class ProjectJobTemplates extends Component {
- render() {
- return Coming soon :);
- }
+function ProjectJobTemplates() {
+ return ;
}
-export default ProjectJobTemplates;
+export default withRouter(ProjectJobTemplates);
diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplateList.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplateList.jsx
index 8c99916999..9406866468 100644
--- a/awx/ui_next/src/screens/Template/TemplateList/TemplateList.jsx
+++ b/awx/ui_next/src/screens/Template/TemplateList/TemplateList.jsx
@@ -109,12 +109,14 @@ class TemplatesList extends Component {
}
async loadTemplates() {
- const { location } = this.props;
+ const { location, match } = this.props;
const {
jtActions: cachedJTActions,
wfjtActions: cachedWFJTActions,
} = this.state;
- const params = parseQueryString(QS_CONFIG, location.search);
+ const params = {
+ ...parseQueryString(QS_CONFIG, location.search),
+ };
let jtOptionsPromise;
if (cachedJTActions) {
@@ -133,6 +135,9 @@ class TemplatesList extends Component {
} else {
wfjtOptionsPromise = WorkflowJobTemplatesAPI.readOptions();
}
+ if (match.url.startsWith('/projects') && match.params.id) {
+ params.jobtemplate__project = match.params.id;
+ }
const promises = Promise.all([
UnifiedJobTemplatesAPI.read(params),
@@ -189,13 +194,13 @@ class TemplatesList extends Component {
if (canAddJT) {
addButtonOptions.push({
label: i18n._(t`Template`),
- url: `${match.url}/job_template/add/`,
+ url: `/templates/job_template/add/`,
});
}
if (canAddWFJT) {
addButtonOptions.push({
label: i18n._(t`Workflow Template`),
- url: `${match.url}/workflow_job_template/add/`,
+ url: `/templates/workflow_job_template/add/`,
});
}
const isAllSelected =
@@ -204,7 +209,7 @@ class TemplatesList extends Component {
);
return (
-
+ <>
-
+ >
);
}
}
diff --git a/awx/ui_next/src/screens/Template/TemplateList/TemplatesList.test.jsx b/awx/ui_next/src/screens/Template/TemplateList/TemplatesList.test.jsx
index ab923d471d..108caece3a 100644
--- a/awx/ui_next/src/screens/Template/TemplateList/TemplatesList.test.jsx
+++ b/awx/ui_next/src/screens/Template/TemplateList/TemplatesList.test.jsx
@@ -1,4 +1,6 @@
import React from 'react';
+import { createMemoryHistory } from 'history';
+import { Route } from 'react-router-dom';
import {
JobTemplatesAPI,
UnifiedJobTemplatesAPI,
@@ -229,4 +231,38 @@ describe('', () => {
done();
});
+ test('Calls API with jobtemplate__project id', async () => {
+ const history = createMemoryHistory({
+ initialEntries: ['/projects/6/job_templates'],
+ });
+ const wrapper = mountWithContexts(
+ }
+ />,
+ {
+ context: {
+ router: {
+ history,
+ route: {
+ location: history.location,
+ match: { params: { id: 6 } },
+ },
+ },
+ },
+ }
+ );
+ await waitForElement(
+ wrapper,
+ 'TemplatesList',
+ el => el.state('hasContentLoading') === true
+ );
+ expect(UnifiedJobTemplatesAPI.read).toBeCalledWith({
+ jobtemplate__project: '6',
+ order_by: 'name',
+ page: 1,
+ page_size: 20,
+ type: 'job_template,workflow_job_template',
+ });
+ });
});