Add support for SmartConversation::Message component#464
Conversation
Elodie-DeMatteis-Upf
left a comment
There was a problem hiding this comment.
A few nitpicks. Otherwise LGTM!
| @tracked collapsed: boolean = true; | ||
|
|
||
| get collapsible(): boolean { | ||
| return this.args.type === 'smart_reply'; |
There was a problem hiding this comment.
Product nit: User prompts are not collapsible? Even if they are very long? 🤔
There was a problem hiding this comment.
actually, nothing actually says it in the spec so i'll rollback this change. I just didn't see how it could naturally be that long unless someone drops a lorem ipsum in the prompt 😅
There was a problem hiding this comment.
@Miexil following our discussion yesterday, do you think it's worth having collapsible as an arg (default: true) for potential future uses?
There was a problem hiding this comment.
I think we can make a mini update here in the future if needed 🙏
| setupRenderingTest(hooks); | ||
|
|
||
| hooks.beforeEach(function () { | ||
| this.timestamp = moment('2026-05-05').valueOf(); |
There was a problem hiding this comment.
It may be better to test it with different day/month values, just to be sure
| gap: var(--spacing-px-18); | ||
| padding: var(--spacing-px-12) var(--spacing-px-18); | ||
| font-size: var(--font-size-md); | ||
| font-family: 'Reddit Sans', sans-serif; |
| class={{this.computedClasses}} | ||
| role="button" | ||
| data-control-name="smart-conversation-message" | ||
| {{on "click" this.toggleCollapsed}} |
There was a problem hiding this comment.
maybe we can add in the splattributes just-in-case
| @tracked collapsed: boolean = true; | ||
|
|
||
| get collapsible(): boolean { | ||
| return this.args.type === 'smart_reply'; |
There was a problem hiding this comment.
I think we can make a mini update here in the future if needed 🙏
| export default class UtilsSmartConversationMessageComponent extends Component<UtilsSmartConversationMessageComponentSignature> { | ||
| @tracked collapsed: boolean = true; | ||
|
|
||
| get collapsible(): boolean { |
What does this PR do?
Add support for SmartConversation::Message component, to be used in Chat-like UIs w/ our LLM provider backed.
The message is properly styled depending on whether it's a user prompt or a reply from the system, with replies being also collapsible (collapsed by default)
What are the observable changes?
🧑💻 Developer Heads Up
⚡ Since we are using Ember Octane now:
Useful Resource : Ember Octane vs Classic Cheat Sheet
Good PR checklist