Visualise workflow

Hello,

I am currently working on a project with a Langchain/Langgraph.

From my agent system I get an update about which step just started, which is finished and what intermediate results are.

I want to visualise this and show the user what is happening in the background to generate his answer. So far, I did not find an ideal library for that, So I want to ask if someone maybe has ideas.
What I want to achieve is, that you can see the workflow of agents building up, when clicking on the node, you can see the intermediate results and change the colour of the node depending on the stage.

My current lead is to convert a React library: Showcase - React Flow
But perhaps there are other ways or someone is in the need of something similar, to push the conversion with me.

Thank you,
Simon

Hello @simon-u,

Have you looked into using something like mermaid?

If the workflow is pretty linear you could use dash-mantine-components’ Timeline component to show the progress of different steps.

1 Like

@jinnyzor ,

True, I was thinking about that as well. At the first glance, it looked, to me, as if it’s more only visualisation and does not have any click events.

Did you look into cytoscape?