Refactor assistant UI template with sidebar and sections

[Abdullakala]

PR Checklist

Please check if your PR fulfills the following requirements:

• The commit message follows our guidelines: https://voltagent.dev/docs/community/contributing/#commit-convention

Bugs / Features

• Related issue(s) linked
• Tests for the changes have been added
• Docs have been added / updated
• Changesets have been added https://voltagent.dev/docs/community/contributing/#creating-a-changeset

What is the current behavior?

What is the new behavior?

fixes (issue)

Notes for reviewers

---

Summary by cubic

Extracted a reusable AssistantUiTemplate that encapsulates the sidebar, header, breadcrumbs, and thread view. This keeps behavior the same and simplifies the assistant page for reuse.

• Refactors
  • Added components/assistant-ui/assistant-ui-template.tsx with the full layout (sidebar, breadcrumbs, header, thread).
  • Replaced inline layout in app/assistant.tsx with <AssistantUiTemplate />.
  • No UI or behavioral changes.

^{Written for commit f600508. Summary will update on new commits. Review in cubic}

Summary by CodeRabbit

• Refactor
  • Consolidated the Assistant component's internal structure by introducing a unified template component, improving code organization and maintainability while preserving existing functionality.

[changeset-bot]

⚠️ No Changeset found

Latest commit: f600508

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

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

[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: ca22aef1-a618-49bb-af10-93a133a01a79

📥 Commits

Reviewing files that changed from the base of the PR and between 08414ed and f600508.

📒 Files selected for processing (2)

• examples/with-assistant-ui/app/assistant.tsx
• examples/with-assistant-ui/components/assistant-ui/assistant-ui-template.tsx

---

📝 Walkthrough

Walkthrough

A new AssistantUiTemplate component encapsulates the assistant UI layout, including sidebar, thread view, and breadcrumb header. The Assistant component is refactored to render this single template instead of manually composing multiple layout and UI components.

Changes

Assistant UI Template Extraction

Layer / File(s)	Summary
AssistantUiTemplate component examples/with-assistant-ui/components/assistant-ui/assistant-ui-template.tsx	New client component that wraps content in SidebarProvider, renders ThreadListSidebar, and composes a header with SidebarTrigger, Separator, and breadcrumb navigation above the Thread view placed inside SidebarInset.
Assistant component refactored to use template examples/with-assistant-ui/app/assistant.tsx	Import updated to use AssistantUiTemplate and render call simplified from manual composition of sidebar/thread/header components to a single <AssistantUiTemplate /> invocation. Chat runtime setup remains unchanged.

Estimated Code Review Effort

🎯 2 (Simple) | ⏱️ ~10 minutes

🐰 A template was born so clean and neat,
Where sidebars and threads all kindly meet!
No more scattered components here and there—
Just one tidy AssistantUiTemplate, fresh as spring air! 🌱

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	❓ Inconclusive	The description includes an auto-generated summary explaining the refactoring clearly, but most template sections remain empty or incomplete (empty behavior descriptions, no issue reference, no checklist items marked).	Fill in current/new behavior sections, link related issues, confirm if tests/docs/changesets were added, and mark relevant checklist items as completed.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main refactoring: extracting a reusable AssistantUiTemplate that encapsulates sidebar, breadcrumbs, header, and thread view.
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

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

Tip

💬 Introducing Slack Agent: The best way for teams to turn conversations into code.

Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.

• Generate code and open pull requests
• Plan features and break down work
• Investigate incidents and troubleshoot customer tickets together
• Automate recurring tasks and respond to alerts with triggers
• Summarize progress and report instantly

Built for teams:

• Shared memory across your entire org—no repeating context
• Per-thread sandboxes to safely plan and execute work
• Governance built-in—scoped access, auditability, and budget controls

One agent for your entire SDLC. Right inside Slack.

👉 Get started

---

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

[Copilot]

Pull request overview

This PR refactors the with-assistant-ui example by extracting the previously inlined assistant UI layout (sidebar + header + thread area) into a dedicated AssistantUiTemplate component, keeping the runtime wiring in app/assistant.tsx focused on provider/transport setup.

Changes:

• Added a new AssistantUiTemplate component encapsulating the sidebar + breadcrumb header + thread layout.
• Simplified app/assistant.tsx to render the template inside AssistantRuntimeProvider.

Reviewed changes

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

File	Description
examples/with-assistant-ui/components/assistant-ui/assistant-ui-template.tsx	Introduces a reusable UI layout component for the assistant page (sidebar + header + thread container).
examples/with-assistant-ui/app/assistant.tsx	Replaces inlined UI markup with the extracted AssistantUiTemplate, preserving runtime/provider wiring.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[cubic-dev-ai]

No issues found across 2 files

_{Re-trigger cubic}