feat: improve event presentation with separate icons and add aria labels to buttons

web/src/components/AssistantChat/messages/ToolMessage.tsx

@@ -1,7 +1,7 @@
 import type { ToolCallMessagePartProps } from '@assistant-ui/react'
 import type { ChatBlock } from '@/chat/types'
 import type { ToolCallBlock } from '@/chat/types'
-import { renderEventLabel } from '@/chat/presentation'
+import { getEventPresentation } from '@/chat/presentation'
 import { CodeBlock } from '@/components/CodeBlock'
 import { MarkdownRenderer } from '@/components/MarkdownRenderer'
 import { LazyRainbowText } from '@/components/LazyRainbowText'
@@ -77,10 +77,14 @@ function HappyNestedBlockList(props: {
                 }
 
                 if (block.kind === 'agent-event') {
+                    const presentation = getEventPresentation(block.event)
                     return (
                         <div key={`event:${block.id}`} className="py-1">
                             <div className="mx-auto w-fit max-w-[92%] px-2 text-center text-xs text-[var(--app-hint)] opacity-80">
-                                {renderEventLabel(block.event)}
+                                <span className="inline-flex items-center gap-1">
+                                    {presentation.icon ? <span aria-hidden="true">{presentation.icon}</span> : null}
+                                    <span>{presentation.text}</span>
+                                </span>
                             </div>
                         </div>
                     )