SearchStatus (Search Engine)
SearchStatus (Search Engine)
In this article
Example Implementation
search-status.fn.tsx
import {SearchStatus as HeadlessSearchStatus} from '@coveo/headless';
import {useEffect, useState, FunctionComponent} from 'react';
interface SearchStatusProps {
controller: HeadlessSearchStatus;
}
export const SearchStatus: FunctionComponent<SearchStatusProps> = (props) => {
const {controller} = props;
const [state, setState] = useState(controller.state);
useEffect(() => controller.subscribe(() => setState(controller.state)), []);
const {hasResults, firstSearchExecuted, isLoading} = state;
if (!hasResults && !firstSearchExecuted && isLoading) {
return <p>The first search ever is currently loading.</p>;
}
if (!hasResults && !firstSearchExecuted && !isLoading) {
return <p>No search was ever executed.</p>;
}
if (!hasResults && firstSearchExecuted && isLoading) {
<p>The previous search gave no results, but new ones are pending.</p>;
}
if (!hasResults && firstSearchExecuted && !isLoading) {
return <p>A search was executed but gave no results.</p>;
}
if (hasResults && isLoading) {
return <p>The previous search gave results, but new ones are loading.</p>;
}
if (hasResults && !isLoading) {
return <p>There are results and no pending search.</p>;
}
// Unreachable. The code is structured this way to demonstrate possible states.
return null;
};
// usage
/**
* ```tsx
* const controller = buildSearchStatus(engine);
*
* <SearchStatus controller={controller} />;
* ```
*/
Methods
subscribe
Adds a callback that’s invoked on state change.
Parameters
-
listener:
() => void
A callback that’s invoked on state change.
Returns Unsubscribe
: A function to remove the listener.
Attributes
state
The state of the SearchStatus
controller.
Properties
-
firstSearchExecuted:
boolean
Determines if a first search has been executed.
-
hasError:
boolean
true
if there is an error for the last executed query andfalse
otherwise. -
hasResults:
boolean
Determines if there are results available for the last executed query.
-
isLoading:
boolean
Determines if a search is in progress.
Initialize
buildSearchStatus
Creates a SearchStatus
controller instance.
Parameters
-
engine:
SearchEngine
The headless engine.
Returns SearchStatus
Related Types
Unsubscribe
Call signatures
-
(): void