Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(am-vis): add diagram generator #216

Draft
wants to merge 2 commits into
base: main
Choose a base branch
from
Draft

feat(am-vis): add diagram generator #216

wants to merge 2 commits into from

Conversation

pancsta
Copy link
Owner

@pancsta pancsta commented Jan 30, 2025

mach-node-client-nested

am-vis is a dbg protocol based distributed diagram renderer. It creates a graph of interconnected machines, based on fragmented data they provide via:

  • state schema
    • states
    • relations
    • tags
  • logs L2
    • pipes
    • RPC connections
  • transitions
    • active states

It does not persist transitions and only knows the latest active states. The rendering uses ELK and is done by:

  • D2 (shipped, mid-sized diagrams)
  • Mermaid (basic support, not shipped, small-sized diagrams)

This prototype reads am-dbg-dump.gob.br export file and renderes some predefined configurations. machIds need to be adjusted to the dumped machine IDs.

Config

Graphs can be filtered using the rendering config:

type Visualizer struct {
    // Render only these machines as starting points.
    RenderMachs []string
    // Render only machines matching the regular expressions as starting points.
    RenderMachsRe []*regexp.Regexp
    // Skip rendering of these machines.
    RenderSkipMachs []string
    // Distance to render from starting machines.
    RenderDistance int
    // How deep to render from starting machines. Same as RenderDistance, but only
    // for submachines.
    RenderDepth int
    
    // Render states bubbles.
    RenderStates bool
    // With RenderStates, false will hide Start, and without RenderStates true
    // will render Start.
    RenderStart bool
    // With RenderStates, false will hide Exception, and without RenderStates true
    // will render Exception.
    RenderException bool
    // With RenderStates, false will hide Ready, and without RenderStates true
    // will render Ready.
    RenderReady bool
    // Render states which have pipes being rendered, even if the state should
    // not be rendered.
    RenderPipeStates bool
    // Render group of pipes as mach->mach
    RenderPipes bool
    // Render pipes to non-rendered machines / states.
    RenderHalfPipes bool
    // Render detailed pipes as state -> state
    RenderDetailedPipes bool
    // Render relation between states.
    RenderRelations bool
    // Style currently active states.
    RenderActive    bool
    // Render the parent relation. Ignored when RenderNestSubmachines.
    RenderParentRel bool
    // Render submachines nested inside their parents. See also RenderDepth.
    RenderNestSubmachines bool
    // Render a tags box for machines having some.
    RenderTags            bool
    // Render RPC connections
    RenderConns bool
    // Render RPC connections to non-rendered machines.
    RenderHalfConns bool
    // Render a parent relation to and from non-rendered machines.
    RenderHalfHierarchy bool
    // Render inherited states.
    RenderInherited     bool
    // Mark inherited states.
    RenderMarkInherited bool
}

TODO

  • refactor to support
    • am-vis import-render mydiag --import-file dump.gob.br --output-svg --render-opt1=true ...
    • am-vis live-render mydiag --output-svg --render-opt1=true ...
  • extract rendering
    • parallel rendering within a single am-vis instance
  • config file, watch for changes
  • extract pkg/graph
  • cleanups

Later / out of scope

  • add a TUI version of the rendering config
  • use D2 API instead of gluing strings
  • support GC, store machine time for enter / exit
  • add G6 renderer for large graphs

Legend

  • yellow border = machine requested by ID
  • white border = machine close or deep enough from a requested one
  • no border = not fully rendered machine for grouped inbound and outbound edges
  • yellow state = active
  • double border state = own / non-inherited state
  • blue state = Ready active
  • green state = Start active

Previews

It's recommended to view the SVGs using SVG Navigator.

all-map
mach-node-client-nested
mach-node-client-dist1
mach-node-client-dist2
mach-node-client-dist3
Adjs1AllRelsPipes-dagre

%%{init: {'flowchart': {'defaultRenderer': 'elk'}} }%%
flowchart LR
	classDef _active color:black,fill:yellow;
	subgraph a[nc-TCWP-cli-140116<br>#node-client]
		direction TB
		b([WorkerRequested])
		b --o c
		d([WorkerDisconnected])
		e([Exception])
		f([SuperDisconnecting])
		g([WorkerReady])
		g --x b
		h([ErrWorker])
		h --o e
		i([Ready])
		i --o g
		j([SuperConnecting])
		c([SuperReady])
		k([WorkerDisconnecting])
		l([WorkerPayload])
		m([Start])
		n([WorkerConnecting])
		o([ErrSupervisor])
		o --o e
		p([WorkerConnected])
		q([ErrNetwork])
		q --o e
		r([Heartbeat])
		s([ErrHandlerTimeout])
		s --o e
		t([Healthcheck])
		u([SuperConnected])
		v([SuperDisconnected])
		class p,g,i,u,c,m _active;
	end
Loading

@pancsta pancsta marked this pull request as draft January 30, 2025 12:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant