From f7c01afc035580cbe7f771fac26eb2ec57b3e348 Mon Sep 17 00:00:00 2001
From: Tina Yip <98424339+tiyiprh@users.noreply.github.com>
Date: Mon, 26 Aug 2024 12:26:05 -0400
Subject: [PATCH] [UXD][AAP-25027] AWX - updates to Notifiers section
 breadcrumbs & headers (#2727)

Co-authored-by: Maeve Hoffer <dhoffer@redhat.com>
---
 .../awx/notifiers/notifiersSharedFunctions.ts |  2 +-
 .../administration/notifiers/NotifierForm.tsx | 25 ++++++++++++++-----
 2 files changed, 20 insertions(+), 7 deletions(-)

diff --git a/cypress/e2e/awx/notifiers/notifiersSharedFunctions.ts b/cypress/e2e/awx/notifiers/notifiersSharedFunctions.ts
index 3ef5269611..91ab886424 100644
--- a/cypress/e2e/awx/notifiers/notifiersSharedFunctions.ts
+++ b/cypress/e2e/awx/notifiers/notifiersSharedFunctions.ts
@@ -12,7 +12,7 @@ export function testNotification(
   const orgName = randomE2Ename();
   cy.createAwxOrganization({ name: orgName }).then(() => {
     cy.navigateTo('awx', 'notification-templates');
-    cy.get(`[data-cy="create-notifier"]`).click();
+    cy.getByDataCy('create-notifier').click();
     cy.verifyPageTitle('Create notifier');
 
     fillBasicData(notificationName, type);
diff --git a/frontend/awx/administration/notifiers/NotifierForm.tsx b/frontend/awx/administration/notifiers/NotifierForm.tsx
index 84a8be20de..ed4894d178 100644
--- a/frontend/awx/administration/notifiers/NotifierForm.tsx
+++ b/frontend/awx/administration/notifiers/NotifierForm.tsx
@@ -72,11 +72,6 @@ function NotifierForm(props: { mode: 'add' | 'edit' }) {
 
   const optionsRequest = useOptions<NotificationTemplateOptions>(awxAPI`/notification_templates/`);
 
-  const breadcrumbs: ICatalogBreadcrumb[] = [
-    { label: t('Notifications'), to: getPageUrl(AwxRoute.NotificationTemplates) },
-    { label: mode === 'add' ? t('Add') : t('Edit') },
-  ];
-
   if (notifierRequest.error) {
     return <AwxError error={notifierRequest.error} />;
   }
@@ -106,6 +101,18 @@ function NotifierForm(props: { mode: 'add' | 'edit' }) {
     (defaultValue as CustomizeMessageType).customize_messages = false;
   }
 
+  const breadcrumbs: ICatalogBreadcrumb[] = [
+    { label: t('Notifiers'), to: getPageUrl(AwxRoute.NotificationTemplates) },
+    {
+      label:
+        mode === 'add'
+          ? t('Create notifier')
+          : notifierRequest?.data?.name
+            ? t(`Edit ${notifierRequest.data.name}`)
+            : t('Edit notifier'),
+    },
+  ];
+
   if (defaultValue && !messagesEmpty) {
     (defaultValue as CustomizeMessageType).customize_messages = true;
   }
@@ -191,8 +198,14 @@ function NotifierForm(props: { mode: 'add' | 'edit' }) {
   return (
     <PageLayout>
       <PageHeader
+        title={
+          mode === 'add'
+            ? t('Create notifier')
+            : notifierRequest?.data?.name
+              ? t(`Edit ${notifierRequest.data.name}`)
+              : t('Edit notifier')
+        }
         breadcrumbs={breadcrumbs}
-        title={mode === 'edit' ? t('Edit notifier') : t('Create notifier')}
       />
       <AwxPageForm<NotificationTemplate>
         submitText={t('Save notifier')}