Skip to content

feat: show the plugin icon on agent buttons - #367

Merged
RAIT-09 merged 2 commits into
devfrom
feat/button-block-icon
Jul 16, 2026
Merged

feat: show the plugin icon on agent buttons#367
RAIT-09 merged 2 commits into
devfrom
feat/button-block-icon

Conversation

@RAIT-09

@RAIT-09 RAIT-09 commented Jul 16, 2026

Copy link
Copy Markdown
Owner

Description

Agent buttons (the agent-client-button quick-action block) now show the plugin's identity icon — the same lucide bot-message-square used by the ribbon, chat views, and the Session Manager — to the left of the button text, so a note full of buttons makes it obvious at a glance which ones belong to Agent Client.

The change rides entirely on existing pieces: the shared LucideIcon wrapper (Obsidian's setIcon, no innerHTML) renders the icon, and the button was already inline-flex with gap: 8px, so the only CSS added is a 16px svg size rule. The icon color is deliberately unspecified — it inherits mod-cta's foreground and follows light/dark themes automatically. The icon is fixed (not a fence option): the point is recognizability, and a per-button icon: field would work against that; it remains a one-parser-field addition if ever requested.

The docs screenshot (agent-button-block.webp) is refreshed to show the new look; the options table is unchanged (no new option).

Related issue

None (UI idea from manual testing).

Type of change

  • Bug fix
  • New feature
  • Documentation
  • Refactor
  • Other

Checklist

  • npm run lint passes ("Use sentence case for UI text" warnings are acceptable for brand names)
  • npm run build passes
  • Tested in Obsidian
  • Existing functionality still works
  • Documentation updated if needed (screenshot refreshed)

Testing environment

  • Agent: Claude Code (UI-only change). Verified: icon renders left of the text on all viewType buttons, click/autoSend behavior unchanged, light/dark themes both legible on the accent background, long button text stays vertically centered without wrapping issues
  • OS: macOS

Screenshots

image

Summary by CodeRabbit

  • New Features
    • Added a bot icon to the agent button for clearer visual identification.
    • Updated the button artwork to reflect the refreshed design.
    • Ensured the new icon displays at a consistent size and aligns correctly within the button.

@coderabbitai

coderabbitai Bot commented Jul 16, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

The button block CTA now includes a leading bot icon from LucideIcon, with CSS for layout and sizing. The associated WebP image asset was replaced with new binary content.

Changes

Button block icon

Layer / File(s) Summary
Render and style the button icon
src/ui/AgentButtonBlock.tsx, styles.css
The CTA renders a bot-message-square icon before its existing text, with flex layout and 16×16 SVG sizing.
Update button block image asset
docs/public/images/agent-button-block.webp
The WebP image content is replaced.

Estimated code review effort: 2 (Simple) | ~10 minutes

Possibly related PRs

Suggested reviewers: maws7140

Poem

I’m a bunny with a bot-shaped light,
Hopping into buttons bright.
A tiny glyph now leads the way,
With sixteen pixels set to stay.
New art blooms in WebP cheer—
The agent button’s dressed this year!

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
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.
Title check ✅ Passed The title clearly matches the main change: adding the plugin icon to agent buttons.
Description check ✅ Passed The description follows the template well and includes the required sections, checklist, testing environment, and screenshots.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch feat/button-block-icon

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.

@RAIT-09 RAIT-09 self-assigned this Jul 16, 2026
@RAIT-09
RAIT-09 merged commit 75554cf into dev Jul 16, 2026
2 checks passed
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