Vectara Answer is an open source React project that enables you to quickly configure GenAI user interfaces, powered by the Vectara Platform's semantic search and summarization APIs.

For an example of what you'll be building, check out Ask News or LegalAid.

To get started, the minimum requirement is to install npm and node. That's it!

Vectara Answer comes packaged with preset configurations that allow you spin up a sample application using Vectara's public datastores. To quickly get started, run the following command:

npm run bootstrap

When prompted for which application to create, simply select from one of three default apps:

1. Vectara Docs - Answer questions about Vectara documentation
2. Vectara.com - Answer questions about the content of the Vectara company website
3. AskFeynman - Answer questions about Richard Feynman's lectures

After selecting which application to create, you'll have the app running in your browser at http://localhost:4444.

Congratulations! You've just setup and run a sample app powered by Vectara!

The bootstrap command installs dependencies, runs the configuration script to generate an .env file, and spins up the local application.

If you would like to run the setup steps individually, you can run:

• npm install: for installing dependencies
• npm run configure: for running the configuration script
• npm run start: for running the application locally

When building your own application, you will need to:

• Create a data store: Log into the Vectara Console and create a data store.
• Add data to the data store. You can use Vectara Ingest to crawl datasets and websites, upload files in the Vectara Console, or use our Indexing APIs directly.

When running npm run bootstrap, if you choose [Create Your Own] from the application selection prompt, you will be asked to provide:

• your Vectara customer ID
• the ID of the corpus you created
• the API key of your selected Vectara corpus (NOTE: Depending on your set up, this may be visible to users. To ensure safe sharing, ensure that this key is set up to only have query access.)
• any sample questions to display on the site, to get your users started.

Once provided, the values above will go into your own customized configuration (.env file), and your site will be ready to go via npm start.

After the configuration process has created your .env file (as part of the bootstrap process), you are free to make modifications to it to suit your development needs. Note that the variables in the .env file all have the REACT_APP prefix, as is needed to be recognized by Vectara Answer code.

# These config vars are required for connecting to your Vectara data and issuing requests.
corpus_id: 5
customer_id: 123456789
api_key: "zwt_abcdef..."

Note that corpud_id can be a set of corpora in which case each query runs against all those corpora. In such a case, the format is a comma-separated list of corpus IDs, for example:

corpus_id: "123,234,345"

These configuration parameters enable you to configure the look and feel of the search header, including the logo.

# Define the title to render next to the logo.
search_title: "Search your data"

# Define the description to render opposite the logo and title.
search_description: "Data that speaks for itself"

# Define the placeholder text inside the search box.
search_placeholder: "Ask me anything"

# Define the URL the browser will redirect to when the user clicks the logo above the search controls.
search_logo_link: "https://asknews.demo.vectara.com"

# Define the logo that appears in the search header. Any images you place in your `config_images` directory will be available.
search_logo_src: "config_images/logo.png"

# Describe the logo for improved accessibility.
search_logo_alt: "Vectara logo"

# Customize the height at which to render the logo. The width will scale proportionately.
search_logo_height: 20

The way summarization works can be configured as follows:

# Switches the mode of the ux to "summary" mode or "search" mode (if not specified defaults to "summary" mode). When set to "summary", a summary is shown along with references used in the summary. When set to "search", only search results are shown and no calls made to the summarization API.
ux: "summary"

# Default language for summary response (if not specified defaults to "auto")
summary_default_language: "eng"

# Number of sentences before and after relevant text segment used for summarization
summary_num_sentences: 3

# Number of results used for summarization
summary_num_results: 10

# The name of the summarization prompt in Vectara
# If you are a Vectara scale customer you can use custom prompts.
# This field names a custom prompt, otherwise it uses the default for the account.
# See https://docs.vectara.com/docs/learn/grounded-generation/select-a-summarizer for available summarization prompts
summary_prompt_name: vectara-summary-ext-v1.2.0

# Whether to enable the Hughes Hallucination Evaluation Model (HEM)
summary_enable_hem: False

Hybrid search is a capability that combines the strength of neural (semantic) search with traditional keywords search. By default, Vectara Answer utilizes hybrid search with lambda=0.1 for short queries (num_words<=2) and lambda=0.0 (pure neural search) otherwise, but you can define other values here.

