fix(ui): Update UI to display artifact information

[drewbutlerbb4]

Which issue is resolved by this Pull Request:
Related #241

Description of your changes:
Fixes the UI to show artifact information and visualizations. More specifically, this PR fixes the Input/Output and Visualizations tabs in for selected nodes in the UI, as well as the Run Output tab in the Run Details page. The information needed to display these improvements is parsed from the SDK changes in #259.

Environment tested:

• Python Version (use python --version): Python 3.7.7
• Tekton Version (use tkn version): Pipeline version: v0.14.2
• Kubernetes Version (use kubectl version): Server Version: v1.16.13+IKS
• OS (e.g. from /etc/os-release):

Checklist:

• The title for your pull request (PR) should follow our title convention. Learn more about the pull request title convention used in this repository.

  PR titles examples:

  • fix(frontend): fixes empty page. Fixes #1234
    Use fix to indicate that this PR fixes a bug.
  • feat(backend): configurable service account. Fixes #1234, fixes #1235
    Use feat to indicate that this PR adds a new feature.
  • chore: set up changelog generation tools
    Use chore to indicate that this PR makes some changes that users don't need to know.
  • test: fix CI failure. Part of #1234
    Use part of to indicate that a PR is working on an issue, but shouldn't close the issue when merged.

• Do you want this pull request (PR) cherry-picked into the current release branch?

  If yes, use one of the following options:

  • (Recommended.) Ask the PR approver to add the cherrypick-approved label to this PR. The release manager adds this PR to the release branch in a batch update.
  • After this PR is merged, create a cherry-pick PR to add these changes to the release branch. (For more information about creating a cherry-pick PR, see the Kubeflow Pipelines release guide.)

[kubeflow-bot]

This change is 

[drewbutlerbb4]

/cc @Tomcli

[Tomcli]

Thanks @drewbutlerbb4, Overall it looks great. We just need to take care of few exception cases to not crash the page when the pod is still pending.

[drewbutlerbb4]

Thanks @Tomcli, should be fixed now. I fixed some formatting issues as well.

One thing to note is that the output artifacts of a pod will be displayed in the Input/Output selected node tab as soon as the pod is created. If that tab is selected and an output artifact exists then a number of invalid api calls will be made since that output artifact isn't available yet. Since this isn't breaking I have left it as is, but we could instead not show output artifacts until a taskrun is completed if that is preferable.

[Tomcli]

Thanks @Tomcli, should be fixed now. I fixed some formatting issues as well.

One thing to note is that the output artifacts of a pod will be displayed in the Input/Output selected node tab as soon as the pod is created. If that tab is selected and an output artifact exists then a number of invalid api calls will be made since that output artifact isn't available yet. Since this isn't breaking I have left it as is, but we could instead not show output artifacts until a taskrun is completed if that is preferable.

If it's an easy change then we can let the artifact wait until the task is completed. This is mainly a limitation from tekton because tekton doesn't have anyway to inject annotations during runtime, so we have prepopulate the artifact relationship which cause this race condition issue.

[drewbutlerbb4]

@Tomcli I have added the backwards compatibility check and I only allowed output artifacts to be shown if they were in the COMPLETED or SUCCEEDED phase for now.

[Tomcli]

Thanks @drewbutlerbb4
/lgtm
/approve

[k8s-ci-robot]

[APPROVALNOTIFIER] This PR is APPROVED

This pull-request has been approved by: Tomcli

The full list of commands accepted by this bot can be found here.

The pull request process is described here

Needs approval from an approver in each of these files:

• OWNERS [Tomcli]

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

[animeshsingh]

/retest