Add TaskRun results tab

Add a tab to display TaskRun results as a sibling of Parameters and Status when a user clicks on the TaskRun in the TaskTree component. Similar to Parameters, this is only displayed when there are results to display.
tektoncd · Mar 4, 2021 · 231eddf · 231eddf
1 parent eb08ed1
commit 231eddf
Show file tree

Hide file tree

Showing 14 changed files with 84 additions and 8 deletions.
diff --git a/packages/components/src/components/TaskRunDetails/TaskRunDetails.js b/packages/components/src/components/TaskRunDetails/TaskRunDetails.js
@@ -1,5 +1,5 @@
 /*
-Copyright 2020 The Tekton Authors
+Copyright 2020-2021 The Tekton Authors
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at
@@ -20,8 +20,6 @@ import { DetailsHeader, Param, Tab, Table, Tabs, ViewYAML } from '..';
 
 import './TaskRunDetails.scss';
 
-const tabs = ['params', 'status'];
-
 const TaskRunDetails = props => {
   const { intl, onViewChange, taskRun, view } = props;
   const displayName = taskRun.metadata.name;
@@ -60,6 +58,29 @@ const TaskRunDetails = props => {
     />
   );
 
+  const results = taskRun.status?.taskResults;
+  const resultsTable = results && results.length && (
+    <Table
+      size="short"
+      headers={headers}
+      rows={results.map(({ name, value }) => ({
+        id: name,
+        name,
+        value: (
+          <span title={value}>
+            <Param>{value}</Param>
+          </span>
+        )
+      }))}
+    />
+  );
+
+  const tabs = [
+    paramsTable && 'params',
+    resultsTable && 'results',
+    'status'
+  ].filter(Boolean);
+
   let selectedTabIndex = tabs.indexOf(view);
   if (selectedTabIndex === -1) {
     selectedTabIndex = 0;
@@ -79,7 +100,7 @@ const TaskRunDetails = props => {
       >
         {paramsTable && (
           <Tab
-            id={`${displayName}-details`}
+            id={`${displayName}-params`}
             label={intl.formatMessage({
               id: 'dashboard.taskRun.params',
               defaultMessage: 'Parameters'
@@ -88,6 +109,17 @@ const TaskRunDetails = props => {
             <div className="tkn--step-status">{paramsTable}</div>
           </Tab>
         )}
+        {resultsTable && (
+          <Tab
+            id={`${displayName}-results`}
+            label={intl.formatMessage({
+              id: 'dashboard.taskRun.results',
+              defaultMessage: 'Results'
+            })}
+          >
+            <div className="tkn--step-status">{resultsTable}</div>
+          </Tab>
+        )}
         <Tab
           id={`${displayName}-details`}
           label={intl.formatMessage({

diff --git a/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js b/packages/components/src/components/TaskRunDetails/TaskRunDetails.stories.js
@@ -1,5 +1,5 @@
 /*
-Copyright 2020 The Tekton Authors
+Copyright 2020-2021 The Tekton Authors
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at
@@ -36,7 +36,12 @@ export const Base = () => (
       spec: {
         params
       },
-      status: 'this will show the TaskRun.status'
+      status: {
+        completionTime: '2021-03-03T15:25:34Z',
+        podName: 'my-task-h7d6j-pod-pdtb7',
+        startTime: '2021-03-03T15:25:27Z',
+        taskResults: [{ name: 'message', value: 'hello' }]
+      }
     }}
   />
 );
diff --git a/packages/components/src/components/TaskRunDetails/TaskRunDetails.test.js b/packages/components/src/components/TaskRunDetails/TaskRunDetails.test.js
@@ -1,5 +1,5 @@
 /*
-Copyright 2020 The Tekton Authors
+Copyright 2020-2021 The Tekton Authors
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at
@@ -48,6 +48,20 @@ describe('TaskRunDetails', () => {
     expect(queryByText(paramValue)).toBeTruthy();
   });
 
+  it('does not render parameters or results tabs when those fields are not present', () => {
+    const taskRun = {
+      metadata: { name: 'task-run-name' },
+      spec: {},
+      status: {}
+    };
+    const { queryByText } = renderWithIntl(
+      <TaskRunDetails taskRun={taskRun} />
+    );
+    expect(queryByText(/parameters/i)).toBeFalsy();
+    expect(queryByText(/results/i)).toBeFalsy();
+    expect(queryByText(/status/i)).toBeTruthy();
+  });
+
   it('renders selected view', () => {
     const taskRun = {
       metadata: { name: 'task-run-name' },
@@ -62,4 +76,18 @@ describe('TaskRunDetails', () => {
     fireEvent.click(queryByText(/parameters/i));
     expect(queryByText('fake_name')).toBeTruthy();
   });
+
+  it('renders results', () => {
+    const taskRun = {
+      metadata: { name: 'task-run-name' },
+      spec: {},
+      status: { taskResults: [{ name: 'message', value: 'hello' }] }
+    };
+    const { queryByText } = renderWithIntl(
+      <TaskRunDetails taskRun={taskRun} view="results" />
+    );
+    expect(queryByText(/results/i)).toBeTruthy();
+    expect(queryByText(/message/)).toBeTruthy();
+    expect(queryByText(/hello/)).toBeTruthy();
+  });
 });
diff --git a/packages/components/src/components/TaskRunDetails/index.js b/packages/components/src/components/TaskRunDetails/index.js
@@ -1,5 +1,5 @@
 /*
-Copyright 2020 The Tekton Authors
+Copyright 2020-2021 The Tekton Authors
 Licensed under the Apache License, Version 2.0 (the "License");
 you may not use this file except in compliance with the License.
 You may obtain a copy of the License at
@@ -10,5 +10,6 @@ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 See the License for the specific language governing permissions and
 limitations under the License.
 */
+/* istanbul ignore file */
 
 export { default } from './TaskRunDetails';
diff --git a/src/nls/messages_de.json b/src/nls/messages_de.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "Protokolle",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "Status",
     "dashboard.taskRun.status.cancelled": "Abgebrochen",
     "dashboard.taskRun.status.failed": "Fehlgeschlagen",

diff --git a/src/nls/messages_en.json b/src/nls/messages_en.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "Error loading TaskRun",
     "dashboard.taskRun.logs": "Logs",
     "dashboard.taskRun.params": "Parameters",
+    "dashboard.taskRun.results": "Results",
     "dashboard.taskRun.status": "Status",
     "dashboard.taskRun.status.cancelled": "Cancelled",
     "dashboard.taskRun.status.failed": "Failed",

diff --git a/src/nls/messages_es.json b/src/nls/messages_es.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "Anotaciones",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "Estado",
     "dashboard.taskRun.status.cancelled": "Cancelado",
     "dashboard.taskRun.status.failed": "Fallidas",

diff --git a/src/nls/messages_fr.json b/src/nls/messages_fr.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "Journaux",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "Statut",
     "dashboard.taskRun.status.cancelled": "Annulé",
     "dashboard.taskRun.status.failed": "Echec",

diff --git a/src/nls/messages_it.json b/src/nls/messages_it.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "Log",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "Stato",
     "dashboard.taskRun.status.cancelled": "Annullato",
     "dashboard.taskRun.status.failed": "Non riuscito",

diff --git a/src/nls/messages_ja.json b/src/nls/messages_ja.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "TaskRunのロード中にエラーが発生しました",
     "dashboard.taskRun.logs": "ログ",
     "dashboard.taskRun.params": "パラメータ",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "ステータス",
     "dashboard.taskRun.status.cancelled": "キャンセル済み",
     "dashboard.taskRun.status.failed": "失敗",

diff --git a/src/nls/messages_ko.json b/src/nls/messages_ko.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "로그",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "상태",
     "dashboard.taskRun.status.cancelled": "취소됨",
     "dashboard.taskRun.status.failed": "실패",

diff --git a/src/nls/messages_pt.json b/src/nls/messages_pt.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "Logs",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "Status",
     "dashboard.taskRun.status.cancelled": "Cancelado",
     "dashboard.taskRun.status.failed": "Com falha",

diff --git a/src/nls/messages_zh-Hans.json b/src/nls/messages_zh-Hans.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "加载 TaskRun 时失败",
     "dashboard.taskRun.logs": "日志",
     "dashboard.taskRun.params": "参数",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "状态",
     "dashboard.taskRun.status.cancelled": "已取消",
     "dashboard.taskRun.status.failed": "失败",

diff --git a/src/nls/messages_zh-Hant.json b/src/nls/messages_zh-Hant.json
@@ -212,6 +212,7 @@
     "dashboard.taskRun.errorLoading": "",
     "dashboard.taskRun.logs": "日誌",
     "dashboard.taskRun.params": "",
+    "dashboard.taskRun.results": "",
     "dashboard.taskRun.status": "狀態",
     "dashboard.taskRun.status.cancelled": "已取消",
     "dashboard.taskRun.status.failed": "已失敗",