# hybrid search
hybrid_search_num_words: 2
hybrid_search_lambda_long: 0.0
hybrid_search_lambda_short: 0.1

Vectara Answer can display an application header and footer. These configuration parameters allow you to configure the look and feel of thsee header and footer.

# Hide or show the app header.
enable_app_header: False

# Hide or show the app footer.
enable_app_footer: False

# Define the title of your app to render in the browser tab.
app_title: "Your title here"

# Define the URL the browser will redirect to when the user clicks the logo in the app header.
app_header_logo_link: "https://www.vectara.com"

# Define the logo that appears in the app header. Any images you place in your `config_images` directory will be available.
app_header_logo_src: "config_images/logo.png"

# Describe the logo for improved accessibility.
app_header_logo_alt: "Vectara logo"

# Customize the height at which to render the logo. The width will scale proportionately.
app_header_logo_height: 20

If your application uses more than one corpus, you can define source filters to enable the user to narrow their search to a specific corpus. This feature assumes the following:

• You have defined a source meta-data field on the Vectara corpus
• During data ingestion, you've added the source text to each document appropriately (in the source metadata field)

The following parameters control how the sources feature works:

# Hide or show source filters.
enable_source_filters: True

# whether the "all source" button should be enabled or not (default True)
all_sources: True

# A comma-separated list of the sources on which users can filter.
sources: "BBC,NPR,FOX,CNBC,CNN"

The sources parameters is a comma-separated list of source names that will be displayed underneath the search bar, and the user can select if results returned should be from "all source" or one of the selected sources. In this case you must specify corpus_id (see above) to be the list of matching corpus IDs, also comma separated.

For example:

enable_source_filters: True
all_sources: True
sources: "BBC,NPR,FOX,CNBC,CNN"
corpus_id: "123,124,125,126,127"

If all_sources is set to False, the application will only display the individual source but not the "All sources" button. This means the user will only be able to select a specific source for each query.

Whether to use Vectara's reranking functionality. Note that reranking currently works for English language only, so if the documents in your corpus are in other languages, it's recommended to set this to "False".

# Reranking enabled: True or False
rerank: False

# number of results to use for reranking
rerank_num_results: 50

Whether to use Vectara's MMR (maximum marginal relevance) functionality. Note that if mmr=true, it will disable rerank=true, as both cannot co-exist

# mmr enabled: True or False
mmr: True

# diversity bias factor (0..1) for MMR reranker. The higher the value, the more MMR is preferred over relevance.
mmr_diversity_bias: 0.3

# number of results to use for reranking
mmr_num_results: 50

vectara-answer supports Google SSO authentication.

# Configure your app to require the user to log in with Google SSO.
authenticate: True
google_client_id: "cb67dbce87wcc"

# Track user interaction with your app using Google Analytics.
google_analytics_tracking_code: "123456789"

# Track user interaction with your app using Google Tag Manager.
gtm_container_id: "GTM-1234567"

# Track user experience with Full Story
full_story_org_id: "org1123"

In addition to customization via configuration, you can customize Vectara Answer further by modifying it's code directly in your own fork of the repository.

The UI source code is all in the src/ directory. See the UI README.md to learn how to make changes to the UI source.

While the app run via npm run start works with a local client that accesses the Vectara API directly, running the app via Docker (see below) spins up a full-stack solution, using a proxy server to make Vectara API requests.

In order to modify the request handlers, make changes to /server/index.js.

By default Vectara Answer runs locally on your machine using npm run start. There is also an option to use Vectara Answer with Docker, which also makes it easy to deploy Vectara Answer to a cloud environment.

Please see these detailed instructions for more details on using Docker.

👤 Vectara

• Website: https://vectara.com
• Twitter: @vectara
• GitHub: @vectara
• LinkedIn: @vectara
• Discord: @vectara

Contributions, issues and feature requests are welcome!
Feel free to check issues page. You can also take a look at the contributing guide.

Give a ⭐️ if this project helped you!

Copyright © 2023 Vectara.
This project is Apache 2.0 licensed.