Skip to content

perf(chatbot): keep the props passed to the Ask Ariane chat panel stable across renders #18499

Description

Summary

AskArianePanel (opencti-platform/opencti-front/src/private/components/chatbox/AskArianePanel.tsx) renders the XTM One chat panel (ChatPanel from @filigran/chatbot) with several props rebuilt on every render: requestHeaders, pageContext, onRelativeLinkClick, onTaskComplete, apiEndpoints, user, promptSuggestions and logoIcon.

The chat panel memoizes its message rows (MessageRow) and its markdown renderer (MarkdownMessage) so that settled messages are not re-rendered while an answer streams. A prop with a new identity defeats that on every render of AskArianePanel, which happens on every route change (useLocation), on banner height and theme changes, and on every width step of a sidebar resize (the chatbot context carries sidebarWidth, so AskArianeButton re-renders the panel while the user drags).

Impact (read from the @filigran/chatbot 3.10.0 sources)

  • logoIcon (inline JSX), onRelativeLinkClick (a plain function) and apiEndpoints (an inline object, which the panel turns into the resolveAttachmentUrl / onDownloadFile callbacks) are compared by every MessageRow: each host render re-renders every message of the conversation and re-parses its markdown.
  • apiEndpoints is a dependency of the agent list effect (useAgents): each host render fetches <base>/chatbot/agents again.
  • While a draft is active, requestHeaders is a new { 'opencti-draft-id': ... } object on each render. It is a dependency of the agents, agent suggestions, prompts and quota effects, which fetch again, and of ChatImage, which downloads every host-relative image of the conversation again.

Task

Give each of these props a stable identity keyed on what it actually depends on, with no behaviour change:

  • useMemo for requestHeaders (on the draft id), pageContext (on location.pathname), user (on the first name), promptSuggestions (on t_i18n) and logoIcon;
  • useCallback for the relative link handler (on navigate) and for onTaskComplete;
  • a module-level constant for apiEndpoints, keeping its explanatory comments.

A change in @filigran/chatbot (FiligranHQ/filigran-ui) is also making the panel more tolerant of prop churn. The host-side change is still needed: the library cannot compare a JSX logoIcon, and stable props avoid the work altogether.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    ai-assistantLinked to the AI assistant capabilitiesfiligran teamItem from the Filigran team.frontendScope limited to frontend code

    Type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions