feat: replace ui with tiny-robot #1385
Conversation
WalkthroughThe changes update the robot plugin by importing a CSS stylesheet, adding new dependencies to its package configuration, and refactoring the main chat UI component to use modular components from the Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant MainVue
participant TrContainer
participant TrPrompts
participant TrBubbleList
participant TrSender
User->>MainVue: Opens robot chat
MainVue->>TrContainer: Render chat container (visible)
alt No messages
TrContainer->>TrPrompts: Show prompt items
User->>TrPrompts: Clicks prompt
TrPrompts->>MainVue: handlePromptItemClick
MainVue->>TrBubbleList: Add message bubble
else Messages exist
TrContainer->>TrBubbleList: Display message bubbles
end
TrContainer->>TrSender: Show input area
User->>TrSender: Types and submits message
TrSender->>MainVue: onSend event
MainVue->>TrBubbleList: Add new message bubble
Poem
Tip ⚡️ Faster reviews with caching
Enjoy the performance boost—your workflow just got faster. ✨ Finishing Touches
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed 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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🔭 Outside diff range comments (2)
packages/plugins/robot/src/Main.vue (2)
206-210:⚠️ Potential issueScrolling logic now targets a non-existent element
document.getElementById('chatgpt-window')no longer matches anything in the new tiny-robot layout, so automatic scrolling will silently fail.-const scrollElement = document.getElementById('chatgpt-window') +const scrollElement = + document.querySelector('.tiny-container .tr-bubble-list') ?? + document.querySelector('.tiny-container')Alternatively, if
tr-bubble-listexposes an API, use that instead of manual DOM queries.Don’t forget to update any accompanying CSS that referenced
#chatgpt-window.
412-412:⚠️ Potential issueTypo: use
scoped, notscope, to enable Vue style scopingVue’s compiler only recognises the
scopedattribute:-<style lang="less" scope> +<style lang="less" scoped>Without this, styles will leak globally and
:deepselectors become unnecessary.
🧹 Nitpick comments (3)
packages/plugins/robot/index.ts (1)
16-16: Validate side-effects of global CSS importImporting the compiled stylesheet at the plugin’s entry point guarantees the new UI renders correctly, but it also means every consumer that bundles several Tiny-Engine plugins will pick up ‟@opentiny/tiny-robot” styles—potentially more than once and possibly on the server during SSR.
Please double-check:
- The bundler (Vite / Rollup) tree-shakes duplicate CSS or de-duplicates at runtime.
- The plugin is never executed in a non-browser context where importing a CSS asset would throw.
If either risk is relevant, consider documenting the expectation or moving the import into the top-level
Main.vueso it is pulled only when the component is actually mounted.packages/plugins/robot/package.json (1)
28-31: Re-check version pinning of α-stage robot packagesAll three newly added dependencies are locked to
0.2.0-alpha.1. Using an alpha build is totally fine for experimental work, but please be aware:
- α tags are prone to breaking changes with no semver guarantees.
- When multiple plugins bring their own α versions you may face duplication or resolution conflicts.
If the robot packages release frequently, switching to the caret (
^0.2.0-alpha.1) or a range (~0.2.0-alpha) could ease upgrades while still staying on the α channel.packages/plugins/robot/src/Main.vue (1)
441-444::deepselectors become redundant once the style is un-scopedAfter correcting the attribute to
scoped, any rule wrapped with:deep()is applied globally and bypasses scoping anyway. Review whether the extra selector layer is still required; removing it simplifies the stylesheet and reduces specificity wars.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
packages/plugins/robot/index.ts(1 hunks)packages/plugins/robot/package.json(1 hunks)packages/plugins/robot/src/Main.vue(5 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: push-check
English | 简体中文
PR
PR Checklist
Please check if your PR fulfills the following requirements:
PR Type
What kind of change does this PR introduce?
Background and solution
What is the current behavior?
Issue Number: N/A
What is the new behavior?
Does this PR introduce a breaking change?
Other information
Summary by CodeRabbit
New Features
Refactor
Chores