TaskRun details Page

frontend/packages/dev-console/src/components/taskruns/TaskRunDetails.scss

@@ -0,0 +1,7 @@
+.odc-taskrun-details {
+  &__status {
+    dl {
+      margin-bottom: var(--pf-global--spacer--md);
+    }
+  }
+}

frontend/packages/dev-console/src/components/taskruns/TaskRunDetails.tsx

@@ -1,7 +1,11 @@
 import * as React from 'react';
 import { SectionHeading, ResourceSummary } from '@console/internal/components/utils';
 import { K8sResourceKind } from '@console/internal/module/k8s';
+import { Status } from '@console/shared';
+import { pipelineRunFilterReducer } from '../../utils/pipeline-filter-reducer';
+import PipelineRunDetailsErrorLog from '../pipelineruns/logs/PipelineRunDetailsErrorLog';
 import { TaskRunModel } from '../../models';
+import './TaskRunDetails.scss';
 
 export interface TaskRunDetailsProps {
   obj: K8sResourceKind;
@@ -15,6 +19,15 @@ const TaskRunDetails: React.FC<TaskRunDetailsProps> = ({ obj: taskRun }) => {
         <div className="col-sm-6">
           <ResourceSummary resource={taskRun} />
         </div>
+        <div className="col-sm-6 odc-taskrun-details__status">
+          <dl>
+            <dt>Status</dt>
+            <dd>
+              <Status status={pipelineRunFilterReducer(taskRun)} />
+            </dd>
+          </dl>
+          <PipelineRunDetailsErrorLog pipelineRun={taskRun} />
+        </div>
       </div>
     </div>
   );

frontend/packages/dev-console/src/components/taskruns/TaskRunDetailsPage.tsx

@@ -3,6 +3,7 @@ import { DetailsPage, DetailsPageProps } from '@console/internal/components/fact
 import { navFactory, viewYamlComponent } from '@console/internal/components/utils';
 import TaskRunDetails from './TaskRunDetails';
 import { useTasksBreadcrumbsFor } from '../pipelines/hooks';
+import TaskRunLog from './TaskRunLog';
 
 const TaskRunDetailsPage: React.FC<DetailsPageProps> = (props) => {
   const { kindObj, match } = props;
@@ -12,7 +13,16 @@ const TaskRunDetailsPage: React.FC<DetailsPageProps> = (props) => {
     <DetailsPage
       {...props}
       breadcrumbsFor={() => breadcrumbsFor}
-      pages={[navFactory.details(TaskRunDetails), navFactory.editYaml(viewYamlComponent)]}
+      pages={[
+        navFactory.details(TaskRunDetails),
+        navFactory.editYaml(viewYamlComponent),
+        {
+          href: 'logs',
+          path: 'logs/:name?',
+          name: 'Logs',
+          component: TaskRunLog,
+        },
+      ]}
     />
   );
 };

frontend/packages/dev-console/src/components/taskruns/TaskRunLog.tsx

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { useK8sGet } from '@console/internal/components/utils/k8s-get-hook';
+import { K8sResourceKind } from '@console/internal/module/k8s';
+import { PodLogs } from '@console/internal/components/pod-logs';
+import { StatusBox } from '@console/internal/components/utils/status-box';
+import { PodModel } from '@console/internal/models';
+
+export type TaskRunLogProps = {
+  obj: K8sResourceKind;
+};
+
+const TaskRunLog: React.FC<TaskRunLogProps> = ({ obj }) => {
+  const [pod, podLoaded, podError] = useK8sGet<K8sResourceKind>(
+    PodModel,
+    obj.status.podName,
+    obj.metadata.namespace,
+  );
+  if (podLoaded && !podError) {
+    return <PodLogs obj={pod} />;
+  }
+  return <StatusBox loaded={podLoaded} loadError={podError} label="TaskRun Log" />;
+};
+
+// to safeguard against cases where Pod is yet to be assigned or is removed
+const TaskRunLogWrapper = (props: TaskRunLogProps) =>
+  props.obj.status?.podName ? (
+    <TaskRunLog {...props} />
+  ) : (
+    <StatusBox loadError="Pod not found" label="TaskRun Log" />
+  );
+
+export default TaskRunLogWrapper;

frontend/packages/dev-console/src/components/taskruns/__tests__/TaskRunDetails.spec.tsx

@@ -0,0 +1,42 @@
+import * as React from 'react';
+import { SectionHeading, ResourceSummary } from '@console/internal/components/utils';
+import { Status } from '@console/shared';
+import PipelineRunDetailsErrorLog from '../../pipelineruns/logs/PipelineRunDetailsErrorLog';
+import { shallow } from 'enzyme';
+import TaskRunDetails from '../TaskRunDetails';
+
+type Component = typeof TaskRunDetails;
+type Props = React.ComponentProps<Component>;
+const TaskDetailsProps: Props = {
+  obj: {
+    kind: 'TaskRun',
+    metadata: { name: 'abhi', namespace: 'abhi1' },
+    status: {
+      completionTime: '2019-10-29T11:57:53Z',
+      conditions: [
+        {
+          lastTransitionTime: '2019-10-29T11:57:53Z',
+          reason: 'Failed',
+          status: 'True',
+          type: 'Failed',
+        },
+      ],
+    },
+  },
+};
+
+describe('TaskRunDetailsPage', () => {
+  const pipelineRunWrapper = shallow(<TaskRunDetails {...TaskDetailsProps} />);
+  it('Renders a SectionHeading', () => {
+    expect(pipelineRunWrapper.find(SectionHeading).exists());
+  });
+  it('Renders a Resource Summary', () => {
+    expect(pipelineRunWrapper.find(ResourceSummary).exists());
+  });
+  it('Renders a Status', () => {
+    expect(pipelineRunWrapper.find(Status).exists());
+  });
+  it('Renders a Log snippet', () => {
+    expect(pipelineRunWrapper.find(PipelineRunDetailsErrorLog).exists());
+  });
+});

frontend/packages/dev-console/src/components/taskruns/__tests__/TaskRunLog.spec.tsx

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import { PodLogs } from '@console/internal/components/pod-logs';
+import { StatusBox } from '@console/internal/components/utils/status-box';
+import { shallow } from 'enzyme';
+import TaskRunLog from '../TaskRunLog';
+
+type Component = typeof TaskRunLog;
+type Props = React.ComponentProps<Component>;
+const TaskRunLogProps: Props = {
+  obj: {
+    kind: 'TaskRun',
+    metadata: { name: 'abhi', namespace: 'abhi1' },
+    status: {
+      completionTime: '2019-10-29T11:57:53Z',
+      conditions: [
+        {
+          lastTransitionTime: '2019-10-29T11:57:53Z',
+          reason: 'Failed',
+          status: 'True',
+          type: 'Failed',
+        },
+      ],
+    },
+  },
+};
+
+describe('TaskRunLog Page', () => {
+  it('Renders a StatusBox', () => {
+    const pipelineRunWrapper = shallow(<TaskRunLog {...TaskRunLogProps} />);
+    expect(pipelineRunWrapper.find(StatusBox).exists());
+  });
+  it('Renders a PodLog', () => {
+    TaskRunLogProps.obj.status.podName = 'test';
+    const pipelineRunWrapper = shallow(<TaskRunLog {...TaskRunLogProps} />);
+    expect(pipelineRunWrapper.find(PodLogs).exists());
+  });
+});