@stack-spot/ai-chat-widget 3.5.0-beta.5 → 3.6.0-beta.5

package/dist/views/Resources.js.map

@@ -1 +1 @@
-{"version":3,"file":"Resources.js","sourceRoot":"","sources":["../../src/views/Resources.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Resources.js","sourceRoot":"","sources":["../../src/views/Resources.tsx"],"names":[],"mappings":"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"}

package/dist/views/Tools.js

@@ -38,7 +38,7 @@ const ToolsPanel = () => {
     const [agent] = agentToolsClient.agent.useStatefulQuery({ agentId: message?.agent?.id || '' }, { enabled: !!message?.agent?.id });
     const tools = useMemo(() => message?.tools?.map(id => toolById(id, toolKits)), [messageId, toolKits]);
     const customTools = useMemo(() => message?.tools?.map(id => toolById(id, agent?.toolkits?.custom_toolkits)), [messageId, agent?.toolkits?.custom_toolkits]);
-    return !!(tools?.length || customTools?.length) && (_jsx(ToolList, { children: [...(tools || []), ...(customTools || [])].map((tool) => tool && (_jsx("li", { children: _jsx(ToolBadge, { name: tool.name || tool.id, image: tool.image ?? '', description: tool.description ?? '' }) }, tool.id))) }));
+    return !!(tools?.length || customTools?.length) && (_jsx(ToolList, { children: [...(tools || []), ...(customTools || [])].map((tool) => tool && (_jsx("li", { children: _jsx(ToolBadge, { name: tool.name || tool.id || '', image: tool.image ?? '', description: tool.description ?? '' }) }, tool.id))) }));
 };
 const dictionary = {
     en: {

package/dist/views/Tools.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tools.js","sourceRoot":"","sources":["../../src/views/Tools.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Tools.js","sourceRoot":"","sources":["../../src/views/Tools.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/ai-chat-widget",
-  "version": "3.5.0-beta.5",
+  "version": "3.6.0-beta.5",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -16,7 +16,7 @@
     "@citric/core": "^6.4.0",
     "@stack-spot/portal-components": "^2.27.3",
     "@citric/icons": "^5.13.0",
-    "@stack-spot/portal-network": "0.206.0",
+    "@stack-spot/portal-network": "0.211.2",
     "@citric/ui": "^6.10.2",
     "@stack-spot/portal-translate": "^2.1.0",
     "lodash": "^4.17.0",

package/src/app-metadata.json

@@ -1,7 +1,7 @@
 {
   "name": "@stack-spot/ai-chat-widget",
-  "version": "3.5.0-beta.5",
-  "date": "Fri Dec 12 2025 17:26:09 GMT+0000 (Coordinated Universal Time)",
+  "version": "3.6.0-beta.5",
+  "date": "Tue Dec 23 2025 13:01:07 GMT+0000 (Coordinated Universal Time)",
   "dependencies": [
     {
       "name": "@stack-spot/app-metadata",
@@ -121,7 +121,7 @@
     },
     {
       "name": "@stack-spot/portal-network",
-      "version": "0.206.0(@stack-spot/auth@6.1.0)(@stack-spot/opa@2.5.0(@stack-spot/auth@6.1.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@stack-spot/portal-translate@2.1.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@tanstack/react-query@5.59.16(react@18.2.0))(react-dom@18.2.0(react@18.2.0))(react@18.2.0)"
+      "version": "0.211.2(@stack-spot/auth@6.1.0)(@stack-spot/opa@2.5.0(@stack-spot/auth@6.1.0)(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@stack-spot/portal-translate@2.1.0(react-dom@18.2.0(react@18.2.0))(react@18.2.0))(@tanstack/react-query@5.59.16(react@18.2.0))(react-dom@18.2.0(react@18.2.0))(react@18.2.0)"
     },
     {
       "name": "@stack-spot/portal-theme",

package/src/chat-interceptors/quick-commands.ts

@@ -271,8 +271,8 @@ export function createQuickCommandInterceptor(widget: WidgetState, getEditor: ()
         stepSlug: step.slug,
         slug: slug,
         quickCommandStartScriptRequest: {
-          input_data: customInputs,
-          selected_code: code,
+          input_data: code,
+          custom_inputs: customInputs,
           context: stepContext,
           slugs_executions: resultMap,
         },

package/src/chat-interceptors/send-message.ts

@@ -37,6 +37,7 @@ export function createEntryValueFromChatResponse(
     opportunities: response.opportunities,
     hypothesis: response.hypothesis,
     prfaq: response.prfaq,
+    done: false,
   }
   return entry as TextChatEntry
 }
@@ -75,23 +76,6 @@ const updateToolStatus = (agentInfo: AgentInfo, messages: ChatEntry[]) => {
     if (update) {
       originalItem?.setValue({ ...originalItemValue as TextChatEntry })
     }
-
-    //Updates message with type tool which contains the actually tool steps
-    //We only want to show tools banner when they are awaiting_approval, by removing the step
-    // we avoid the entire bot message to be visible
-    const toolMessageId = planningToolDictionaryHelper.getMessageIdToolStepFromToolExecutionId(executionId)
-    const toolOriginalItem = messages.find((message) => `${message.id}` === toolMessageId)
-    const toolOriginalItemValue = toolOriginalItem?.getValue()
-    const toolStep = toolOriginalItemValue?.steps?.find(step =>
-      step.type === 'tool' && step.attempts?.[0]?.tools?.[0]?.executionId === executionId)
-    update = false
-    if (toolOriginalItemValue && toolStep && toolStep.status !== status) {
-      toolOriginalItemValue.steps = undefined
-      update = true
-    }
-    if (update) {
-      toolOriginalItem?.setValue({ ...toolOriginalItemValue as TextChatEntry })
-    }
   }
 }
 
@@ -192,7 +176,8 @@ export function helperSendMessage(messages: ChatEntry[], value: Partial<ChatResp
     }
   }
 
-  botEntry.setValue(createEntryValueFromChatResponse(value, knowledgeSources, chat.get('agent')))
+  const hasPlanning = botEntry.getValue().hasPlanning || chat.get('isPlaning')
+  botEntry.setValue({ ...createEntryValueFromChatResponse(value, knowledgeSources, chat.get('agent')), hasPlanning })
 }
 
 /**
@@ -259,7 +244,10 @@ export async function sendMessageInterceptor(entry: ChatEntry, chat: ChatState,
     }
   }
   if (finalValue?.answer) {
-    botEntry.setValue(createEntryValueFromChatResponse(finalValue, botEntry.getValue().knowledgeSources, chat.get('agent'), true))
+    botEntry.setValue({
+      ...createEntryValueFromChatResponse(finalValue, botEntry.getValue().knowledgeSources, chat.get('agent'), true),
+      hasPlanning: botEntry.getValue().hasPlanning,
+    })
     aiClient.chat.invalidate({ conversationId: chat.id })
     if (isFirstMessage) {
       // if the chat has a title and this was its first message, we need to rename it according to the title, otherwise, the backend will
@@ -279,6 +267,6 @@ export async function sendMessageInterceptor(entry: ChatEntry, chat: ChatState,
       aiClient.chats.invalidate()
     }
   }
-  botEntry.end()
+  botEntry.setValue({ ...botEntry.getValue(), done: true })
   chat.set('isLoading', false)
 }

package/src/components/form/DescribedCheckboxGroup.tsx

@@ -1,8 +1,10 @@
 import { Icon } from '@stack-spot/citric-icons'
 import { Accordion, Checkbox, CheckboxGroup, FieldGroup, Input, Row, Text, useCheckboxGroupControls } from '@stack-spot/citric-react'
+import { InfiniteScroll } from '@stack-spot/portal-components/InfiniteScroll'
 import { Dictionary, useTranslate } from '@stack-spot/portal-translate'
-import { difference, uniqBy } from 'lodash'
+import { difference, isEqual, uniqBy } from 'lodash'
 import { useCallback, useEffect, useState } from 'react'
+import styled from 'styled-components'
 import { Labeled } from '../../state/types'
 import { ButtonFavorite, Favorite } from '../ButtonFavorite'
 
@@ -20,8 +22,16 @@ interface Props<T> {
   emptyResults: React.ReactNode,
   emptyDataset: React.ReactNode,
   onChange?: (value: T[]) => void,
+  fetchNextPage?: () => void,
+  hasNextPage?: boolean,
 }
 
+const StyledDiv = styled.div`
+  &#ks-scrollable {
+    overflow: auto;
+  }
+`
+
 /**
  * Renders a checkbox group where each option has a label and a description.
  * The description in placed under the label and checkbox as an accordion.
@@ -29,11 +39,12 @@ interface Props<T> {
  * Also renders a search input and a select all checkbox.
  */
 export function DescribedCheckboxGroup<T>(
-  { initialValue, options: opt, data, globalSelection, onChange: change, emptyDataset, emptyResults }: Props<T>,
+  { initialValue, options: opt, data, globalSelection, onChange: change, emptyDataset, emptyResults,
+    fetchNextPage, hasNextPage,
+  }: Props<T>,
 ) {
   const t = useTranslate(dictionary)
   const [options, setOptions] = useState(opt)
-
   useEffect(() => {
     if (controls.value.length === 0 && (initialValue?.length ?? 0) > 0) controls.setValue(initialValue!)
   }, [initialValue])
@@ -58,7 +69,13 @@ export function DescribedCheckboxGroup<T>(
     onChange,
   })
 
-  return options.length ? <>
+  useEffect(() => {
+    if (!isEqual(opt, options)) {
+      setOptions(opt)
+    }
+  }, [opt])
+
+  return options?.length ? <>
     <FieldGroup fullWidth>
       <Icon icon="Search" />
       <Input type="search" value={controls.filter} onChange={controls.setFilter} />
@@ -68,37 +85,46 @@ export function DescribedCheckboxGroup<T>(
         <Checkbox value={controls.isAllSelected} onChange={v => v ? controls.selectAll() : controls.removeSelection()} />
         <Text>{controls.isAllSelected ? t.removeAll : t.selectAll}</Text>
       </Row>
-      <CheckboxGroup
-        options={controls.options}
-        value={controls.value}
-        onChange={controls.setValue}
-        renderKey={controls.renderKey}
-        className="option-list"
-        renderItem={(checkbox, o) => {
-          const { description, idOrSlug, name, listFavorites, onAddFavorite, onRemoveFavorite } = data(o)
-          return (
-            <Row className={controls.isUnfilteredButChecked(o) ? 'filtered-out' : ''}>
-              <Accordion header={btn => <>{checkbox}<Text>{name}</Text>{btn}</>} appearance="card" maxHeight={100}>
-                <Text appearance="microtext1" color="light.700">{description}</Text>
-              </Accordion>
-              {onAddFavorite && <ButtonFavorite favorite={{
-                idOrSlug: idOrSlug,
-                listFavorites,
-                onAddFavorite: async (...args) => {
-                  const res = await onAddFavorite(...args)
-                  setOptions([...options]) // forces options re-rendering
-                  return res
-                },
-                onRemoveFavorite: async (...args) => {
-                  const res = await onRemoveFavorite?.(...args)
-                  setOptions([...options]) // forces options re-rendering
-                  return res ?? false
-                },
-              }} />}
-            </Row>
-          )
-        }}
-      />
+      <StyledDiv id="ks-scrollable">
+        <InfiniteScroll
+          scrollableTarget="ks-scrollable"
+          dataLength={controls.options.length}
+          next={fetchNextPage as any ?? undefined}
+          hasMore={hasNextPage ?? false}
+        >
+          <CheckboxGroup
+            options={controls.options}
+            value={controls.value}
+            onChange={controls.setValue}
+            renderKey={controls.renderKey}
+            className="option-list"
+            renderItem={(checkbox, o) => {
+              const { description, idOrSlug, name, listFavorites, onAddFavorite, onRemoveFavorite } = data(o)
+              return (
+                <Row className={controls.isUnfilteredButChecked(o) ? 'filtered-out' : ''}>
+                  <Accordion header={btn => <>{checkbox}<Text>{name}</Text>{btn}</>} appearance="card" maxHeight={100}>
+                    <Text appearance="microtext1" color="light.700" style={{ wordBreak: 'break-all' }}>{description}</Text>
+                  </Accordion>
+                  {onAddFavorite && <ButtonFavorite favorite={{
+                    idOrSlug: idOrSlug,
+                    listFavorites,
+                    onAddFavorite: async (...args) => {
+                      const res = await onAddFavorite(...args)
+                      setOptions([...options]) // forces options re-rendering
+                      return res
+                    },
+                    onRemoveFavorite: async (...args) => {
+                      const res = await onRemoveFavorite?.(...args)
+                      setOptions([...options]) // forces options re-rendering
+                      return res ?? false
+                    },
+                  }} />}
+                </Row>
+              )
+            }}
+          />
+        </InfiniteScroll>
+      </StyledDiv>
     </> : emptyResults}
   </> : emptyDataset
 }

package/src/context/hooks.ts

@@ -1,3 +1,4 @@
+import { last } from 'lodash'
 import { useContext, useEffect, useState } from 'react'
 import { ChatEntry } from '../state/ChatEntry'
 import { ChatProperties, ChatState } from '../state/ChatState'
@@ -134,3 +135,26 @@ export function useChatEntry(entry: ChatEntry) {
   useEffect(() => entry.onChange(setContent), [])
   return content
 }
+
+/*
+ * An efficient hook that returns true when the current chat entry is the last entry and false when it's not.
+ *
+ * For efficiency purposes, this hook assumes that:
+ * - Any change to the list of messages makes it grow.
+ * - Once a message is no longer the last, it will never be the last entry again.
+ * 
+ * @param id: the id of the entry. 
+ **/
+export function useIsLastEntryInCurrentChat(id: number) {
+  const chat = useCurrentChat()
+  const [isLast, setLast] = useState(last(chat.getMessages())?.id === id)
+  useEffect(() => {
+    if (!isLast) return
+    const removeListener = chat.onChangeMessages(() => {
+      setLast(false)
+      removeListener()
+    })
+    return removeListener
+  }, [chat])
+  return isLast
+}

package/src/state/ChatEntry.ts

@@ -186,6 +186,14 @@ export interface TextChatEntry {
    * If this chat entry contains any uploaded file, these are the files being uploaded along the message.
    */
   upload?: UploadedFile[],
+  /**
+   * True if the entry is done streaming, false otherwise. Undefined may be used when streaming info is not available.
+   */
+  done?: boolean,
+  /**
+   * True if, at some point, this entry had a planning stage (related to tools).
+   */
+  hasPlanning?: boolean,
 }
 
 type ChatEntryListener = (value: TextChatEntry) => void
@@ -201,15 +209,13 @@ export class ChatEntry {
   readonly id: number
   private value: TextChatEntry
   private listeners: ChatEntryListener[] = []
-  private done: boolean
 
   /**
    * @param value the value of the entry.
    */
-  constructor(value: TextChatEntry, done = true) {
+  constructor(value: TextChatEntry) {
     this.id = nextId++
     this.value = value
-    this.done = done
   }
 
   /**
@@ -236,7 +242,7 @@ export class ChatEntry {
    * @returns a new ChatEntry.
    */
   static createStreamedBotEntry() {
-    return new ChatEntry({ agentType: 'bot', type: 'md', content: '' }, false)
+    return new ChatEntry({ agentType: 'bot', type: 'md', content: '', done: false })
   }
 
   setValue(value: TextChatEntry) {
@@ -259,18 +265,4 @@ export class ChatEntry {
       pull(this.listeners, listener)
     }
   }
-
-  /**
-   * Mark the streamed message as done.
-   */
-  end() {
-    this.done = true
-  }
-
-  /**
-   * @returns true if the message is done streaming. False otherwise.
-   */
-  isDone() {
-    return this.done
-  }
 }

package/src/state/ChatState.ts

@@ -229,4 +229,20 @@ export class ChatState extends ObservableState<ChatProperties> {
     this.abortions = []
     return newChat
   }
+
+  /**
+   * Returns a promise that resolves when the chat is no longer loading (isLoading state).
+   * 
+   * If this is called when the chat is not loading, a resolved promise is returned.
+   */
+  whenLoadingEnds(): Promise<void> {
+    return this.get('isLoading') ? new Promise((resolve) => {
+      const removeListener = this.onChange('isLoading', (value) => {
+        if (!value) {
+          resolve()
+          removeListener()
+        }
+      })
+    }) : Promise.resolve()
+  }
 }

package/src/utils/tools.ts

@@ -1,21 +1,32 @@
-import { BuiltinToolResponse } from '@stack-spot/portal-network/api/agent'
-import { keyBy } from 'lodash'
 
-export type ToolWithImage = BuiltinToolResponse & { id: string, image?: string }
+export type ToolWithImage = { id?: string, image?: string, name: string, description?: string }
 
+interface Toolkit {
+  id?: string | null,
+  tools?: { id?: string, name?: string, description?: string, function?: { name: string, description?: string } }[] | null,
+  image_url?: string | null,
+  avatar?: string | null,
+}
+
+function findToolById(id: string, toolkits: Toolkit[]) {
+  for (const tk of toolkits ?? []) {
+    for (const t of tk.tools ?? []) {
+      if (t.id === id) return { tool: t, toolkit: tk }
+    }
+  }
+}
 
-export function toolById(
-  id: string,
-  toolkits: { tools?: { id: string, name: string }[], image_url?: string | null, avatar?: string | null }[] | undefined,
-): ToolWithImage | undefined {
-  const tools = toolkits
-    ?.map((toolkit) =>
-      toolkit.tools?.map((tool) => ({
-        ...tool,
-        id: tool.id!,
-        image: toolkit.image_url || toolkit.avatar || undefined,
-      })),
-    )
-    .flat()
-  return keyBy(tools, 'id')[id]
+export function toolById(id: string, toolkits: Toolkit[] | undefined): ToolWithImage {
+  // mcp tools are identified by "{toolkitId}/{functionName}"
+  const mcp = id.match(/(\w+)\/(.+)/)
+  if (mcp) {
+    const [, toolkitId, toolName] = mcp
+    const toolkit = toolkits?.find(tk => tk.id === toolkitId)
+    const tool = toolkit?.tools?.find(t => t.name === toolName)
+    return { id, image: toolkit?.avatar ?? undefined, name: toolName, description: tool?.function?.description }
+  }
+  const { tool, toolkit } = findToolById(id, toolkits ?? []) ?? {}
+  return (tool && toolkit)
+    ? { id, image: toolkit.avatar ?? toolkit.image_url ?? undefined, name: tool.name || id, description: tool?.description }
+    : { id, name: id }
 }

package/src/views/Agents/AgentDescription.tsx

@@ -1,15 +1,13 @@
 import { Icon } from '@stack-spot/citric-icons'
-import { Badge, Card, IconBox, ImageBox, ImageWithFallback, Skeleton, Text } from '@stack-spot/citric-react'
+import { AsyncContent, Badge, Card, IconBox, ImageBox, ImageWithFallback, Text } from '@stack-spot/citric-react'
 import { agentToolsClient } from '@stack-spot/portal-network'
 import { useMemo } from 'react'
-import { toolById } from '../../utils/tools'
 import { useAgentsDictionary } from './dictionary'
 import { AgentDescriptionBox } from './styled'
 
 export const AgentDescription = ({ agentId }: { agentId?: string }) => {
   const t = useAgentsDictionary()
-  const [agent, , , { isLoading }] = agentToolsClient.agent.useStatefulQuery({ agentId: agentId! }, { enabled: !!agentId })
-  const [toolKits, , , { isLoading: isLoadingToolKit }] = agentToolsClient.tools.useStatefulQuery({})
+  const [agent,, error, { isLoading }] = agentToolsClient.agent.useStatefulQuery({ agentId: agentId! }, { enabled: !!agentId })
   const numberOfKnowledgeSources = agent?.knowledge_sources_config?.knowledge_sources.length ?? 0
   
   const knowledgeSources = useMemo(
@@ -23,13 +21,6 @@ export const AgentDescription = ({ agentId }: { agentId?: string }) => {
     )),
     [agent],
   )
-  const skeleton = useMemo(() => {
-    const loadingKS: React.ReactElement[] = []
-    for (let i = 0; i < numberOfKnowledgeSources; i++) {
-      loadingKS.push(<li key={i}><Badge colorPalette="teal" appearance="square"><Skeleton className="ks-skeleton" /></Badge></li>)
-    }
-    return loadingKS
-  }, [numberOfKnowledgeSources])
   
   const { tools, multiAgents } = useMemo(() => {
     const tools: React.ReactElement[] = [] 
@@ -39,12 +30,11 @@ export const AgentDescription = ({ agentId }: { agentId?: string }) => {
     for (const toolkit of builtInTools) {
       for (const tool of toolkit.tools ?? []) {
         if (toolkit.id == 'UTILITIES'){ 
-          const toolWithImage = toolById(tool.id, toolKits)
           tools.push(
             <li key={tool.id}>
               <Card gap="10px" direction="row" flex={1} size="xxs" bgLevel={500}>
-                <ImageBox><ImageWithFallback src={toolWithImage?.image} fallback={<Icon icon="Cog" />} /></ImageBox>
-                <Text color="light.contrastText">{toolWithImage?.name || toolWithImage?.id || 'unknown'}</Text>
+                <ImageBox><ImageWithFallback src={toolkit.image_url} fallback={<Icon icon="Cog" />} /></ImageBox>
+                <Text color="light.contrastText">{tool?.name || tool?.id || 'unknown'}</Text>
               </Card>
             </li>,
           )
@@ -76,28 +66,42 @@ export const AgentDescription = ({ agentId }: { agentId?: string }) => {
     return { tools, multiAgents }
   }, [agent])
 
+  const mcpToolkits = useMemo(() => agent?.toolkits?.mcp_toolkits?.map(t => (
+    <li key={`mcp-${t.id}`}>
+      <Card gap="10px" direction="row" flex={1} size="xxs" bgLevel={500}>
+        <ImageBox><ImageWithFallback src={t.avatar ?? undefined} fallback={<Icon icon="Cog" />} /></ImageBox>
+        <Text color="light.contrastText">{t.name}</Text>
+      </Card>
+    </li>
+  )), [agent?.toolkits?.mcp_toolkits])
+
   return (
-    <AgentDescriptionBox>
-      {agent?.description && <section>
-        <Text appearance="microtext1" className="title">{t.description}</Text>
-        <Text>{agent?.description}</Text>
-      </section>}
-      {(!!numberOfKnowledgeSources || !!knowledgeSources?.length) && <section>
-        <Text appearance="microtext1" className="title">Knowledge sources</Text>
-        <ul>{isLoading || isLoadingToolKit ? skeleton : knowledgeSources}</ul>
-      </section>}
-      {!!tools?.length && <section>
-        <Text appearance="microtext1" className="title">{t.tools}</Text>
-        <ul>{tools}</ul>
-      </section>}
-      {!!multiAgents?.length && <section>
-        <Text appearance="microtext1" className="title">{t.multiAgent}</Text>
-        <ul>{multiAgents}</ul>
-      </section>}
-      {agent?.model_name && <section>
-        <Text appearance="microtext1" className="title">LLM</Text>
-        <Badge colorPalette="orange" appearance="square">{agent?.model_name}</Badge>
-      </section>}
-    </AgentDescriptionBox>
+    <AsyncContent loading={isLoading} error={error}>
+      <AgentDescriptionBox>
+        {agent?.description && <section>
+          <Text appearance="microtext1" className="title">{t.description}</Text>
+          <Text>{agent?.description}</Text>
+        </section>}
+        {(!!numberOfKnowledgeSources || !!knowledgeSources?.length) && <section>
+          <Text appearance="microtext1" className="title">Knowledge sources</Text>
+          <ul>{knowledgeSources}</ul>
+        </section>}
+        {!!tools?.length && <section>
+          <Text appearance="microtext1" className="title">{t.tools}</Text>
+          <ul>
+            {tools}
+            {mcpToolkits}
+          </ul>
+        </section>}
+        {!!multiAgents?.length && <section>
+          <Text appearance="microtext1" className="title">{t.multiAgent}</Text>
+          <ul>{multiAgents}</ul>
+        </section>}
+        {agent?.model_name && <section>
+          <Text appearance="microtext1" className="title">LLM</Text>
+          <Badge colorPalette="orange" appearance="square">{agent?.model_name}</Badge>
+        </section>}
+      </AgentDescriptionBox>
+    </AsyncContent>
   )
 }

package/src/views/Agents/AgentsTab.tsx

@@ -1,5 +1,5 @@
 import { Icon } from '@stack-spot/citric-icons'
-import { Button } from '@stack-spot/citric-react'
+import { Button, ImageWithFallback } from '@stack-spot/citric-react'
 import { Placeholder } from '@stack-spot/portal-components/Placeholder'
 import { AgentResponseWithBuiltIn, agentToolsClient, AgentVisibilityLevel, workspaceAiClient } from '@stack-spot/portal-network'
 import { WorkspaceResponse } from '@stack-spot/portal-network/api/workspace-ai'
@@ -30,7 +30,7 @@ export const AgentsTab = ({ visibility, workspaceId, agent, showSubmitButton = t
   const [submitEnabled, setSubmitEnabled] = useState(false)
   const listFavorites = useFavorites()
   const agentDefault = agentToolsClient.agentDefault.useQuery()
-  
+
   const [filter, setFilter] = useState<string | undefined>()
   const [apiFilter, setApiFilter] = useState<string | undefined>()
   const [isPending, startTransition] = useTransition()
@@ -47,9 +47,9 @@ export const AgentsTab = ({ visibility, workspaceId, agent, showSubmitButton = t
   const data = workspaceAiClient.getAgentFromWorkspaceAi.useStatefulQuery({ workspaceId: workspaceId! },
     { enabled: !!workspaceId })
   const workspaceAgents = data?.[0] as AgentResponseWithBuiltIn[]
-  
-  const [agentsData=[], { fetchNextPage, hasNextPage }] = agentToolsClient.agentsMultipleFilters.useInfiniteQuery({
-    filters: { 
+
+  const [agentsData = [], { fetchNextPage, hasNextPage }] = agentToolsClient.agentsMultipleFilters.useInfiniteQuery({
+    filters: {
       page: 1,
       size: 20,
       name: apiFilter,
@@ -78,7 +78,7 @@ export const AgentsTab = ({ visibility, workspaceId, agent, showSubmitButton = t
   return <>
     <div className="content">
       <DescribedRadioGroup
-        fetchNextPage={fetchNextPage} 
+        fetchNextPage={fetchNextPage}
         hasNextPage={hasNextPage && !workspaceId}
         options={agents}
         initialValue={initialValue}
@@ -96,7 +96,8 @@ export const AgentsTab = ({ visibility, workspaceId, agent, showSubmitButton = t
         isLoading={isPending}
         data={ag => ({
           idOrSlug: ag.id,
-          image: ag.avatar ? <img src={ag.avatar} /> : <Icon icon="Agent" />,
+          // below, "key" is important. I don't know why exactly, but sometimes the avatar doesn't update if we don't do this.
+          image: <ImageWithFallback key={ag.id} src={ag.avatar ?? undefined} fallback={<Icon icon="Agent" />} />,
           description: <AgentDescription agentId={ag.id} />,
           name: ag.name,
           listFavorites,