Display a "Deleted" label for prompt view node details

awx/ui_next/src/components/DetailList/MissingDetail.jsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import { withI18n } from '@lingui/react';
+import { t } from '@lingui/macro';
+import { node } from 'prop-types';
+import styled from 'styled-components';
+import _Detail from './Detail';
+
+const Detail = styled(_Detail)`
+  dd& {
+    color: red;
+  }
+`;
+
+function MissingDetail({ i18n, label }) {
+  return <Detail label={label} value={i18n._(t`Deleted`)} />;
+}
+
+MissingDetail.propTypes = {
+  label: node.isRequired,
+};
+
+export default withI18n()(MissingDetail);

awx/ui_next/src/components/DetailList/index.js

@@ -1,3 +1,4 @@
 export { default as DetailList } from './DetailList';
 export { default as Detail, DetailName, DetailValue } from './Detail';
+export { default as MissingDetail } from './MissingDetail';
 export { default as UserDateDetail } from './UserDateDetail';

awx/ui_next/src/components/PromptDetail/PromptDetail.jsx

@@ -34,6 +34,21 @@ function formatTimeout(timeout) {
   );
 }
 
+function buildResourceLink(resource) {
+  const link = {
+    job_template: `/templates/job_template/${resource.id}/details`,
+    project: `/projects/${resource.id}/details`,
+    inventory_source: `/inventories/inventory/${resource.inventory}/sources/${resource.id}/details`,
+    workflow_job_template: `/templates/workflow_job_template/${resource.id}/details`,
+  };
+
+  return link[(resource?.type)] ? (
+    <Link to={link[resource.type]}>{resource.name}</Link>
+  ) : (
+    resource.name
+  );
+}
+
 function hasPromptData(launchData) {
   return (
     launchData.ask_credential_on_launch ||
@@ -150,7 +165,7 @@ function PromptDetail({ i18n, resource, launchConfig = {} }) {
   return (
     <>
       <DetailList gutter="sm">
-        <Detail label={i18n._(t`Name`)} value={details.name} />
+        <Detail label={i18n._(t`Name`)} value={buildResourceLink(resource)} />
         <Detail label={i18n._(t`Description`)} value={details.description} />
         <Detail
           label={i18n._(t`Type`)}
@@ -160,19 +175,6 @@ function PromptDetail({ i18n, resource, launchConfig = {} }) {
           label={i18n._(t`Timeout`)}
           value={formatTimeout(details?.timeout)}
         />
-        {details?.summary_fields?.organization && (
-          <Detail
-            label={i18n._(t`Organization`)}
-            value={
-              <Link
-                to={`/organizations/${details?.summary_fields.organization.id}/details`}
-              >
-                {details?.summary_fields?.organization.name}
-              </Link>
-            }
-          />
-        )}
-
         {details?.type === 'project' && (
           <PromptProjectDetail resource={details} />
         )}
@@ -185,17 +187,20 @@ function PromptDetail({ i18n, resource, launchConfig = {} }) {
         {details?.type === 'workflow_job_template' && (
           <PromptWFJobTemplateDetail resource={details} />
         )}
-
+        {details?.created && (
-        <UserDateDetail
+          <UserDateDetail
-          label={i18n._(t`Created`)}
+            label={i18n._(t`Created`)}
-          date={details?.created}
+            date={details.created}
-          user={details?.summary_fields?.created_by}
+            user={details?.summary_fields?.created_by}
-        />
+          />
-        <UserDateDetail
+        )}
-          label={i18n._(t`Last Modified`)}
+        {details?.modified && (
-          date={details?.modified}
+          <UserDateDetail
-          user={details?.summary_fields?.modified_by}
+            label={i18n._(t`Last Modified`)}
-        />
+            date={details?.modified}
+            user={details?.summary_fields?.modified_by}
+          />
+        )}
       </DetailList>
 
       {hasPromptData(launchConfig) && hasOverrides && (

awx/ui_next/src/components/PromptDetail/PromptInventorySourceDetail.jsx

@@ -4,7 +4,7 @@ import { t } from '@lingui/macro';
 import { Link } from 'react-router-dom';
 
 import { Chip, ChipGroup, List, ListItem } from '@patternfly/react-core';
-import { Detail } from '@components/DetailList';
+import { Detail, MissingDetail } from '@components/DetailList';
 import { VariablesDetail } from '@components/CodeMirrorInput';
 import CredentialChip from '@components/CredentialChip';
 
@@ -57,6 +57,20 @@ function PromptInventorySourceDetail({ i18n, resource }) {
 
   return (
     <>
+      {summary_fields?.organization ? (
+        <Detail
+          label={i18n._(t`Organization`)}
+          value={
+            <Link
+              to={`/organizations/${summary_fields.organization.id}/details`}
+            >
+              {summary_fields?.organization.name}
+            </Link>
+          }
+        />
+      ) : (
+        <MissingDetail label={i18n._(t`Organization`)} />
+      )}
       {summary_fields?.inventory && (
         <Detail
           label={i18n._(t`Inventory`)}

awx/ui_next/src/components/PromptDetail/PromptJobTemplateDetail.jsx

@@ -4,7 +4,7 @@ import { t } from '@lingui/macro';
 import { Link } from 'react-router-dom';
 
 import { Chip, ChipGroup, List, ListItem } from '@patternfly/react-core';
-import { Detail } from '@components/DetailList';
+import { Detail, MissingDetail } from '@components/DetailList';
 import { VariablesDetail } from '@components/CodeMirrorInput';
 import CredentialChip from '@components/CredentialChip';
 import Sparkline from '@components/Sparkline';
@@ -13,6 +13,7 @@ import { toTitleCase } from '@util/strings';
 function PromptJobTemplateDetail({ i18n, resource }) {
   const {
     allow_simultaneous,
+    ask_inventory_on_launch,
     become_enabled,
     diff_mode,
     extra_vars,
@@ -84,7 +85,21 @@ function PromptJobTemplateDetail({ i18n, resource }) {
         />
       )}
       <Detail label={i18n._(t`Job Type`)} value={toTitleCase(job_type)} />
-      {summary_fields?.inventory && (
+      {summary_fields?.organization ? (
+        <Detail
+          label={i18n._(t`Organization`)}
+          value={
+            <Link
+              to={`/organizations/${summary_fields.organization.id}/details`}
+            >
+              {summary_fields?.organization.name}
+            </Link>
+          }
+        />
+      ) : (
+        <MissingDetail label={i18n._(t`Organization`)} />
+      )}
+      {summary_fields?.inventory ? (
         <Detail
           label={i18n._(t`Inventory`)}
           value={
@@ -95,8 +110,12 @@ function PromptJobTemplateDetail({ i18n, resource }) {
             </Link>
           }
         />
+      ) : (
+        !ask_inventory_on_launch && (
+          <MissingDetail label={i18n._(t`Inventory`)} />
+        )
       )}
-      {summary_fields?.project && (
+      {summary_fields?.project ? (
         <Detail
           label={i18n._(t`Project`)}
           value={
@@ -105,6 +124,8 @@ function PromptJobTemplateDetail({ i18n, resource }) {
             </Link>
           }
         />
+      ) : (
+        <MissingDetail label={i18n._(t`Project`)} />
       )}
       <Detail label={i18n._(t`Source Control Branch`)} value={scm_branch} />
       <Detail label={i18n._(t`Playbook`)} value={playbook} />

awx/ui_next/src/components/PromptDetail/PromptProjectDetail.jsx

@@ -3,8 +3,9 @@ import { withI18n } from '@lingui/react';
 import { t } from '@lingui/macro';
 import { Config } from '@contexts/Config';
 import { List, ListItem } from '@patternfly/react-core';
+import { Link } from 'react-router-dom';
 
-import { Detail } from '@components/DetailList';
+import { Detail, MissingDetail } from '@components/DetailList';
 import CredentialChip from '@components/CredentialChip';
 import { toTitleCase } from '@util/strings';
 
@@ -49,6 +50,20 @@ function PromptProjectDetail({ i18n, resource }) {
 
   return (
     <>
+      {summary_fields?.organization ? (
+        <Detail
+          label={i18n._(t`Organization`)}
+          value={
+            <Link
+              to={`/organizations/${summary_fields.organization.id}/details`}
+            >
+              {summary_fields?.organization.name}
+            </Link>
+          }
+        />
+      ) : (
+        <MissingDetail label={i18n._(t`Organization`)} />
+      )}
       <Detail
         label={i18n._(t`Source Control Type`)}
         value={scm_type === '' ? i18n._(t`Manual`) : toTitleCase(scm_type)}

awx/ui_next/src/components/PromptDetail/PromptWFJobTemplateDetail.jsx

@@ -52,6 +52,18 @@ function PromptWFJobTemplateDetail({ i18n, resource }) {
           label={i18n._(t`Activity`)}
         />
       )}
+      {summary_fields?.organization && (
+        <Detail
+          label={i18n._(t`Organization`)}
+          value={
+            <Link
+              to={`/organizations/${summary_fields.organization.id}/details`}
+            >
+              {summary_fields?.organization.name}
+            </Link>
+          }
+        />
+      )}
       {summary_fields?.inventory && (
         <Detail
           label={i18n._(t`Inventory`)}

awx/ui_next/src/screens/Template/JobTemplateDetail/JobTemplateDetail.jsx

@@ -10,7 +10,6 @@ import {
   TextListItemVariants,
   TextListVariants,
 } from '@patternfly/react-core';
-import styled from 'styled-components';
 import { t } from '@lingui/macro';
 
 import AlertModal from '@components/AlertModal';
@@ -18,19 +17,18 @@ import { CardBody, CardActionsRow } from '@components/Card';
 import ContentError from '@components/ContentError';
 import ContentLoading from '@components/ContentLoading';
 import CredentialChip from '@components/CredentialChip';
-import { DetailList, Detail, UserDateDetail } from '@components/DetailList';
+import {
+  Detail,
+  DetailList,
+  MissingDetail,
+  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';
 
-const MissingDetail = styled(Detail)`
-  dd& {
-    color: red;
-  }
-`;
-
 function JobTemplateDetail({ i18n, template }) {
   const {
     ask_inventory_on_launch,
@@ -133,10 +131,6 @@ function JobTemplateDetail({ i18n, template }) {
     </TextList>
   );
 
-  const renderMissingDataDetail = value => (
-    <MissingDetail label={value} value={i18n._(t`Deleted`)} />
-  );
-
   const inventoryValue = (kind, id) => {
     const inventorykind = kind === 'smart' ? 'smart_inventory' : 'inventory';
 
@@ -180,7 +174,7 @@ function JobTemplateDetail({ i18n, template }) {
             }
           />
         ) : (
-          renderMissingDataDetail(i18n._(t`Project`))
+          <MissingDetail label={i18n._(t`Organization`)} />
         )}
         {summary_fields.inventory ? (
           <Detail
@@ -191,8 +185,9 @@ function JobTemplateDetail({ i18n, template }) {
             )}
           />
         ) : (
-          !ask_inventory_on_launch &&
+          !ask_inventory_on_launch && (
-          renderMissingDataDetail(i18n._(t`Inventory`))
+            <MissingDetail label={i18n._(t`Inventory`)} />
+          )
         )}
         {summary_fields.project ? (
           <Detail
@@ -204,7 +199,7 @@ function JobTemplateDetail({ i18n, template }) {
             }
           />
         ) : (
-          renderMissingDataDetail(i18n._(t`Project`))
+          <MissingDetail label={i18n._(t`Project`)} />
         )}
         <Detail
           label={i18n._(t`Source Control Branch`)}