---
title: Use the Relevance Generative Answering component
slug: latest-quantic-rga
canonical_url: https://docs.coveo.com/en/quantic/latest/usage/quantic-rga/
collection: quantic
source_format: adoc
---
# Use the Relevance Generative Answering component

The `[QuanticGeneratedAnswer](https://docs.coveo.com/en/quantic/latest/reference/search-components/search-generated-answer/)` component lets you use Coveo's [Relevance Generative Answering (RGA)](https://docs.coveo.com/en/n9de0370.md) feature to automatically generate answers to users' [queries](https://docs.coveo.com/en/231.md).

> **Important**
>
> You must [create your RGA model](https://docs.coveo.com/en/nb6a0085.md) and associate it with a [query pipeline](https://docs.coveo.com/en/180.md) before you can use the `[QuanticGeneratedAnswer](https://docs.coveo.com/en/quantic/latest/reference/search-components/search-generated-answer/)` component.
The generated answer panel includes the following features:

![Example generated answer panel | Coveo RGA](https://docs.coveo.com/en/assets/images/coveo-platform/rga-panel-example-quantic-3-29-3-plus.png)

| 1 | The title of the [RGA](https://docs.coveo.com/en/nbtb6010.md) panel. |
|---|---|
| 2 | Clicking **Dislike** brings up a modal which asks the user to specify why they didn't find the information helpful. |
| 3 | A **Copy to clipboard** button. |
| 4 | A toggle to hide or show the [RGA](https://docs.coveo.com/en/nbtb6010.md) panel. |
| 5 | A disclaimer that advises the user to verify important information in the generated answer. |
| 6 | Citations highlight the [items](https://docs.coveo.com/en/210.md) that contain the text segments ([chunks](https://docs.coveo.com/en/n9de0370.md#chunking)) that were used to generate the answer. Hover over a citation to view the chunk, or click a citation to open the item. An HTML item opens at the exact location of the chunk, which appears highlighted. |

## Implement the RGA component

In the search page HTML, add the `QuanticGeneratedAnswer` component.
You'll probably want to place it after any [tabs](https://docs.coveo.com/en/1406.md) and before the search summary and sort components, if present.
The following code includes some stylistic and formatting elements, but you can omit or change these to style the results differently.

```html
<template>
  <div class="search__grid">
    <c-quantic-search-interface engine-id={engineId} search-hub={searchHub}> <1>
      <div class="slds-grid slds-grid_vertical slds-grid_align-center">
        <div class="slds-col">
          <div class="slds-grid slds-gutters_direct slds-wrap main slds-grid_align-center">
            <div class="slds-col slds-order_2 slds-large-order_1 slds-size_1-of-1 slds-large-size_3-of-12">
              <c-quantic-facet-manager engine-id={engineId}>
                <c-quantic-facet field="objecttype" label="Type" engine-id={engineId}></c-quantic-facet>
                <c-quantic-facet display-values-as="link" field="filetype" label="File Type" engine-id={engineId}></c-quantic-facet>
              </c-quantic-facet-manager>
            </div>
            <div class="slds-col slds-order_1 slds-large-order_2 slds-size_1-of-1 slds-large-size_6-of-12">
              <c-quantic-generated-answer engine-id={engineId}></c-quantic-generated-answer> <2>
              <c-quantic-result-list engine-id={engineId}></c-quantic-result-list>
              <div class="slds-var-m-vertical_medium">
                <c-quantic-pager engine-id={engineId}></c-quantic-pager>
              </div>
            </div>
          </div>
        </div>
      </div>
    </c-quantic-search-interface>
  </div>
</template>
```

<1> For the Quantic [RGA](https://docs.coveo.com/en/nbtb6010.md) component to work, your search interface must use the pipeline with which the [RGA](https://docs.coveo.com/en/nbtb6010.md) [model](https://docs.coveo.com/en/1012.md) is [associated](https://docs.coveo.com/en/nb6a0104.md).

You can do one of the following:

* Set the [search hub](https://docs.coveo.com/en/1342.md) in the [`.js` file of your search page](https://docs.coveo.com/en/quantic/latest/usage#javascript) and reference it in the [`QuanticSearchInterface`](https://docs.coveo.com/en/quantic/latest/reference/search-components/search-search-interface/) component, as shown in the example.
Then you need to set up [condition-based routing](https://docs.coveo.com/en/1666.md#condition-based-routing-recommended).

> **Important**
>
> This is the recommended approach.

* Omit the `search-hub` property and use [search interface-enforced routing](https://docs.coveo.com/en/1666.md#search-interface-enforced-routing) by setting the `pipeline` property.

<2> You must pass the `engine-id` property.
You can also use `fieldsToIncludeInCitations` to specify which [fields](https://docs.coveo.com/en/200.md) to fetch with each citation that's returned.

This example produces the following search page:

![Example search page with generated answer | Coveo RGA](https://docs.coveo.com/en/assets/images/coveo-platform/rga-search-page-example-quantic-3-29-3-plus.png)

## Use an expandable search box

After you implement generative answering, your users may begin to use longer [queries](https://docs.coveo.com/en/231.md).
We recommend that you enable the `textarea` property on your [`QuanticSearchBox`](https://docs.coveo.com/en/quantic/latest/reference/search-components/search-search-box/) component so that it can expand to support multi-line [queries](https://docs.coveo.com/en/231.md).

![Expandable search box | Coveo RGA](https://docs.coveo.com/en/assets/images/coveo-platform/rga-expandable-search-box-quantic.png)