# useSearch

### Purpose

The useSearch hook exposes methods and data for updating and submitting search terms, internally it is used by the [Search component](/components/search.md).

### Usage

The `searchTerm` field is the current search term value.

The `setSearchTerm` method is used to change the current search term value.

The `submitSearchTerm` method is used to navigate to the search page, if there are redirects configured for the current search term they will be followed.

The `submitSearchQuery` method is used to query products directly using the [OpenSearch Query DSL](https://opensearch.org/docs/latest/query-dsl/), this method is detached from the rest of the search experience.

The `showInstantSearchResults` is used to determine if instant search results should be displayed, e.g. you should show or hide the instant search experience based on this value.

The `setShowInstantSearchResults` method is used to change the `showInstantSearchResults` field value.

The `searchRedirect` field will contain a Redirect if the current search term matches a redirect.

{% tabs %}
{% tab title="ExampleHookUseSearch" %}

<pre class="language-tsx"><code class="lang-tsx"><strong>import React from "react";
</strong>import { useSearch } from "@usereactify/search";

export const ExampleHookUseSearch: React.FC = () => {
  const searchHook = useSearch();

  const handleFormSubmit = React.useCallback((event: React.FormEvent&#x3C;HTMLFormElement>) => {
    searchHook.submitSearchTerm();
  }, [searchHook.submitSearchTerm]);

  const handleInputChange = React.useCallback((event: React.ChangeEvent&#x3C;HTMLInputElement>) => {
    searchHook.setSearchTerm(event.target.value);
  }, [searchHook.setSearchTerm]);

  return (
    &#x3C;form
      onSubmit={handleFormSubmit}
    >
      &#x3C;input
        type="text"
        value={searchHook.searchTerm}
        onChange={handleInputChange}
      />
    &#x3C;/form>
  );
};
</code></pre>

{% endtab %}

{% tab title="ExampleSubmitSearchQuery" %}
Visit the OpenSearch Query DSL documentation for more information

[https://opensearch.org/docs/2.6/query-dsl](https://opensearch.org/docs/2.6/query-dsl/)

```tsx
const searchHook = useSearch();

const results = await searchHook.submitSearchQuery({
  query: {
    term: {
      "collection_handles.keyword": "jumpers"
    },
  },
});
```

{% endtab %}
{% endtabs %}

### Signature

```typescript
(): {
  /** The current search term */
  searchTerm: string;
  /** Function for changing the current search term */
  setSearchTerm: (searchTerm?: string) => void;
  /** Function for navigating to the search page, includes logic for redirects */
  submitSearchTerm: (searchTerm?: string) => void;
  /** Function for retrieving search results for an opensearch query */
  submitSearchQuery: (searchBody: any, searchHeaders: Record<string, string>) => Promise<{
    results: Array<Product>;
    resultStats: {
      time: number;
      numberOfResults: number;
      displayedResults: number;
    };
  }>;
  /** Used to determine if instant search results should be displayed */
  showInstantSearchResults: boolean;
  /** Used to manually set the "showInstantSearchResults" value */
  setShowInstantSearchResults: React.Dispatch<React.SetStateAction<boolean>>;
  /** Contains any matching redirect for the current search term */
  searchRedirect: {
    id: string;
    url: string;
    query: string;
  } | undefined;
};
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://search.docs.reactify.com.au/hooks/usesearch.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
