Integrate useful Coveo for Salesforce features

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:

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.

Prerequisites

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.

Prerequisites

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.

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.

User Actions

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

Prerequisite

Create a custom Insight Panel with Coveo for Salesforce v4 or later.

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}> 1
      <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}> 2
          <div class="slds-var-p-left_x-small">
            <c-quantic-user-actions-toggle 3
              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>
1 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.
2 The userActionsReady flag ensures that the component only renders when the necessary data is available.
3 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 = [ 1
  'ticket_field_update',
  'ticket_next_stage',
  'ticket_classification_click',
  'generatedAnswerStreamEnd',
];
ticketCreationDateTime;
ticketCreationUserId;
userActionsReady = false; 2

//...

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

// ...
1 Excludes custom actions from tracking. Adjust as needed for your organization’s requirements.
2 Renders the component when the userActionsReady value changes to true after the required data is loaded.
3 Extracts the time the case was created from the Case.CreatedDate field of the case record.
4 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.

Generated answers

The QuanticGeneratedAnswer component displays AI-generated answers in your custom Insight Panel, using Coveo Relevance Generative Answering (RGA). It generates answers automatically when a non-empty query is submitted. You can additionally create a button that lets service agents trigger answer generation without typing a query.

Prerequisites

Add the Generated Answer component

Add the QuanticGeneratedAnswer component to your custom Insight Panel.

For a complete implementation example, see exampleInsightPanel in the Quantic project repository.

Add an on-demand Generate Answer button

To let service agents trigger answer generation without entering a search query, you can create a custom button that calls the generateAnswer action. This is useful when the Insight Panel displays contextual results based on the current case, and agents want to generate an AI answer from those results.

For an implementation of this button, see the generateAnswerButton LWC in the Quantic project repository.