---
title: Migrating components from Salesforce API 39 to API 40+
slug: '3222'
canonical_url: https://docs.coveo.com/en/3222/
collection: coveo-for-salesforce
source_format: adoc
---
# Migrating components from Salesforce API 39 to API 40+
As of the [release of Coveo for Salesforce v4](https://docs.coveo.com/en/3236#april-2020-release-v4-2-initial-release), the following components using Salesforce API 39 have been deleted in favour of newer, Lightning Locker compliant components.

[%header,cols="~,~"]
|===
| Salesforce API 39 (deleted)
| Salesforce API 40+

| [Coveo Search](https://docs.coveo.com/en/1027/)
| [Coveo Community Search](https://docs.coveo.com/en/2945/)

| [Coveo Searchbox](https://docs.coveo.com/en/1093/)
| [Coveo Community SearchBox](https://docs.coveo.com/en/2946/)

| [Coveo Case Creation](https://docs.coveo.com/en/1113/)
| [Coveo Case Deflection](https://docs.coveo.com/en/1312/)
|===

All three of the newer components uses the [SearchUI Lightning component](https://docs.coveo.com/en/1375/) to wrap the Coveo JavaScript Search Framework.

This nested component takes care of:

* Loading your search page content
* Initializing the Coveo JavaScript Search Framework
* Providing customization options

This article provides guidelines to help you update these components without losing their current usability and customization.

## Component specifics

### Coveo Community Search

```xml
<aura:component implements='forceCommunity:availableForAllPageTypes'>
  <aura:attribute name="name" type="String" default="customCommunitySearch" access="global" />
  <CoveoV2:CommunitySearch name="{!v.name}" />
</aura:component>
```

At first glance, the new `Community Search` component's behavior is very similar to the `Search` component you're already using.
However, under the hood, it uses the [SearchUI Lightning component](https://docs.coveo.com/en/1375/) to wrap the Coveo JavaScript Search Framework.
Several component attributes have been removed or replaced in favor of utilizing the hooks provided by `SearchUI` for [passing data to the Coveo JavaScript Search Framework](#passing-data-to-the-coveo-javascript-search-framework).

A few properties that were present on the designer view of the Coveo Search component have been removed.
The following sections show how to migrate them.

#### autoInitialize

The default value was `true`, but users would usually set it to `false` to execute some custom logic before performing the Coveo JavaScript Search Framework initialization.
The same result can now be achieved through the [`addPreInitPromise`](https://docs.coveo.com/en/1375#addpreinitpromise) hook.
This hook allows you to specify a JavaScript [Promise](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise) containing your custom logic.
Once this promise resolves, the Coveo JavaScript Search Framework will perform its initialization process.

#### autoInjectBasicQuery

The default value was `true`.
If you set this property to `false`, then you probably want to override the executed query in some cases.
To do so, you should register an event handler on the `buildingQuery` event.

. Register the event handler on `buildingQuery` using [`proxyAddEventListener`](https://docs.coveo.com/en/1375#proxyaddeventlistener).
. Implement your custom logic to override the query (see [`buildingQuery`](https://coveo.github.io/search-ui/classes/queryevents.html#buildingquery)).

#### autoInjectBasicOptions

The default value was `true`.
If you set this property to `false`, then you want to override the initialization options.
To do so, you should rely on the [`setSearchInterfaceOptions`](https://docs.coveo.com/en/1375#setsearchinterfaceoptions) method.

#### useAuraCache

This property isn't available since the release of Salesforce API 44 (see [Storable Actions](https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/controllers_server_storable_actions.htm)).

#### loggerLevel

This property was used to control the traces logged from the Coveo JavaScript Search Framework in the browser console.

[%header,cols="~,~"]
|===
| Level
| Value

| TRACE
| 1

| DEBUG
| 2

| INFO
| 3

| WARN
| 4

| ERROR
| 5

| NOTHING
| 6
|===


With the new component you can specify a fixed logger level using a custom script.

```javascript
window.coveoCustomScripts['default'] = function (promise) {
  const INFO = 3;
  Coveo.Logger.level = INFO;
}
```

#### searchContext

This property was used to send custom context information on the search queries.
You can achieve the same result by using the `buildingQuery` event.

. Add an event handler on `buildingQuery` as specified in [`proxyAddEventListener`](https://docs.coveo.com/en/1375#proxyaddeventlistener).
. In the event handler, send the custom context information.
In this example, we're sending a department name specified on the custom component.
The contextual information can come from anywhere as long as your custom Lightning component has access to it.

**Example**

[,javascript]
```
 coveoSearchUI.proxyAddEventListener('buildingQuery', function(e, args) {
   const department = component.get('v.department');
   args.queryBuilder.addContext({
     'department': department
   });
 });
```

. You can validate that the contextual information is passed in Coveo by inspecting the HTTP request performed by the search page.
 .. Open your web browser developer tools.
Select the **Network** tab.
 .. Navigate to your community page.
 .. Locate the POST request that targets `+https://platform.cloud.coveo.com/rest/search/v2+`.
 .. In the request body, you'll find the `context` property with the custom information.

### Coveo Community Searchbox

```xml
<aura:component implements='forceCommunity:searchInterface'>
  <CoveoV2:CommunitySearchBox/>
</aura:component>
```

The default component appears to look and behave like it's predecessor.
However, as mentioned above, it uses a [SearchUI Lightning component](https://docs.coveo.com/en/1375/) to wrap the Coveo JavaScript Search Framework.
Furthermore, several component attributes have been removed or replaced in favor of the hooks provided by the `SearchUI` for [passing data to the Coveo JavaScript Search Framework](#passing-data-to-the-coveo-javascript-search-framework).

### Coveo Case Deflection

Following Salesforce's Spring 18 release, the Lightning Create Case Form component was split into a `Contact Support Form` component and a `Case Deflection` component.

Click [here](https://help.salesforce.com/articleView?id=rss_migrate_to_support_components.htm&type=5#rss_migrate_to_support_components) for more details.

Coveo's API 40+ equivalent to the [Coveo CaseCreation Lightning component](https://docs.coveo.com/en/1113/) is a new [Coveo Case Deflection](https://docs.coveo.com/en/1312/) component that replaces the aforementioned `Case Deflection` to work in conjunction with the `Contact Support Form`.

```xml
<aura:component implements='forceCommunity:availableForAllPageTypes'>
  <CoveoV2:CaseDeflection/>
</aura:component>
```

The following property doesn't exist in the `Case Deflection`.
The following section explains how to migrate it.

#### autoInjectBasicQuery

The default value was `true`.
If you set this property to `false`, then you probably want to override the executed query in some cases.
To do so, you should register an event handler on the `buildingQuery` event.

. Register the event handler on `buildingQuery` using [`proxyAddEventListener`](https://docs.coveo.com/en/1375#proxyaddeventlistener).
. Implement your custom logic to override the query (see [`buildingQuery`](https://coveo.github.io/search-ui/classes/queryevents.html#buildingquery)).

## Passing data to the Coveo JavaScript Search Framework

The updated components expose a certain number of options you can set via their attributes.
For options that have to do with the Coveo JavaScript Search Framework, you can access the component's `v.searchUI` attribute.
The many hooks it provides allow you to run custom code at specific points in the initialization lifecycle as well as pass context and other options to the underlying [Coveo JavaScript Search Framework](https://docs.coveo.com/en/375/).

> **Note**
>
> See the [SearchUI Lightning component](https://docs.coveo.com/en/1375/) and [Send custom context information](https://docs.coveo.com/en/399/) pages for more details and examples.

## Custom scripts

If your customizations are for DOM manipulations, you can include custom scripts via static resource files in Salesforce as with the API 39 versions of the components.

See [Add JavaScript to the Coveo Lightning Aura components with custom code](https://docs.coveo.com/en/1251/) for more details on how to do so.

## Custom styling

As with the API 39 versions of the components, custom styling should be done directly in the wrapper component's style sheet.