> ## Documentation Index
> Fetch the complete documentation index at: https://algolia.com/llms.txt
> Use this file to discover all available pages before exploring further.

# useRelevantSort

> React Hook for switching between search modes, exhaustive or relevant sorting.

<Note>
  This is the **React InstantSearch v7** documentation.
  If you're upgrading from v6, see the [upgrade guide](/doc/guides/building-search-ui/upgrade-guides/react/#migrate-from-react-instantsearch-v6-to-react-instantsearch-v7).
  If you were using React InstantSearch Hooks,
  this v7 documentation applies—just check for [necessary changes](/doc/guides/building-search-ui/upgrade-guides/react/#migrate-from-react-instantsearch-hooks-to-react-instantsearch-v7).
  To continue using v6, you can find the [archived documentation](https://algolia.com/old-docs/deprecated/instantsearch/react/v6/api-reference/instantsearch/).
</Note>

## About this Hook

**The `useRelevantSort` Hook isn't part of React InstantSearch**,
but you can make a custom version with [`useConnector`](/doc/api-reference/widgets/connector/react)
and [`connectRelevantSort`](/doc/api-reference/widgets/relevant-sort/js#customize-the-ui-with-connectrelevantsort).

This Hook allows switching between [relevant and exhaustive sorting](/doc/guides/managing-results/refine-results/sorting/in-depth/relevant-sort)
when searching in virtual replica indices.

## Examples

<CodeGroup>
  ```jsx JavaScript theme={"system"}
  import { useConnector } from "react-instantsearch";
  import connectRelevantSort from "instantsearch.js/es/connectors/relevant-sort/connectRelevantSort";

  export function useRelevantSort(props) {
    return useConnector(connectRelevantSort, props);
  }

  export function RelevantSort(props) {
    const { isRelevantSorted, refine } = useRelevantSort(props);
    const relevancyStrictness = isRelevantSorted ? 0 : undefined;

    return (
      <button type="button" onClick={() => refine(relevancyStrictness)}>
        {isRelevantSorted ? "See all results" : "See relevant results"}
      </button>
    );
  }
  ```

  ```tsx TypeScript theme={"system"}
  import { useConnector } from "react-instantsearch";
  import connectRelevantSort from "instantsearch.js/es/connectors/relevant-sort/connectRelevantSort";

  import type {
    RelevantSortConnectorParams,
    RelevantSortWidgetDescription,
  } from "instantsearch.js/es/connectors/relevant-sort/connectRelevantSort";

  export type UseRelevantSortProps = RelevantSortConnectorParams;

  export function useRelevantSort(props?: UseRelevantSortProps) {
    return useConnector<
      RelevantSortConnectorParams,
      RelevantSortWidgetDescription
    >(connectRelevantSort, props);
  }

  export function RelevantSort(props: UseRelevantSortProps) {
    const { isRelevantSorted, refine } = useRelevantSort(props);
    const relevancyStrictness = isRelevantSorted ? 0 : undefined;

    return (
      <button type="button" onClick={() => refine(relevancyStrictness)}>
        {isRelevantSorted ? "See all results" : "See relevant results"}
      </button>
    );
  }
  ```
</CodeGroup>