improvement(ui): share canvas toolbar controls

[BillLeoutsakosvl346]

Summary

• Share the four canvas navigation actions through a local EMCN Button composition.
• Preserve active/ghost colors, 28px geometry, disabled states, tooltips and command handlers.

Type of Change

• Refactor / maintainability improvement

Testing

• Full workspace type checks, lint, repository audits (including import and API validation), generators and docs checks pass.
• External source comparison confirms caller logic and content are unchanged.
• Original and extracted components have matching computed styles in light/dark browser fixtures; keyboard, disabled and expansion behavior checked. These are isolated fixtures, not full authenticated product flows.
• Relevant existing tests pass. No landing-page changes or audit tooling included.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated
docs	Skipped		Sep 22, 2026 7:59pm UTC

[greptile-apps]

Confidence Score: 5/5

The PR appears safe to merge, with no outstanding correctness, security, or repository-rule issues identified.

Summary

This PR extracts the canvas navigation actions into a shared CanvasControlButton while preserving existing active/ghost variants, dimensions, disabled states, labels, tooltips, and handlers.

• Adds a typed, ref-forwarding wrapper around the EMCN Button.
• Reuses the wrapper for canvas mode, undo, redo, and fit-to-view controls.
• Both previous findings are resolved in the current code: props use an interface, and the unnecessary client directive is absent.

_{Reviews (4) · Last reviewed commit: "improvement(ui): share canvas toolbar co..."}

[cubic-dev-ai]

No issues found across 2 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}

[BillLeoutsakosvl346]

@greptile

[BillLeoutsakosvl346]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@BillLeoutsakosvl346 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

No issues found across 2 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}

[BillLeoutsakosvl346]

@greptile

[BillLeoutsakosvl346]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@BillLeoutsakosvl346 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

No issues found across 2 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}

[BillLeoutsakosvl346]

Before / after visual comparison

Canvas actions share CanvasControlButton. Quiet, active and disabled appearances are shown.

Left = before; right = after.

Rendered component fixtures with application CSS and local data, rather than authenticated product-page screenshots. These are representative visual examples, not end-to-end behavior coverage.

Current PR head checked at posting: 97f93396c1.

[BillLeoutsakosvl346]

@greptile

[BillLeoutsakosvl346]

@cubic-dev-ai review this PR

[cubic-dev-ai]

@cubic-dev-ai review this PR

@BillLeoutsakosvl346 I have started the AI code review. It will take a few minutes to complete.

[cubic-dev-ai]

No issues found across 2 files

Confidence score: 5/5

• Automated review surfaced no issues in the provided summaries.
• No files require special attention.

_{Re-trigger cubic}