From 74b0b0d3db86649c9ce8b792c67f775584c1284b Mon Sep 17 00:00:00 2001
From: Alan Greene <github.com@alangreene.net>
Date: Fri, 7 Jul 2023 13:10:18 +0100
Subject: [PATCH] Add support for TEP-0047 'displayName'

When viewing a Pipeline or Task details page, include the
'displayName' alongside the 'description' if provided.

On the PipelineRun details page, show the 'displayName' in the
TaskTree instead of the pipelineTaskName. This also accounts for
retries where the 'displayName' is used as the base instead.

The details to the right still show the full TaskRun name as before.

A future change may include display of the pipelineTask description
so this is wired up but its display is omitted for now.
---
 .../src/components/PipelineRun/PipelineRun.js | 12 ++++++-
 .../ResourceDetails/ResourceDetails.js        | 33 ++++++++++++-------
 .../TaskRunDetails/TaskRunDetails.js          |  3 +-
 .../TaskRunDetails/TaskRunDetails.stories.js  |  8 ++---
 .../src/components/TaskTree/TaskTree.js       |  4 ++-
 packages/utils/src/utils/constants.js         |  2 ++
 packages/utils/src/utils/index.js             | 22 +++++++++++--
 src/nls/messages_de.json                      |  2 ++
 src/nls/messages_en.json                      |  2 ++
 src/nls/messages_es.json                      |  2 ++
 src/nls/messages_fr.json                      |  2 ++
 src/nls/messages_it.json                      |  2 ++
 src/nls/messages_ja.json                      |  2 ++
 src/nls/messages_ko.json                      |  2 ++
 src/nls/messages_pt.json                      |  2 ++
 src/nls/messages_zh-Hans.json                 |  2 ++
 src/nls/messages_zh-Hant.json                 |  2 ++
 17 files changed, 83 insertions(+), 21 deletions(-)

diff --git a/packages/components/src/components/PipelineRun/PipelineRun.js b/packages/components/src/components/PipelineRun/PipelineRun.js
index 1880a45b9..842785d71 100644
--- a/packages/components/src/components/PipelineRun/PipelineRun.js
+++ b/packages/components/src/components/PipelineRun/PipelineRun.js
@@ -169,6 +169,8 @@ export /* istanbul ignore next */ class PipelineRunContainer extends Component {
       });
 
       const { podName } = taskRun.status || {};
+      let displayName =
+        taskRun.metadata.labels?.[labelConstants.DASHBOARD_DISPLAY_NAME];
 
       if (retryPodIndex[podName] || taskRun.status?.retriesStatus) {
         const retryNumber =
@@ -178,8 +180,11 @@ export /* istanbul ignore next */ class PipelineRunContainer extends Component {
             id: 'dashboard.pipelineRun.pipelineTaskName.retry',
             defaultMessage: '{pipelineTaskName} (retry {retryNumber, number})'
           },
-          { pipelineTaskName, retryNumber }
+          { pipelineTaskName: displayName || pipelineTaskName, retryNumber }
         );
+        if (displayName) {
+          displayName = pipelineTaskName;
+        }
       }
 
       return {
@@ -188,6 +193,11 @@ export /* istanbul ignore next */ class PipelineRunContainer extends Component {
           ...taskRun.metadata,
           labels: {
             ...taskRun.metadata.labels,
+            ...(displayName
+              ? {
+                  [labelConstants.DASHBOARD_DISPLAY_NAME]: displayName
+                }
+              : null),
             [labelConstants.DASHBOARD_RETRY_NAME]: pipelineTaskName
           },
           uid: `${uid}${podName}`
diff --git a/packages/components/src/components/ResourceDetails/ResourceDetails.js b/packages/components/src/components/ResourceDetails/ResourceDetails.js
index 3ee97396c..aa3f14e35 100644
--- a/packages/components/src/components/ResourceDetails/ResourceDetails.js
+++ b/packages/components/src/components/ResourceDetails/ResourceDetails.js
@@ -84,6 +84,28 @@ const ResourceDetails = ({
         >
           <div className="tkn--details">
             <ul className="tkn--resourcedetails-metadata">
+              {resource.spec?.displayName && (
+                <li>
+                  <span>
+                    {intl.formatMessage({
+                      id: 'dashboard.resourceDetails.spec.displayName',
+                      defaultMessage: 'Display name:'
+                    })}
+                  </span>
+                  {resource.spec.displayName}
+                </li>
+              )}
+              {resource.spec?.description && (
+                <li>
+                  <span>
+                    {intl.formatMessage({
+                      id: 'dashboard.resourceDetails.spec.description',
+                      defaultMessage: 'Description:'
+                    })}
+                  </span>
+                  {resource.spec.description}
+                </li>
+              )}
               <li>
                 <span>
                   {intl.formatMessage({
@@ -125,17 +147,6 @@ const ResourceDetails = ({
                   {resource.metadata.namespace}
                 </li>
               )}
-              {resource.spec?.description && (
-                <li>
-                  <span>
-                    {intl.formatMessage({
-                      id: 'dashboard.resourceDetails.description',
-                      defaultMessage: 'Description'
-                    })}
-                  </span>
-                  {resource.spec.description}
-                </li>
-              )}
               {additionalMetadata}
             </ul>
             {children}
diff --git a/packages/components/src/components/TaskRunDetails/TaskRunDetails.js b/packages/components/src/components/TaskRunDetails/TaskRunDetails.js
index a7969f4ef..c5698d26e 100644
--- a/packages/components/src/components/TaskRunDetails/TaskRunDetails.js
+++ b/packages/components/src/components/TaskRunDetails/TaskRunDetails.js
@@ -122,7 +122,8 @@ const TaskRunDetails = ({ onViewChange, pod, task, taskRun, view }) => {
     />
   ) : null;
 
-  const results = taskRun.status?.taskResults;
+  // taskResults renamed to results in v1
+  const results = taskRun.status?.taskResults || taskRun.status?.results;
   const resultsTable = results?.length ? (
     <Table
       size="sm"
diff --git a/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js b/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js
index 06db36f79..2e90eeda3 100644
--- a/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js
+++ b/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js
@@ -21,7 +21,7 @@ const params = [
     value: paramValue
   }
 ];
-const taskResults = [{ name: 'message', value: 'hello' }];
+const results = [{ name: 'message', value: 'hello' }];
 
 export default {
   component: TaskRunDetails,
@@ -48,7 +48,7 @@ export const Base = {
           ],
           results: [
             {
-              name: taskResults[0].name,
+              name: results[0].name,
               description: 'A useful description of the result…'
             }
           ]
@@ -58,7 +58,7 @@ export const Base = {
         completionTime: '2021-03-03T15:25:34Z',
         podName: 'my-task-h7d6j-pod-pdtb7',
         startTime: '2021-03-03T15:25:27Z',
-        taskResults
+        results
       }
     }
   }
@@ -90,7 +90,7 @@ export const WithWarning = {
           }
         ],
         startTime: '2021-03-03T15:25:27Z',
-        taskResults
+        results
       }
     }
   }
diff --git a/packages/components/src/components/TaskTree/TaskTree.js b/packages/components/src/components/TaskTree/TaskTree.js
index 3a7bdf620..456b88ee5 100644
--- a/packages/components/src/components/TaskTree/TaskTree.js
+++ b/packages/components/src/components/TaskTree/TaskTree.js
@@ -32,9 +32,11 @@ const TaskTree = ({ onSelect, selectedStepId, selectedTaskId, taskRuns }) => {
         }
         const { uid, labels, name } = taskRun.metadata;
         const {
+          [labelConstants.DASHBOARD_DISPLAY_NAME]: displayName,
           [labelConstants.PIPELINE_TASK]: pipelineTaskName,
           [labelConstants.DASHBOARD_RETRY_NAME]: retryName
         } = labels;
+
         const { reason, status } = getStatus(taskRun);
         const { steps } = taskRun.status || {};
         const expanded =
@@ -44,7 +46,7 @@ const TaskTree = ({ onSelect, selectedStepId, selectedTaskId, taskRuns }) => {
         const selectDefaultStep = !selectedTaskId;
         return (
           <Task
-            displayName={retryName || pipelineTaskName || name}
+            displayName={displayName || retryName || pipelineTaskName || name}
             expanded={expanded}
             id={uid}
             key={uid}
diff --git a/packages/utils/src/utils/constants.js b/packages/utils/src/utils/constants.js
index 49292e7d5..ccfb4d52a 100644
--- a/packages/utils/src/utils/constants.js
+++ b/packages/utils/src/utils/constants.js
@@ -13,6 +13,8 @@ limitations under the License.
 
 export const labels = {
   CLUSTER_TASK: 'tekton.dev/clusterTask',
+  DASHBOARD_DESCRIPTION: 'dashboard.tekton.dev/description',
+  DASHBOARD_DISPLAY_NAME: 'dashboard.tekton.dev/displayName',
   DASHBOARD_IMPORT: 'dashboard.tekton.dev/import',
   DASHBOARD_RETRY_NAME: 'dashboard.tekton.dev/retryName',
   PIPELINE: 'tekton.dev/pipeline',
diff --git a/packages/utils/src/utils/index.js b/packages/utils/src/utils/index.js
index dd1fc94c6..5144653c8 100644
--- a/packages/utils/src/utils/index.js
+++ b/packages/utils/src/utils/index.js
@@ -478,10 +478,26 @@ export function getTaskRunsWithPlaceholders({
         pipelineTask.name
     );
 
-    taskRunsToDisplay.push(
+    const taskRunToDisplay =
       realTaskRun ||
-        getPlaceholderTaskRun({ clusterTasks, pipelineTask, tasks })
-    );
+      getPlaceholderTaskRun({ clusterTasks, pipelineTask, tasks });
+
+    const { description, displayName } = pipelineTask;
+    taskRunToDisplay.metadata.labels = {
+      ...taskRunToDisplay.metadata.labels,
+      ...(description
+        ? {
+            [labelConstants.DASHBOARD_DESCRIPTION]: description
+          }
+        : null),
+      ...(displayName
+        ? {
+            [labelConstants.DASHBOARD_DISPLAY_NAME]: displayName
+          }
+        : null)
+    };
+
+    taskRunsToDisplay.push(taskRunToDisplay);
   });
 
   return taskRunsToDisplay;
diff --git a/src/nls/messages_de.json b/src/nls/messages_de.json
index 1842137d2..e7f86039b 100644
--- a/src/nls/messages_de.json
+++ b/src/nls/messages_de.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_en.json b/src/nls/messages_en.json
index cd31fe815..21af389f7 100644
--- a/src/nls/messages_en.json
+++ b/src/nls/messages_en.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "Resource details",
     "dashboard.resourceDetails.description": "Description",
     "dashboard.resourceDetails.errorloading": "Error loading resource",
+    "dashboard.resourceDetails.spec.description": "Description:",
+    "dashboard.resourceDetails.spec.displayName": "Display name:",
     "dashboard.resourceList.emptyState": "No matching resources found for type {type}",
     "dashboard.resourceList.errorLoading": "Error loading {type}",
     "dashboard.resourceList.viewRuns": "View {kind} of {resource}",
diff --git a/src/nls/messages_es.json b/src/nls/messages_es.json
index e048d42fb..80ff01514 100644
--- a/src/nls/messages_es.json
+++ b/src/nls/messages_es.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_fr.json b/src/nls/messages_fr.json
index d673d65d2..933fb48cb 100644
--- a/src/nls/messages_fr.json
+++ b/src/nls/messages_fr.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_it.json b/src/nls/messages_it.json
index 0fa25473a..09c60caec 100644
--- a/src/nls/messages_it.json
+++ b/src/nls/messages_it.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_ja.json b/src/nls/messages_ja.json
index 8efc6c641..0853f9e4c 100644
--- a/src/nls/messages_ja.json
+++ b/src/nls/messages_ja.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "リソースの詳細",
     "dashboard.resourceDetails.description": "説明",
     "dashboard.resourceDetails.errorloading": "リソースのロード中にエラーが発生しました",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "{type}のリソースがありません",
     "dashboard.resourceList.errorLoading": "{type}のロード中にエラーが発生しました",
     "dashboard.resourceList.viewRuns": "{resource}の{kind}を表示",
diff --git a/src/nls/messages_ko.json b/src/nls/messages_ko.json
index 287640b26..7fdc41050 100644
--- a/src/nls/messages_ko.json
+++ b/src/nls/messages_ko.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_pt.json b/src/nls/messages_pt.json
index e9051386f..8275e22b0 100644
--- a/src/nls/messages_pt.json
+++ b/src/nls/messages_pt.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",
diff --git a/src/nls/messages_zh-Hans.json b/src/nls/messages_zh-Hans.json
index c6cf963fd..6b0a26a0d 100644
--- a/src/nls/messages_zh-Hans.json
+++ b/src/nls/messages_zh-Hans.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "资源详情",
     "dashboard.resourceDetails.description": "描述",
     "dashboard.resourceDetails.errorloading": "加载资源时发生错误",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "没有为类型 {type} 找到匹配的资源",
     "dashboard.resourceList.errorLoading": "加载 {type} 时发生错误",
     "dashboard.resourceList.viewRuns": "查看 {resource} 的 {kind}",
diff --git a/src/nls/messages_zh-Hant.json b/src/nls/messages_zh-Hant.json
index 2225888dd..f96627d9f 100644
--- a/src/nls/messages_zh-Hant.json
+++ b/src/nls/messages_zh-Hant.json
@@ -202,6 +202,8 @@
     "dashboard.resourceDetails.ariaLabel": "",
     "dashboard.resourceDetails.description": "",
     "dashboard.resourceDetails.errorloading": "",
+    "dashboard.resourceDetails.spec.description": "",
+    "dashboard.resourceDetails.spec.displayName": "",
     "dashboard.resourceList.emptyState": "",
     "dashboard.resourceList.errorLoading": "",
     "dashboard.resourceList.viewRuns": "",