Canvas AI: An unexpected error has occurred while rendering preview

Overview

Getting the following error occasionally when generating a title, metadata, or adding components using the Page Builder agent from the chat interface.

This error usually occurs when new components are added or a full page is generated while the title and description are empty.

Currently the UI has 3 separate handlers for adding/updating canvas page fields.

createdContentHandle: To add title
editContentHandler: To edit the title
metadataHandler: To add/edit the description.

All these handlers use the updatePageDataExternally reducer and mark the page for a preview update (setUpdatePreview(true)). Additionally, when a component needs to be added to the page, the addNewComponentToLayout thunk is used, which also triggers a preview update.

As a result, when the title agent, metadata agent, and page builder/template builder agent are triggered for a task, all these handlers get invoked, which can sometimes trigger the above error.

Proposed resolution

This requires a two level fix.

The fix in current MR:

Currently when when the title agent, metadata agent, and page builder/template builder agent are triggered at the same time , the final response would look like this.

 [
      'created_content' => 'New Title',
      'operations' => '<components to add to the page>,
      'metadata' => [
        'metatag_description' => 'New Description',
      ],
   ];

So added a new helper function that maps canvas_page field values to the corresponding Drupal entity field paths (like title[0][value]), bundling them into a single canvas_page_data key to ensure the frontend can update all fields with a single Redux dispatch. So the output from the controller would look like this.

 [
      'operations' => '<components to add to the page>,
      'canvas_page_data' => [
        'title[0][value]' => 'New Title',
        'description[0][value]' => 'New Description',
      ],
    ];

Then created a single canvasPageDataHandler in AIWizard.tsx to update the page field values. This ensures that only one preview update is triggered for all Canvas page field changes.

The proposed fix:

As suggested here, We don't need 2 separate agents for title and description generation. It slows down the overall response and increases the cost to the end user as well as they get invoked automatically when values are empty. Also, there are 3 tools defined now for these agents. So instead we should:

• Create a single agent that can generate SEO friendly title and description
• Create a single too to add or update the title and description (Which can be later resued to update any fields (eg: metatags) in future.

Another advantage of this approach is that the orchestrator will have one less sub-agent to manage, which could improve the quality of its delegation.

But it would be a big change. There is already an issue created for this: #3534707: XB AI: Simplify metadata generation

User interface changes