QueryError

This is for:

Developer

The QueryError controller allows to retrieve information about the current error returned by the search API, if any.

Methods

subscribe

Adds a callback that will be called on state change.

Parameters

  • listener: () ⇒ void

    A callback to be invoked on state change.

Returns Unsubscribe: An unsubscribe function to remove the listener.

Attributes

state

The state of the QueryError controller.

Properties

  • error: ErrorPayload | null

    The current error for the last executed query, or null if none is present.

  • hasError: boolean

    true if there’s an error for the last executed query and false otherwise.

Initialize

buildQueryError

Creates a QueryError controller instance.

Parameters

  • engine: Engine<SearchSection>

    The headless engine.

Returns QueryError

Unsubscribe

Call signatures

  • (): void

Example Implementation

query-error.fn.tsx

import {useEffect, useState, FunctionComponent} from 'react';
import {
  buildQueryError,
  QueryError as HeadlessQueryError,
} from '@coveo/headless';
import {engine} from '../../engine';
 
interface QueryErrorProps {
  controller: HeadlessQueryError;
}
 
export const QueryError: FunctionComponent<QueryErrorProps> = (props) => {
  const {controller} = props;
  const [state, setState] = useState(controller.state);
 
  useEffect(() => controller.subscribe(() => setState(controller.state)), []);
 
  if (!state.hasError) {
    return null;
  }
 
  return (
    <div>
      <div>Oops {state.error!.message}</div>
      <code>{JSON.stringify(state.error)}</code>
    </div>
  );
};
 
// usage
 
const controller = buildQueryError(engine);
 
<QueryError controller={controller} />;