Integrate useful Coveo for Salesforce features

This is for:

In this article

Prerequisites
Enable advanced search with the hosted search page
Attached results component
User Actions

Coveo offers a Hosted Insight Panel solution that provides a seamless, low-code way to display contextual recommendations and search results related to Salesforce records, helping service agents quickly access relevant content. For many customers, this out-of-the-box solution is sufficient.

However, some organizations need greater flexibility—such as full control over rendering logic, advanced UI customization, or deeper integration with Salesforce records—than what the Hosted Insight Panel offers. In these cases, creating a custom Insight Panel with Quantic components is the recommended approach.

This article builds on the foundation of a custom Insight Panel and explains how to extend it with advanced features, including:

Integrating a hosted search page for a full-screen search experience.
Displaying and managing attached results on record pages, so service agents can easily access relevant Knowledge articles, similar cases, or internal resources.

Prerequisites

Before you begin:

Create a custom Insight Panel.

Note

While the steps in the custom Insight Panel guide recommend installing and configuring Coveo for Salesforce v4 or later, it’s a required step for the features in this article.

For the advanced features covered in this article, ensure you also meet the following prerequisites:

Experience crafting an Attach to case result action in the Insight Panel, see Attach to case result action.
Experience creating custom result actions in the Insight Panel, see Create custom Insight Panel result actions.
Access to the Lightning App Builder in Salesforce.
Access to the Lightning Console app.
Familiarity with Salesforce Lightning navigation and record pages.

Enable advanced search with the hosted search page

The Coveo hosted search page provides a full-screen search interface directly from Salesforce, enabling service agents to perform detailed searches, filter results, and explore content in depth. While the Insight Panel provides quick, contextual results in a compact format, some scenarios require more space and functionality. Using the hosted search page is especially useful when service agents need more space to browse results, refine queries, or perform advanced searches that go beyond the compact view of the Insight Panel.

See Integrate a Coveo hosted search page in a Lightning Console app to configure the hosted search page to open in a new Lightning Console tab.

Add a button to open the hosted search page

You can add a button that lets service agents open the Coveo hosted search page in a new console tab. This allows service agents to quickly switch from the compact Insight Panel view to a full-screen search experience without losing context.

See lightning-navigation for details on how to work directly with the lightning navigation to achieve this.

Add this functionality to effectively replicate the insightFullSearch feature that’s available out of the box in the Hosted Insight Panel. For more details on the built-in feature, see Insight Full Search in the Hosted Insight Panel.

Attached results component

The Coveo Attached Results component is a powerful feature that enhances the user experience in Salesforce by providing contextual recommendations based on the current record. Results attached in the Insight Panel appear in the AttachedResults Lightning component on the record page, allowing service agents to quickly access relevant Knowledge articles, similar cases, or internal resources.

Implement the Attach to case result action

To enable service agents to attach search results to Salesforce cases, add the Attach to case result action to your custom Insight Panel.

See Create a ResultAttachToCase LWC to implement this feature.

Add the Coveo Attached Results component to the record page

Add the CoveoV2_AttachedResults component to the Case record page using the Lightning App Builder. This component automatically lists all results attached from the Insight Panel, making it easy for service agents to access relevant documents directly from the record.

See Add the Attached Results Lightning component to a record page for step-by-step instructions.

Once you complete these steps, any result attached from the Insight Panel will appear in the AttachedResults component automatically.

Note

After attaching a result, refresh the page to see the attached result in the component.

The QuanticUserActionsToggle component allows service agents to view recent user actions related to a case, providing value context for support interactions. This section describes how to integrate User Actions into your custom Insight Panel.

HTML

Add the QuanticUserActionsToggle component to the HTML file of your custom Insight Panel.

The following sample is abbreviated for clarity. See exampleInsightPanel.html in the Quantic project repository for the full example.

<template>
  <div onquantic__registerresulttemplates={handleResultTemplateRegistration}>
    <c-quantic-insight-interface engine-id={engineId} insight-id={insightId} record-id={caseId}> 
      <c-quantic-aria-live></c-quantic-aria-live>
      <div
        class="insight-panel_layout slds-is-relative slds-grid_align-center slds-box"
      >
        <div
          class="insight-panel_header slds-var-p-horizontal_medium slds-var-p-bottom_x-small slds-var-p-top_medium slds-theme_shade"
        >
        <!-- ... -->
        <template if:true={userActionsReady}> 
          <div class="slds-var-p-left_x-small">
            <c-quantic-user-actions-toggle 
              engine-id={engineId}
              user-id={ticketCreationUserId}
              ticket-creation-date-time={ticketCreationDateTime}
              excluded-custom-actions={defaultExcludedCustomActions}
            ></c-quantic-user-actions-toggle>
          </div>
        </template>
        <!-- ... -->
      </div>
      <!-- ... -->
    </c-quantic-insight-interface>
  </div>
</template>

	The `record-id` attribute is set to be the case ID and is used to retrieve the user ID of its creator. This is required for enabling the User Actions feature.
	The `userActionsReady` flag ensures that the component only renders when the necessary data is available.
	The `QuanticUserActionsToggle` component is used to display a button that opens a modal window containing the User Actions timeline component.

JavaScript

Update the JavaScript file for your custom Insight Panel to define the variables referenced in the preceding HTML snippet, and retrieve their values from the case record.

The following sample is abbreviated for clarity. See exampleInsightPanel.js in the Quantic project repository for the full example.

// ...

defaultExcludedCustomActions = [ 
  'ticket_field_update',
  'ticket_next_stage',
  'ticket_classification_click',
  'generatedAnswerStreamEnd',
];
ticketCreationDateTime;
ticketCreationUserId;
userActionsReady = false; 

//...

/**
* Executes the first search.
* @returns {void}
*/
executeFirstSearch = () => {
  this.ticketCreationDateTime = this.getFieldValueFromRecord( 
    this.caseRecord,
    'Case.CreatedDate'
  );
  this.ticketCreationUserId = this.getFieldValueFromRecord( 
    this.caseRecord,
    'Case.CreatedBy.Email'
  );
  this.userActionsReady = true;
  // ...
};

// ...

	Excludes custom actions from tracking. Adjust as needed for your organization’s requirements.
	Renders the component when the `userActionsReady` value changes to `true` after the required data is loaded.
	Extracts the time the case was created from the `Case.CreatedDate` field of the case record.
	Extracts the email of the user who created the case from the `Case.CreatedBy.Email` field.

With this setup, the User Actions feature can now be leveraged in your custom Insight Panel.