CopilotKit
Cpk 2443 travel demo
What does this PR do?
This PR addresses the demo ticket #2443. This allows the addition of checkboxes and updated dropdown UI
- [ ] I have read the Contribution Guide
- [ ] If the PR changes or adds functionality, I have updated the relevant documentation
![linear[bot] avatar](https://avatars.githubusercontent.com/in/20150?v=4 "Published by a pub.dev verified publisher"){kind=small}
The latest updates on your projects. Learn more about Vercel for Git ↗︎
| Name | Status | Preview | Comments | Updated (UTC) |
|---|---|---|---|---|
| ag2-feature-viewer | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| ag2-starter | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| coagents-starter-crewai-flows | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilot-kit | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilot-kit-qd8p | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilot-kit-wq8x | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilot-mastra-starter | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilotkit-feature-viewer | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| copilotkit-mastra-feature-viewer | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| demo-viewer | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| docs | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| examples-coagents-ai-travel-app | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
| examples-coagents-research-canvas-ui | ✅ Ready (Inspect) | Visit Preview | 💬 Add feedback | Jun 6, 2025 10:37am |
1 Skipped Deployment
| Name | Status | Preview | Comments | Updated (UTC) |
|---|---|---|---|---|
| examples-coagents-ai-researcher-ui | ⬜️ Ignored (Inspect) | Visit Preview | Jun 6, 2025 10:37am |
![vercel[bot] avatar](https://avatars.githubusercontent.com/in/8329?v=4 "Published by a pub.dev verified publisher"){kind=small}
Hey @orca-copilotkit I gave this a test. Some initial feedback.
- If I select a collection of items, I notice that those selections are not respected by the LLM. For example, if I select a subset of suggestions then it will still add all of them.
- When the agent is editing a trip, we should only include the delta of suggestions to include. I.E if I have a trip with 3 places already selected, then the suggestion from the agent should only include what is new.
⏭️ Changeset Not Required
Latest commit: 76b5d00169cb972980b45bcc9322d429c7bdeadc
No changes in this PR affected the @copilitkit/* packages. Merging this PR will not cause a version bump for any packages.
Changeset is not required for this PR.
![changesets-bot-copilotkit[bot] avatar](https://avatars.githubusercontent.com/u/131273140?v=4 "Published by a pub.dev verified publisher"){kind=small}
Walkthrough
The changes introduce interactive selection of places within trips in the coagents travel example. The UI components for adding and editing trips now support selecting specific places via checkboxes, with the selection state managed in React and passed to action handlers. The backend logic in trips.py is updated to parse and process these selections, handling different modes for adding or editing trips. Visual and behavioral updates to components ensure checkboxes are conditionally shown, and trip selection UI is improved.
Changes
| File(s) | Change Summary |
|---|---|
agent/travel/trips.py |
Added JSON parsing and conditional logic in perform_trips_node to handle selected places and modes; updated handle_add_trips to set selected_trip_id after adding trips; minor formatting changes. |
ui/components/PlaceCard.tsx |
Enhanced to support optional checkbox display with new props: checked, onCheck, and shouldShowCheckbox. Checkbox state and handler are integrated into the component layout. |
ui/components/MapCanvas.tsx, ui/components/PlaceForMap.tsx |
Updated PlaceCard usage to explicitly set shouldShowCheckbox={false} to hide checkboxes in map-related contexts. |
ui/components/humanInTheLoop/ActionButtons.tsx |
Refactored to accept selectedPlaceIds and type props; updated approve handler to serialize selected IDs and mode; added logging of selection state. |
ui/components/humanInTheLoop/AddTrips.tsx |
Added state for tracking selected place IDs; checkboxes in PlaceCard reflect and update this state; passes selection to ActionButtons. |
ui/components/humanInTheLoop/EditTrips.tsx |
Accepts trips and selectedTripId as props; tracks selected places; computes and renders only differing places; integrates checkbox selection and passes to ActionButtons with type="edit". |
ui/lib/hooks/use-trips.tsx |
Ensures default selected_trip_id is always set; updates how EditTrips is rendered for copilot actions to pass current trips and selected trip ID as props. |
ui/components/TripSelect.tsx |
Changes selected trip menu item to be visually distinct (bold, dark text) instead of disabled, allowing interaction with all items. |
ui/components/EditPlace.tsx, ui/components/PlaceForm.tsx, ui/components/SearchProgress.tsx, ui/components/TripContent.tsx |
Removed trailing newlines; no functional changes. |
Sequence Diagram(s)
sequenceDiagram
participant User
participant AddTrips/EditTrips UI
participant PlaceCard
participant ActionButtons
participant Backend (trips.py)
User->>AddTrips/EditTrips UI: Selects/deselects places (checkboxes)
AddTrips/EditTrips UI->>PlaceCard: Renders with checked/onCheck props
User->>ActionButtons: Clicks Approve
ActionButtons->>Backend (trips.py): Sends selectedPlaceIds + mode (edit/add)
Backend (trips.py)->>Backend (trips.py): Parses selection and mode, updates trip state accordingly
Suggested reviewers
- tylerslaton
- mme
✨ 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.
🪧 Tips
Chat
There are 3 ways to chat with CodeRabbit:
‼️ IMPORTANT Auto-reply has been disabled for this repository in the CodeRabbit settings. The CodeRabbit bot will not respond to your replies unless it is explicitly tagged.
- Files and specific lines of code (under the "Files changed" tab): Tag
@coderabbitaiin a new review comment at the desired location with your query. Examples:@coderabbitai explain this code block.@coderabbitai modularize this function.
- PR comments: Tag
@coderabbitaiin a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.@coderabbitai read src/utils.ts and explain its main purpose.@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.@coderabbitai help me debug CodeRabbit configuration file.
Support
Need help? Create a ticket on our support page for assistance with any issues or questions.
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.
CodeRabbit Commands (Invoked using PR comments)
@coderabbitai pauseto pause the reviews on a PR.@coderabbitai resumeto resume the paused reviews.@coderabbitai reviewto trigger an incremental review. This is useful when automatic reviews are disabled for the repository.@coderabbitai full reviewto do a full review from scratch and review all the files again.@coderabbitai summaryto regenerate the summary of the PR.@coderabbitai generate docstringsto generate docstrings for this PR.@coderabbitai generate sequence diagramto generate a sequence diagram of the changes in this PR.@coderabbitai resolveresolve all the CodeRabbit review comments.@coderabbitai configurationto show the current CodeRabbit configuration for the repository.@coderabbitai helpto get help.
Other keywords and placeholders
- Add
@coderabbitai ignoreanywhere in the PR description to prevent this PR from being reviewed. - Add
@coderabbitai summaryto generate the high-level summary at a specific location in the PR description. - Add
@coderabbitaianywhere in the PR title to generate the title automatically.
Documentation and Community
- Visit our Documentation for detailed information on how to use CodeRabbit.
- Join our Discord Community to get help, request features, and share feedback.
- Follow us on X/Twitter for updates and announcements.
![coderabbitai[bot] avatar](https://avatars.githubusercontent.com/in/347564?v=4 "Published by a pub.dev verified publisher"){kind=small}
![github-actions[bot] avatar](https://avatars.githubusercontent.com/in/15368?v=4 "Published by a pub.dev verified publisher"){kind=small}
Test Results
Status: ✅ Passed (View Run)
Commit: efcf3e0
Duration: 347.2s
Total Tests: 32
Pass Rate: 100.0%
Failed Tests: 0
🔍 Detailed Results
coagents-research-canvas
CoAgents Research Canvas (UI) - Local Depenencies
| Model | Browser | Status | Video |
|---|---|---|---|
| OpenAI | chromium | ✅ PASSED | - |
| Anthropic | chromium | ✅ PASSED | - |
| CrewAI | chromium | ✅ PASSED | - |
| OpenAI (LGC Python in-memory) | chromium | ✅ PASSED | - |
| Anthropic (LGC Python in-memory) | chromium | ✅ PASSED | - |
| OpenAI (LGC JS in-memory) | chromium | ✅ PASSED | - |
| Anthropic (LGC JS in-memory) | chromium | ✅ PASSED | - |
coagents-qa-native
CoAgents QA Native (UI) - Local
| Model | Browser | Status | Video |
|---|---|---|---|
| OpenAI | chromium | ✅ PASSED | - |
| Anthropic | chromium | ✅ PASSED | - |
| OpenAI (LGC Python) | chromium | ✅ PASSED | - |
| Anthropic (LGC Python) | chromium | ✅ PASSED | - |
| OpenAI (LGC JS) | chromium | ✅ PASSED | - |
| Anthropic (LGC JS) | chromium | ✅ PASSED | - |
coagents-qa-text
CoAgents QA Text (UI) - Local
| Model | Browser | Status | Video |
|---|---|---|---|
| OpenAI | chromium | ✅ PASSED | - |
| Anthropic | chromium | ✅ PASSED | - |
| OpenAI (LGC Python) | chromium | ✅ PASSED | - |
| Anthropic (LGC Python) | chromium | ✅ PASSED | - |
| OpenAI (LGC JS) | chromium | ✅ PASSED | - |
| Anthropic (LGC JS) | chromium | ✅ PASSED | - |
coagents-routing
CoAgents Routing (UI) - Local
| Model | Browser | Status | Video |
|---|---|---|---|
| OpenAI | chromium | ✅ PASSED | - |
| Anthropic | chromium | ✅ PASSED | - |
| OpenAI (LGC Python) | chromium | ✅ PASSED | - |
| Anthropic (LGC Python) | chromium | ✅ PASSED | - |
| OpenAI (LGC JS) | chromium | ✅ PASSED | - |
| Anthropic (LGC JS) | chromium | ✅ PASSED | - |
next-openai
Next OpenAI - Self Hosted
| Model | Browser | Status | Video |
|---|---|---|---|
| OpenAI | chromium | ✅ PASSED | - |
| Anthropic | chromium | ✅ PASSED | - |
| Google Generative AI | chromium | ✅ PASSED | - |
| LangChain (OpenAI) | chromium | ✅ PASSED | - |
| LangChain (Anthropic) | chromium | ✅ PASSED | - |
| LangChain (Gemini) | chromium | ✅ PASSED | - |
| Groq | chromium | ✅ PASSED | - |