Skip to content

docs(gui): add screenshots for all seven web UI screens#2061

Open
Om-Rohilla wants to merge 1 commit into
sipyourdrink-ltd:mainfrom
Om-Rohilla:docs/gui-screenshots
Open

docs(gui): add screenshots for all seven web UI screens#2061
Om-Rohilla wants to merge 1 commit into
sipyourdrink-ltd:mainfrom
Om-Rohilla:docs/gui-screenshots

Conversation

@Om-Rohilla

@Om-Rohilla Om-Rohilla commented Jun 8, 2026

Copy link
Copy Markdown

What this does

Adds screenshots for all seven top-level web UI screens (Tasks, Agents, Approvals, Audit, Costs, Fleet, Settings) to docs/assets/.

Embeds them in docs/gui/screens.md under the existing ## Screenshots section, and adds a representative Tasks screenshot to the ## Surface section of docs/web-ui.md.

Contributes to #1262 (README screenshots / GIFs sub-task from the Web UI contributor welcome mat).


Files changed

File Change
docs/assets/webui-tasks.png ➕ New
docs/assets/webui-agents.png ➕ New
docs/assets/webui-approvals.png ➕ New
docs/assets/webui-audit.png ➕ New
docs/assets/webui-costs.png ➕ New
docs/assets/webui-fleet.png ➕ New
docs/assets/webui-settings.png ➕ New
docs/gui/screens.md 📝 Embed screenshots in ## Screenshots section
docs/web-ui.md 📝 Add representative screenshot to ## Surface section

How screenshots were taken

  • Captured from BERNSTEIN_AUTH_DISABLED=1 bernstein gui serve at http://127.0.0.1:8052/ui/
  • Browser window: 1280×800
  • Each page was visited directly by URL and allowed to fully load before capture
  • Naming follows the existing webui-*.png convention already established in docs/assets/

Checklist

  • Screenshots taken from a running local instance
  • Files follow existing naming convention (webui-*.png in docs/assets/)
  • No source code changed — docs only
  • docs/gui/screens.md updated (screenshots embedded in existing section)
  • docs/web-ui.md updated (representative image added to Surface overview)

Summary by Sourcery

Add embedded screenshots of all top-level web UI screens to the GUI documentation.

Documentation:

  • Add screenshots for Tasks, Agents, Approvals, Audit, Costs, Fleet, and Settings views to the GUI screens documentation.
  • Embed a representative Tasks view screenshot in the web UI surface overview documentation.

Summary by CodeRabbit

  • Documentation
    • Added screenshots across multiple feature sections (Tasks, Agents, Approvals, Audit, Costs, Fleet, and Settings) to enhance documentation visibility.
    • Included Tasks view screenshot in web UI documentation for visual reference.

Adds webui-tasks, webui-agents, webui-approvals, webui-audit,
webui-costs, webui-fleet, and webui-settings screenshots to
docs/assets/. Updates docs/gui/screens.md to embed them in the
existing Screenshots section, and adds a representative image
to the Surface section in docs/web-ui.md.

Contributes to sipyourdrink-ltd#1262.
Copilot AI review requested due to automatic review settings June 8, 2026 11:06
@Om-Rohilla Om-Rohilla requested a review from chernistry as a code owner June 8, 2026 11:06
@sourcery-ai

sourcery-ai Bot commented Jun 8, 2026

Copy link
Copy Markdown
Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Adds new web UI screenshots to the docs assets and embeds them into the GUI documentation pages, wiring each of the seven top-level screens into the existing Screenshots and Surface sections.

File-Level Changes

Change Details Files
Add screenshot assets for each top-level web UI screen to docs/assets.
  • Introduce seven new PNG files capturing Tasks, Agents, Approvals, Audit, Costs, Fleet, and Settings views.
  • Ensure filenames follow the existing webui-*.png naming convention for consistency and future reuse.
