[UI] Refactor trigger variables data to use the same columnar expand-collapse format as in the Outputs tab

[anna-geller]

Feature description

we need to implement a similar output handling for Trigger variables as we did here for the Outputs tab #1528 (comment)

Old:

especially painful with webhook triggers with many variables in the payload:

---

Should be:

@MilosPaunovic I think Figma is missing, but perhaps you can still figure it out? https://www.figma.com/design/ew0uXk0NRXJ2NBBJTNe2n1/01_UI?node-id=0-1&t=wsaCI9aAscJmjTt9-0

[anna-geller]

FYI moved to 0.20 as there is only 1 week left before the release

[Ben8t]

@MilosPaunovic here is a flow generating nested trigger values and outputs

id: many_nested
namespace: company.team

variables:
  test: test
  test2: test2
  test3: test3

inputs:
  - id: test
    type: SELECT
    values: ["TEST", "TEST2", "TEST3"]


tasks:
  - id: hello
    type: io.kestra.plugin.core.log.Log
    message: Hello World! 🚀

outputs:
  - id: test
    type: SELECT
    value: ["TEST", "TEST2", "TEST3"]

triggers:
  - id: query
    type: io.kestra.plugin.jdbc.postgresql.Trigger
    interval: PT30S
    password: k3str4
    fetch: true
    fetchType: STORE
    sql: "select * from pg_namespace"
    url: jdbc:postgresql://postgres:5432/kestra
    username: kestra

Currently variables and inputs are not displayed on the execution overview. (beware the flow is triggering every 30 secs)