diff --git a/packages/headless/src/controllers/commerce/search-box/headless-search-box.test.ts b/packages/headless/src/controllers/commerce/search-box/headless-search-box.test.ts
index dd72cd61eed..19c7b46e1f9 100644
--- a/packages/headless/src/controllers/commerce/search-box/headless-search-box.test.ts
+++ b/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: 'hilighted',
diff --git a/packages/headless/src/controllers/commerce/search-box/headless-search-box.ts b/packages/headless/src/controllers/commerce/search-box/headless-search-box.ts
index 77b9356b362..55135f7c5b0 100644
--- a/packages/headless/src/controllers/commerce/search-box/headless-search-box.ts
+++ b/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,
diff --git a/packages/headless/src/controllers/commerce/standalone-search-box/headless-standalone-search-box.test.ts b/packages/headless/src/controllers/commerce/standalone-search-box/headless-standalone-search-box.test.ts
index 5f73b128e94..5eada64f503 100644
--- a/packages/headless/src/controllers/commerce/standalone-search-box/headless-standalone-search-box.test.ts
+++ b/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,
diff --git a/packages/headless/src/controllers/core/search-box/headless-core-search-box.test.ts b/packages/headless/src/controllers/core/search-box/headless-core-search-box.test.ts
index 906ef82777b..0e183173d09 100644
--- a/packages/headless/src/controllers/core/search-box/headless-core-search-box.test.ts
+++ b/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: 'hilighted',
diff --git a/packages/headless/src/controllers/core/search-box/headless-core-search-box.ts b/packages/headless/src/controllers/core/search-box/headless-core-search-box.ts
index fd4e7f07628..338d87330fc 100644
--- a/packages/headless/src/controllers/core/search-box/headless-core-search-box.ts
+++ b/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,
diff --git a/packages/headless/src/controllers/standalone-search-box/headless-standalone-search-box.test.ts b/packages/headless/src/controllers/standalone-search-box/headless-standalone-search-box.test.ts
index e436dace5d1..27678fa3f11 100644
--- a/packages/headless/src/controllers/standalone-search-box/headless-standalone-search-box.test.ts
+++ b/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,
diff --git a/packages/headless/src/features/query-suggest/query-suggest-actions-loader.ts b/packages/headless/src/features/query-suggest/query-suggest-actions-loader.ts
index 43f39d04c64..0f6e5f541cb 100644
--- a/packages/headless/src/features/query-suggest/query-suggest-actions-loader.ts
+++ b/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});
diff --git a/packages/headless/src/features/query-suggest/query-suggest-actions.ts b/packages/headless/src/features/query-suggest/query-suggest-actions.ts
index 52f61ce7b33..1a87365d49a 100644
--- a/packages/headless/src/features/query-suggest/query-suggest-actions.ts
+++ b/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;
}
diff --git a/packages/headless/src/insight.index.ts b/packages/headless/src/insight.index.ts
index 5df79931354..56534085fec 100644
--- a/packages/headless/src/insight.index.ts
+++ b/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 {
diff --git a/packages/quantic/force-app/main/default/lwc/quanticSearchBox/quanticSearchBox.js b/packages/quantic/force-app/main/default/lwc/quanticSearchBox/quanticSearchBox.js
index 5f4400d0ab6..6287c7970c8 100644
--- a/packages/quantic/force-app/main/default/lwc/quanticSearchBox/quanticSearchBox.js
+++ b/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);
}
diff --git a/packages/quantic/force-app/main/default/lwc/quanticStandaloneSearchBox/quanticStandaloneSearchBox.js b/packages/quantic/force-app/main/default/lwc/quanticStandaloneSearchBox/quanticStandaloneSearchBox.js
index e4d5880ed76..8d90e3748ba 100644
--- a/packages/quantic/force-app/main/default/lwc/quanticStandaloneSearchBox/quanticStandaloneSearchBox.js
+++ b/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: '',