docs/assets/webui-tasks.png
docs/assets/webui-agents.png
docs/assets/webui-approvals.png
docs/assets/webui-audit.png
docs/assets/webui-costs.png
docs/assets/webui-fleet.png
docs/assets/webui-settings.png
Embed the new screenshots into the GUI documentation to illustrate the main screens.
  • Extend the Screenshots section in docs/gui/screens.md with inline images for each of the seven top-level screens, using descriptive alt text to clarify what each image represents.
  • Update docs/web-ui.md Surface section to include a representative Tasks screenshot, aligned with the existing asset path conventions.
docs/gui/screens.md
docs/web-ui.md

Possibly linked issues


Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@github-actions github-actions Bot added the docs label Jun 8, 2026

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Adds UI screenshots to the documentation to better illustrate the Web UI surfaces and available routes.

Changes:

  • Embed a Tasks view screenshot into docs/web-ui.md.
  • Add screenshots for multiple route screens into docs/gui/screens.md.

Reviewed changes

Copilot reviewed 2 out of 9 changed files in this pull request and generated no comments.

File Description
docs/web-ui.md Adds an inline screenshot for the Tasks view in the Web UI docs.
docs/gui/screens.md Adds screenshots for additional UI routes to the GUI screens reference.
Comments suppressed due to low confidence (1)

docs/gui/screens.md:1

  • The text says 'Five routes' but the newly added screenshots immediately below indicate more than five (Tasks, Agents, Approvals, Audit, Costs, Fleet, Settings). Please update the route count to match reality (or rephrase to avoid a hard-coded number) so the documentation doesn’t become misleading.
---

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've reviewed your changes and they look great!


Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

@coderabbitai

coderabbitai Bot commented Jun 8, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a554ee80-0205-4f19-9b50-5395ff39e550

📥 Commits

Reviewing files that changed from the base of the PR and between f5a9dbd and b52b671.

⛔ Files ignored due to path filters (7)
  • docs/assets/webui-agents.png is excluded by !**/*.png
  • docs/assets/webui-approvals.png is excluded by !**/*.png
  • docs/assets/webui-audit.png is excluded by !**/*.png
  • docs/assets/webui-costs.png is excluded by !**/*.png
  • docs/assets/webui-fleet.png is excluded by !**/*.png
  • docs/assets/webui-settings.png is excluded by !**/*.png
  • docs/assets/webui-tasks.png is excluded by !**/*.png
📒 Files selected for processing (2)
  • docs/gui/screens.md
  • docs/web-ui.md

📝 Walkthrough

Walkthrough

This PR adds screenshot references to the Bernstein documentation. The GUI screens documentation was expanded with route-specific screenshot links for Tasks, Agents, Approvals, Audit, Costs, Fleet, and Settings. The web UI documentation now includes a Tasks view screenshot link to visually illustrate the web UI interface.

Changes

Documentation Screenshots

Layer / File(s) Summary
Screenshot documentation for GUI routes and web UI views
docs/gui/screens.md, docs/web-ui.md
Added route-specific screenshot links (Tasks, Agents, Approvals, Audit, Costs, Fleet, Settings) to the GUI screens documentation and a Tasks view screenshot reference to the web UI documentation.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A rabbit hops through docs so bright,
Adding screenshots left and right,
GUI routes now come to life,
No more abstract strife!
Vision blooms in every guide! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Description check ⚠️ Warning The description is comprehensive and well-structured, covering what was done, why, how screenshots were taken, and includes a detailed checklist. However, it does not follow the repository's required template structure with 'What', 'Why', and 'How' sections, nor does it address the documentation duty checklist items. Reformat the description to follow the repository template with 'What', 'Why', 'How' sections and address all documentation duty checklist items (README, operations docs, API schema, agents-md, and tests).
✅ Passed checks (4 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly and specifically describes the main change: adding screenshots for all seven web UI screens to the documentation.
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

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

@Om-Rohilla

Copy link
Copy Markdown
Author

Hi, I've submitted PR #2061 covering the README screenshots sub-task.
Screenshots captured from a local running instance (v2.7.0) covering
all 7 pages: Tasks, Agents, Approvals, Audit, Costs, Fleet, Settings.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants