| @@ -1,6 +1,7 @@ | ||
| 1 | 1 | import { recordAgentActivity } from '@agent/api'; |
| 2 | 2 | import { AnimateChunks } from '@agent/components/messages/AnimateChunks'; |
| 3 | +import { ReplyOptions } from '@agent/components/ReplyOptions'; | |
| 3 | 4 | import { magic } from '@agent/icons'; |
| 4 | 5 | import pageTours from '@agent/lib/page-tours'; |
| 5 | 6 | import tours from '@agent/tours/tours'; |
| 6 | 7 | import { SingleTour } from '@agent/workflows/misc/components/ToursList'; |
| @@ -29,13 +30,14 @@ | ||
| 29 | 30 | agent3: pencil, |
| 30 | 31 | agent4: cog, |
| 31 | 32 | }; |
| 32 | 33 | |
| 33 | -export const AgentMessage = ({ message, animate }) => { | |
| 34 | +export const AgentMessage = ({ message, animate, active }) => { | |
| 34 | 35 | const { |
| 35 | 36 | content, |
| 36 | 37 | role, |
| 37 | 38 | pageSuggestion, |
| 39 | + qaSuggestions, | |
| 38 | 40 | agent, |
| 39 | 41 | sessionId = 'not-set', |
| 40 | 42 | } = message.details; |
| 41 | 43 | const containsCodeBlock = /```[\s\S]*?```/.test(content); |
| @@ -51,9 +53,9 @@ | ||
| 51 | 53 | |
| 52 | 54 | return ( |
| 53 | 55 | <div |
| 54 | 56 | data-agent-message-role={role} |
| 55 | - className="flex w-full items-start gap-2.5 p-2" | |
| 57 | + className="flex w-full items-start gap-2.5 px-2.5 py-2" | |
| 56 | 58 | > |
| 57 | 59 | <div className="w-7 shrink-0"> |
| 58 | 60 | {agent?.avatar ? ( |
| 59 | 61 | <img className="mt-px" src={agent.avatar} alt={agent.name} /> |
| @@ -94,8 +96,21 @@ | ||
| 94 | 96 | <div> |
| 95 | 97 | <SingleTour tour={agentSuggestion.tour} /> |
| 96 | 98 | </div> |
| 97 | 99 | )} |
| 100 | + {/* An empty array still renders — it's the agent asking with no drafts. */} | |
| 101 | + {active && Array.isArray(qaSuggestions) ? ( | |
| 102 | + <ReplyOptions | |
| 103 | + options={qaSuggestions} | |
| 104 | + onSubmit={(message) => | |
| 105 | + window.dispatchEvent( | |
| 106 | + new CustomEvent('extendify-agent:chat-submit', { | |
| 107 | + detail: { message }, | |
| 108 | + }), | |
| 109 | + ) | |
| 110 | + } | |
| 111 | + /> | |
| 112 | + ) : null} | |
| 98 | 113 | </div> |
| 99 | 114 | </div> |
| 100 | 115 | ); |
| 101 | 116 | }; |