diff --git a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplate.jsx b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplate.jsx
index d271962a40..5182ba645a 100644
--- a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplate.jsx
+++ b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplate.jsx
@@ -1,5 +1,58 @@
-import React from 'react';
+import React, { useEffect, useCallback } from 'react';
+import { t } from '@lingui/macro';
+import { withI18n } from '@lingui/react';
+import { Card, PageSection } from '@patternfly/react-core';
+import { Link, useParams } from 'react-router-dom';
+import useRequest from '../../util/useRequest';
+import ContentError from '../../components/ContentError';
+import { NotificationTemplatesAPI } from '../../api';
+import NotificationTemplateDetail from './NotificationTemplateDetail';
-export default function NotificationTemplate() {
- return
;
+function NotificationTemplate({ i18n, setBreadcrumb }) {
+ const { id: templateId } = useParams();
+ const {
+ result: template,
+ isLoading,
+ error,
+ request: fetchTemplate,
+ } = useRequest(
+ useCallback(async () => {
+ const { data } = await NotificationTemplatesAPI.readDetail(templateId);
+ return data;
+ }, [templateId]),
+ null
+ );
+
+ useEffect(() => {
+ fetchTemplate();
+ }, [fetchTemplate]);
+
+ if (error) {
+ return (
+
+
+
+ {error.response.status === 404 && (
+
+ {i18n._(t`Notification Template not found.`)}{' '}
+
+ {i18n._(t`View all Notification Templates.`)}
+
+
+ )}
+
+
+
+ );
+ }
+
+ return (
+
+
+
+
+
+ );
}
+
+export default withI18n()(NotificationTemplate);
diff --git a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.jsx b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.jsx
new file mode 100644
index 0000000000..5c8a592a1c
--- /dev/null
+++ b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/NotificationTemplateDetail.jsx
@@ -0,0 +1,48 @@
+import React, { Fragment, useState, useEffect, useCallback } from 'react';
+import { Link, useHistory, useParams } from 'react-router-dom';
+import { withI18n } from '@lingui/react';
+import {
+ Button,
+ Chip,
+ TextList,
+ TextListItem,
+ TextListItemVariants,
+ TextListVariants,
+ Label,
+} from '@patternfly/react-core';
+import { t } from '@lingui/macro';
+
+import AlertModal from '../../../components/AlertModal';
+import { CardBody, CardActionsRow } from '../../../components/Card';
+import ChipGroup from '../../../components/ChipGroup';
+import ContentError from '../../../components/ContentError';
+import ContentLoading from '../../../components/ContentLoading';
+import CredentialChip from '../../../components/CredentialChip';
+import {
+ Detail,
+ DetailList,
+ DeletedDetail,
+ UserDateDetail,
+} from '../../../components/DetailList';
+import DeleteButton from '../../../components/DeleteButton';
+import ErrorDetail from '../../../components/ErrorDetail';
+import LaunchButton from '../../../components/LaunchButton';
+import { VariablesDetail } from '../../../components/CodeMirrorInput';
+import { JobTemplatesAPI } from '../../../api';
+import useRequest, { useDismissableError } from '../../../util/useRequest';
+
+function NotificationTemplateDetail({ i18n, template }) {
+ return (
+
+
+
+
+
+ );
+}
+
+export default withI18n()(NotificationTemplateDetail);
diff --git a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/index.js b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/index.js
new file mode 100644
index 0000000000..431403014d
--- /dev/null
+++ b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateDetail/index.js
@@ -0,0 +1 @@
+export default from './NotificationTemplateDetail';
diff --git a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateList/NotificationTemplateList.jsx b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateList/NotificationTemplateList.jsx
index 50d0f3f400..3dac16f6a2 100644
--- a/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateList/NotificationTemplateList.jsx
+++ b/awx/ui_next/src/screens/NotificationTemplate/NotificationTemplateList/NotificationTemplateList.jsx
@@ -105,12 +105,8 @@ function NotificationTemplatesList({ i18n }) {
isDefault: true,
},
{
- name: i18n._(t`Created By (Username)`),
- key: 'created_by__username',
- },
- {
- name: i18n._(t`Modified By (Username)`),
- key: 'modified_by__username',
+ name: i18n._(t`Type`),
+ key: 'notification_type',
},
]}
toolbarSortColumns={[
@@ -118,6 +114,10 @@ function NotificationTemplatesList({ i18n }) {
name: i18n._(t`Name`),
key: 'name',
},
+ {
+ name: i18n._(t`Type`),
+ key: 'notification_type',
+ },
]}
renderToolbar={props => (
{};
+ const labelId = `template-name-${template.id}`;
+
return (
@@ -37,9 +48,42 @@ export default function NotificationTemplatesListItem({
{template.name}
,
+
+ {template.notification_type}
+ ,
]}
/>
+
+ {template.summary_fields.user_capabilities.edit ? (
+
+
+
+ ) : (
+
+ )}
+
+
+
+
);
}
+
+export default withI18n()(NotificationTemplateListItem);
diff --git a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx
index 51f78c173c..37d01a9e0a 100644
--- a/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx
+++ b/awx/ui_next/src/screens/Organization/OrganizationList/OrganizationListItem.jsx
@@ -62,12 +62,10 @@ function OrganizationListItem({
/>
-
-
- {organization.name}
-
-
+
+
+ {organization.name}
+
,
@@ -85,11 +83,7 @@ function OrganizationListItem({
,
]}
/>
-
+
{organization.summary_fields.user_capabilities.edit ? (
+
{template.name}
@@ -105,11 +105,7 @@ function TemplateListItem({
,
]}
/>
-
+
{canLaunch && template.type === 'job_template' && (