[cueweb/docs] Document the job dependency graph (inline panel + Cuetopia View Job Graph toggle)

[ramonfigueiredo]

Related Issues

Main issue:

• [cueweb] Finalize CueWeb with Full CueGUI Functionality and Professional UI #2016

Issues related to this PR:

• [cueweb] Dependencies, Redirects, Stuck Frames: Dependency visualization graph #2310

Summarize your change.

Documents the read-only, interactive job dependency graph added in #2377 across all six CueWeb docs, plus six screenshots (light + dark).

• user-guides: new "Job dependency graph" section (enable via Cuetopia > View Job Graph, where it mounts, reading/navigating nodes, empty state), a Core Features bullet, and the Cuetopia menu toggle note.
• other-guides: UI walkthrough.
• quick-starts: Job Dependency Graph bullet with a screenshot.
• tutorials: "Visualizing the dependency graph" step-by-step subsection.
• reference: "Job dependency graph panel" - component, useShowDependencyGraph toggle/persistence, BFS tree walk, name->UUID resolution, silent fetches, node/edge rendering, theme-awareness, empty/loading states.
• developer-guide: JobDependencyGraph component, updated JobDetailsInline, useShowDependencyGraph hook, cueweb:show-dependency-graph-changed event row, and a "Dependency graph panel" subsection (new @xyflow/react, dagre, @types/dagre deps).

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: d03232c5-2b27-4bab-b9c3-1b24094e87c2

📥 Commits

Reviewing files that changed from the base of the PR and between 50a6044 and b2fb83c.

⛔ Files ignored due to path filters (6)

• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_menu.png is excluded by !**/*.png
• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_menu_dark.png is excluded by !**/*.png
• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_monitor_jobs_dependency_graph.png is excluded by !**/*.png
• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_monitor_jobs_dependency_graph_dark.png is excluded by !**/*.png
• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_monitor_jobs_dependency_graph_only.png is excluded by !**/*.png
• docs/assets/images/cueweb/cueweb_cuetopia_view_job_graph_monitor_jobs_dependency_graph_only_dark.png is excluded by !**/*.png

📒 Files selected for processing (6)

• docs/_docs/developer-guide/cueweb-development.md
• docs/_docs/other-guides/cueweb.md
• docs/_docs/quick-starts/quick-start-cueweb.md
• docs/_docs/reference/cueweb.md
• docs/_docs/tutorials/cueweb-tutorial.md
• docs/_docs/user-guides/cueweb-user-guide.md

---

📝 Walkthrough

Walkthrough

This PR extends CueWeb's documentation to introduce a new interactive Job Dependency Graph feature. The feature is documented across developer guides, reference specs, user guides, quick-start instructions, and tutorials, covering technical implementation details, architecture, user workflows, and getting-started scenarios.

Changes

Job Dependency Graph Documentation

Layer / File(s)	Summary
Developer technical documentation docs/_docs/developer-guide/cueweb-development.md	JobDetailsInline documentation is updated to describe the conditional JobDependencyGraph panel. New useShowDependencyGraph() hook is documented with localStorage persistence and cross-tab sync via SHOW_DEP_GRAPH_CHANGED_EVENT. Window events table adds cueweb:show-dependency-graph-changed. Full "Dependency graph panel" section details BFS traversal with cycle/depth guards, job-name resolution, silent API fetch behavior, dagre/React-Flow layout, node rendering, theme-scoped re-rendering, and node-click navigation.
Feature guides and reference documentation docs/_docs/other-guides/cueweb.md, docs/_docs/reference/cueweb.md	New feature entry describes "Job dependency graph (Cuetopia → View Job Graph)" as a persisted toggle with cross-tab sync. Figures 70–72 illustrate the menu entry and graph panel layouts. Reference section documents toggle behavior, conditional mounting in JobDetailsInline, BFS tree walking with depth/cycle guards, job-name resolution via /api/job/getjobs with memoization, node/edge rendering (focus styling, active animation), navigation on click, theme awareness, and loading/empty states.
User-facing documentation and getting started docs/_docs/user-guides/cueweb-user-guide.md, docs/_docs/quick-starts/quick-start-cueweb.md, docs/_docs/tutorials/cueweb-tutorial.md	Core features list adds interactive, read-only Job Dependency Graph item. Cuetopia menu section is expanded with checkable "View Job Graph" toggle and screenshots. New "Job dependency graph" section documents enablement via menu, mounting under Layers/Frames in Monitor Jobs, reading nodes/edges, focus behavior, pan/zoom/fit controls, theme awareness, and empty-state message. Quick start describes opening the read-only dependency tree and node navigation. Tutorial section walks through enablement, panel mounting, node interaction (labels, colors, full-name hover, detail-page click-through), controls, and no-dependencies empty state with accompanying images.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related PRs

• AcademySoftwareFoundation/OpenCue#2377: The main PR's CueWeb documentation updates directly describe the same Job Dependency Graph implementation pieces as PR #2377 (e.g., JobDependencyGraph, useShowDependencyGraph with cueweb:show-dependency-graph-changed, and the conditional JobDetailsInline third panel).

Suggested reviewers

• DiegoTavares
• lithorus

Poem

A graph takes shape in the developer's tale,
Dependencies traced where jobs set sail. 🐇
From toggle to panel, through docs we stride,
Each step documented far and wide. 📖✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately and specifically describes the primary change: documentation for the job dependency graph feature with both the inline panel and Cuetopia toggle components.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[ramonfigueiredo]

This is a continuation of the PR:

• [cueweb] Add job dependency graph: inline panel + Cuetopia toggle #2377

[ramonfigueiredo]

@DiegoTavares / @lithorus
Ready for review!