Change the Debug Outputs section to be resizable

[anna-geller]

Feature description

Some expressions or outputs are large. It would be great to make this Debug Outputs section as a resizable component:

Extra info for first-time contributors

You can reproduce it by adding this flow, running it and navigating to Outputs:

id: hello-world
namespace: dev
description: Hello World
inputs:
  - id: user
    type: STRING
    defaults: Rick Astley
tasks:
  - id: first_task
    type: io.kestra.plugin.core.debug.Return
    format: thrilled
  - id: second_task
    type: io.kestra.plugin.scripts.shell.Commands
    commands:
      - sleep 0.42
      - echo '::{"outputs":{"returned_data":"mydata"}}::'
  - id: hello_world
    type: io.kestra.plugin.core.log.Log
    message: |
      Welcome to Kestra, {{ inputs.user }}! 
      We are {{ outputs.first_task.value}} to have You here!

[osmaneTKT]

Hello @anna-geller some time ago I came across this project and I would like to contribute to it as part of a course requirement for my computer science degree.

[MilosPaunovic]

That's awesome, go for it @osmaneTKT! 🚀

[satvik2131]

can i use vue-resizable https://www.npmjs.com/package/vue-resizable or if we have any better suggestions , I would like to implement .

[anna-geller]

I don't know how it's technically implemented, but you could try using the same component that we use within the editor, see https://share.descript.com/view/p5vqgmD53pw

[osmaneTKT]

@satvik2131 I'm working on it.

[osmaneTKT]

Hello @anna-geller , I think I managed to solve the problem.

[MilosPaunovic]

@osmaneTKT You've opened two PRs about this, could you check which one is the right one and close the other one?

[osmaneTKT]

Sorry, I hadn't noticed.

[osmaneTKT]

hey @MilosPaunovic , do i need to do anything else ?

[MilosPaunovic]

Not sure, would need to review the PR first, and that's probably going to happen next week. Will let you know, it's on a TODO list.

[osmaneTKT]

thanks