feat(playground-ui): add processor combobox for breadcrumb navigation

[mfrachet]

Adds a ProcessorCombobox component to the processor page header, matching the pattern already used on agent pages. Now you can quickly switch between processors without going back to the list.

The breadcrumb updates from just "Processors" to "Processors > [dropdown]" where the dropdown shows all available processors and navigates on selection.

<Breadcrumb>
  <Crumb as={Link} to="/processors">Processors</Crumb>
  <Crumb as="span" to="" isCurrent>
    <ProcessorCombobox value={processorId} variant="ghost" />
  </Crumb>
</Breadcrumb>

Summary by CodeRabbit

• New Features
  • Added a processor combobox in the processor page header for quick navigation, including loading and error states and toast notifications.
• Tests
  • Updated end-to-end test to verify the presence and visibility of the processor combobox in the header.
• Chores
  • Added a changeset entry for a patch release.

_{✏️ Tip: You can customize this high-level summary in your review settings.}

[changeset-bot]

🦋 Changeset detected

Latest commit: a687283

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages

Name	Type
@mastra/playground-ui	Patch
@internal/playground	Patch
mastra	Patch
create-mastra	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

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

Project	Deployment	Review	Updated (UTC)
assistant-ui	Ready	Preview, Comment	Jan 27, 2026 7:47pm
mastra-docs	Ready	Preview, Comment	Jan 27, 2026 7:47pm
mastra-docs-1.x	Building	Preview, Comment	Jan 27, 2026 7:47pm

[coderabbitai]

Walkthrough

Adds a new ProcessorCombobox React component and its export, integrates it into the processor page header (replacing prior header group and icon), updates an end-to-end test to expect the combobox, and adds a changeset documenting the UI change.

Changes

Cohort / File(s)	Change Summary
Changelog \.changeset/bumpy-parks-look.md	New changeset entry documenting a patch release and noting that a processor combobox was added to the processor page header.
New UI Component & Export packages/playground-ui/src/domains/processors/components/processor-combobox.tsx, packages/playground-ui/src/domains/processors/components/index.ts	Adds ProcessorCombobox component with loading/error states, processor option mapping, navigation handling, and exports it via the domain components index.
Page Integration packages/playground/src/pages/processors/processor/index.tsx	Replaces header group with a breadcrumb containing ProcessorCombobox, swaps Cpu icon for ProcessorIcon, and adds a loading skeleton crumb.
E2E Test packages/playground/e2e/tests/processors/$processorId/page.spec.ts	Renames test to verify presence of the processor combobox for navigation and updates assertions to locate the combobox.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and directly describes the main change: adding a processor combobox for breadcrumb navigation. It follows imperative mood, uses proper capitalization, includes a scope prefix (playground-ui), and is concise at 69 characters.

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

✨ Finishing touches

• 📝 Generate docstrings

---

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.}

[coderabbitai]

Actionable comments posted: 1

🤖 Fix all issues with AI agents

In @.changeset/bumpy-parks-look.md:
- Around line 1-5: The changeset description mentions a page header integration
that affects packages/playground/src/pages/processors/processor/index.tsx
(belongs to `@mastra/playground`) but the frontmatter only lists
`@mastra/playground-ui`; fix by either updating the changeset text to only
describe the new processor combobox component within `@mastra/playground-ui` or
add a new changeset entry that lists `@mastra/playground` and describes the page
header integration in
packages/playground/src/pages/processors/processor/index.tsx so the scope
matches the files changed.

🧹 Nitpick comments (1)

packages/playground-ui/src/domains/processors/components/processor-combobox.tsx (1)

38-46: Consider simplifying the filter and map chain.

The logic is correct, but you could combine the filter predicate with optional chaining more concisely.

Optional: Simplify with nullish check

 const processorOptions = Object.keys(processors)
   .filter(key => {
     const processor = processors[key];
-    return processor?.phases && processor.phases.length > 0;
+    return processor?.phases?.length;
   })
   .map(key => ({
     label: processors[key]?.name || key,
     value: key,
   }));

[coderabbitai]

⚠️ Potential issue | 🟡 Minor

potential_issue: Changeset scope mismatch.

The description mentions "processor page header" integration, but the frontmatter only lists @mastra/playground-ui. The actual page header integration occurs in packages/playground/src/pages/processors/processor/index.tsx, which belongs to @mastra/playground.

Per coding guidelines: "Check that the description inside the changeset file only applies to the packages listed in the frontmatter."

Either:

1. Update the description to focus only on the component addition in @mastra/playground-ui, or
2. Add a separate changeset for @mastra/playground to cover the page integration

Option 1: Update description to focus on component only

 ---
 '@mastra/playground-ui': patch
 ---
 
-Added processor combobox to processor page header for quick navigation between processors
+Added ProcessorCombobox component for quick navigation between processors

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change

	---
	'@mastra/playground-ui': patch
	---
	Added processor combobox to processor page header for quick navigation between processors
	---
	'@mastra/playground-ui': patch
	---
	Added ProcessorCombobox component for quick navigation between processors

🤖 Prompt for AI Agents

In @.changeset/bumpy-parks-look.md around lines 1 - 5, The changeset description
mentions a page header integration that affects
packages/playground/src/pages/processors/processor/index.tsx (belongs to
`@mastra/playground`) but the frontmatter only lists `@mastra/playground-ui`; fix by
either updating the changeset text to only describe the new processor combobox
component within `@mastra/playground-ui` or add a new changeset entry that lists
`@mastra/playground` and describes the page header integration in
packages/playground/src/pages/processors/processor/index.tsx so the scope
matches the files changed.