Dashboard: TriggerTemplate details paneling first pass

[ncskier]

This work is under epic https://github.com/tektoncd/dashboard/issues/509

Expected Behavior

I expect to be able to view the details of a TriggerTemplate resource in the Dashboard.

This panel should have two tabs, Details and YAML.

YAML view

The YAML view should display the YAML definition of the TriggerTemplate resource (kubectl get triggertemplate TT_NAME -oyaml). The YAML should be formatted like a code snippet.

Here is the latest wireframe from #509 for the YAML view.

Details view

The Details view should be a nicely formatted representation of the important information in the TriggerTemplate's YAML. The Details view must include the following information:

• Labels
• list of params with the following:
  
  
  
  • name
  
  
  • description
  
  
  • default
  
  
• list of resource templates with the following:
  
  
  
  • name
  
  
  • kind
  
  

Here is the latest wireframe from #509 for the Details view.

Actual Behavior

We have no paneling for viewing TriggerTemplate resource details.

Additional Info

• TriggerTemplates README: triggertemplates.md
• TriggerTemplates type definition: trigger_template_types.yaml
• TriggerTemplate example: triggertemplate.yaml

[mii-w]

[a-roberts]

I'm working this, planned to implement something simple to review https://github.com/tektoncd/dashboard/pull/710 and this is where I want to really test Carlos' reusable component. I implemented plenty of code to get to such a stage so I'm officially assigning myself.

Plan is to get it all working and then drop in the table from Carlos once that's ready. This'll make it easy to implement the other ones too. @carlos-logro FYI, my branch is https://github.com/a-roberts/dashboard/tree/triggerTemplatePanelling and that includes your table component so far (just haven't used it yet).

[a-roberts]

Ok, implemented the overall view page and I'm now implementing the details part and incorporating the table from Carlos to help with that review

details page coming up

[a-roberts]

I have this implemented so far, working on making it so on click, we display the full template information as a prettified string. Accordion looks to be the component to use, see http://react.carbondesignsystem.com/?path=/story/accordion--default

[a-roberts]

Accordion implemented, should be one giant accordion item (row width) and not two so I'll look into that tomorrow. All data being retrieved and otherwise displayed correctly.

I'll add the full YAML view as well tomorrow.

[mii-w]

we are looking into utilizing the space better so data can be clearly displayed and accessible to the user (prevent them to do endless scrolling)

[mii-w]

Above wires were based off discussion with design team- another variation to consider

[ncskier]

@mii-w while the Parameters are definitely important, it feels strange to have them take up the majority of the screen space in those designs.

[a-roberts]

Yeah I agree, it's unlikely the user will have sooooo many of them, I'll work on adding the details and yaml buttons now and adding this into a container

[mii-w]

@mii-w while the Parameters are definitely important, it feels strange to have them take up the majority of the screen space in those designs.

I agree it seemed kind of odd.. what are your thoughts on this layout?

In regards to displaying the YAML, I think we should keep it consistent throughout all.

[ncskier]

Sorry for the confusion about which design should be implemented. In an effort to clear things up, I've created a separate issue for iterating on the TriggerTemplate design work here: https://github.com/tektoncd/dashboard/issues/724

From our discussion today, it seemed like this design will be a good one for our "first pass"

In the future, we can refine the implementation based on the work in https://github.com/tektoncd/dashboard/issues/724.

@mii-w @a-roberts does this sound alright?

[a-roberts]

Yep looks good

For details, there isn't a service account you use on the template and I'll make the label display optional since they're not mandatory in the spec.

[a-roberts]

here's what I've got so far, I've not added any tests to this but plan to pick up something more urgent. Lemme know if there's anything noddy I should add, otherwise I'll resume this - add tests and make the PR.

[a-roberts]

Merged so closing 🎂