Merge branch 'master' into CDX-1590-atomic

packages/headless/src/controllers/commerce/search-box/headless-search-box.test.ts

@@ -138,6 +138,7 @@ describe('headless search box', () => {
   describe('#state', () => {
     it('is as expected', () => {
       expect(searchBox.state).toEqual({
+        searchBoxId: id,
         value: state.querySet[id],
         suggestions: state.querySuggest[id]!.completions.map((completion) => ({
           highlightedValue: '<a>hi</a>light<i>ed</i>',

packages/headless/src/controllers/commerce/search-box/headless-search-box.ts

@@ -160,6 +160,7 @@ export function buildSearchBox(
         : false;
 
       return {
+        searchBoxId: id,
         value: getValue(),
         suggestions,
         isLoading: getState().commerceSearch.isLoading,

packages/headless/src/controllers/commerce/standalone-search-box/headless-standalone-search-box.test.ts

@@ -102,6 +102,7 @@ describe('headless standalone searchBox', () => {
 
   it('should return the right state', () => {
     expect(searchBox.state).toEqual({
+      searchBoxId: id,
       value: state.querySet[id],
       suggestions: state.querySuggest[id]!.completions.map((completion) => ({
         value: completion.expression,

packages/headless/src/controllers/core/search-box/headless-core-search-box.test.ts

@@ -143,6 +143,7 @@ describe('headless CoreSearchBox', () => {
 
   it('should return the right state', () => {
     expect(searchBox.state).toEqual({
+      searchBoxId: id,
       value: state.querySet[id],
       suggestions: state.querySuggest[id]!.completions.map((completion) => ({
         highlightedValue: '<a>hi<a>light<i>ed<i>',

packages/headless/src/controllers/core/search-box/headless-core-search-box.ts

@@ -137,6 +137,11 @@ export interface SearchBoxState {
    * Determines if a query suggest request is in progress.
    */
   isLoadingSuggestions: boolean;
+
+  /**
+   * The search box ID.
+   */
+  searchBoxId: string;
 }
 
 export interface Suggestion {
@@ -306,6 +311,7 @@ export function buildCoreSearchBox(
         : false;
 
       return {
+        searchBoxId: id,
         value: getValue(),
         suggestions,
         isLoading: state.search.isLoading,

packages/headless/src/controllers/standalone-search-box/headless-standalone-search-box.test.ts

@@ -110,6 +110,7 @@ describe('headless standalone searchBox', () => {
 
   it('should return the right state', () => {
     expect(searchBox.state).toEqual({
+      searchBoxId: id,
       value: state.querySet[id],
       suggestions: state.querySuggest[id]!.completions.map((completion) => ({
         value: completion.expression,

packages/headless/src/features/query-suggest/query-suggest-actions-loader.ts

@@ -1,6 +1,6 @@
 import {AsyncThunkAction, PayloadAction} from '@reduxjs/toolkit';
 import {AsyncThunkSearchOptions} from '../../api/search/search-api-client';
-import {SearchEngine} from '../../app/search-engine/search-engine';
+import {CoreEngine} from '../../app/engine';
 import {querySetReducer as querySet} from '../../features/query-set/query-set-slice';
 import {querySuggestReducer as querySuggest} from '../../features/query-suggest/query-suggest-slice';
 import {
@@ -79,7 +79,7 @@ export interface QuerySuggestActionCreators {
  * @returns An object holding the action creators.
  */
 export function loadQuerySuggestActions(
-  engine: SearchEngine
+  engine: CoreEngine
 ): QuerySuggestActionCreators {
   engine.addReducers({querySuggest, querySet});
 

packages/headless/src/features/query-suggest/query-suggest-actions.ts

@@ -43,7 +43,7 @@ export interface QuerySuggestionID {
 
 export interface RegisterQuerySuggestActionCreatorPayload {
   /**
-   * A unique identifier for the new query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`).
+   * A unique identifier for the new query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`). Usually, this will be the ID of the search box controller that requests the query suggestions.
    */
   id: string;
 
@@ -71,7 +71,7 @@ export const unregisterQuerySuggest = createAction(
 
 export interface SelectQuerySuggestionActionCreatorPayload {
   /**
-   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`).
+   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`). Usually, this will be the ID of the search box controller that requests the query suggestions.
    */
   id: string;
 
@@ -92,7 +92,7 @@ export const selectQuerySuggestion = createAction(
 
 export interface ClearQuerySuggestActionCreatorPayload {
   /**
-   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`).
+   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`). Usually, this will be the ID of the search box controller that requests the query suggestions.
    */
   id: string;
 }
@@ -105,7 +105,7 @@ export const clearQuerySuggest = createAction(
 
 export interface FetchQuerySuggestionsActionCreatorPayload {
   /**
-   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`).
+   * The unique identifier of the target query suggest entity (e.g., `b953ab2e-022b-4de4-903f-68b2c0682942`). Usually, this will be the ID of the search box controller that requests the query suggestions.
    */
   id: string;
 }

packages/headless/src/insight.index.ts

@@ -45,6 +45,7 @@ export * from './features/analytics/generic-analytics-actions-loader';
 export * from './features/question-answering/question-answering-actions-loader';
 export * from './features/folding/folding-actions-loader';
 export * from './features/insight-user-actions/insight-user-actions-loader';
+export * from './features/query-suggest/query-suggest-actions-loader';
 
 // Controllers
 export type {

packages/quantic/force-app/main/default/lwc/quanticSearchBox/quanticSearchBox.js

@@ -89,6 +89,7 @@ export default class QuanticSearchBox extends LightningElement {
    * @param {SearchEngine} engine
    */
   initialize = (engine) => {
+    this.engine = engine;
     this.headless = getHeadlessBundle(this.engineId);
     this.searchBox = this.headless.buildSearchBox(engine, {
       options: {
@@ -102,6 +103,10 @@ export default class QuanticSearchBox extends LightningElement {
       },
     });
 
+    this.actions = {
+      ...this.headless.loadQuerySuggestActions(engine),
+    };
+
     if (!this.disableRecentQueries && this.headless.buildRecentQueriesList) {
       this.localStorageKey = `${this.engineId}_quantic-recent-queries`;
       this.recentQueriesList = this.headless.buildRecentQueriesList(engine, {
@@ -202,7 +207,7 @@ export default class QuanticSearchBox extends LightningElement {
   };
 
   /**
-   * Handles the selection of a suggestion.
+   * Handles the selection of a suggestion or a recent query.
    */
   selectSuggestion = (event) => {
     event.stopPropagation();
@@ -214,6 +219,11 @@ export default class QuanticSearchBox extends LightningElement {
       this.recentQueriesList.executeRecentQuery(
         this.recentQueries.indexOf(value)
       );
+      this.engine.dispatch(
+        this.actions.clearQuerySuggest({
+          id: this.state.searchBoxId,
+        })
+      );
     } else {
       this.searchBox?.selectSuggestion(value);
     }

packages/quantic/force-app/main/default/lwc/quanticStandaloneSearchBox/quanticStandaloneSearchBox.js

@@ -98,6 +98,7 @@ export default class QuanticStandaloneSearchBox extends NavigationMixin(
       cause: '',
       metadata: null,
     },
+    searchBoxId: '',
     redirectTo: null,
     suggestions: [],
     value: '',