added reranker id in the config of chat bot

.gitignore

@@ -4,4 +4,5 @@
 /docs/public/script.js
 /docs/public/script.js.map
 /coverage
-.DS_Store
+.DS_Store
+.idea/

docs/src/components/ConfigurationDrawer.tsx

@@ -11,12 +11,12 @@ import {
   VuiTextArea,
   VuiRadioButton,
   VuiLabel,
-  VuiSelect
+  VuiSelect, VuiNumberInput
 } from "../ui";
 
 import { SummaryLanguage } from "@vectara/react-chatbot";
 
-import { SUMMARY_LANGUAGES } from "../../../src/types";
+import { SUMMARY_LANGUAGES, RerankerId } from "../../../src/types";
 
 type Props = {
   isOpen: boolean;
@@ -45,6 +45,10 @@ type Props = {
   onUpdateEnableFactualConsistencyScore: (enableFactualConsistencyScore: boolean) => void;
   summaryPromptName: string;
   onUpdateSummaryPromptName: (summaryPromptName: string) => void;
+  rerankerId: RerankerId;
+  onUpdateRerankerId: (rerankerId: RerankerId) => void;
+  lambda: number;
+  onUpdateLambda: (lamda: number) => void;
 };
 
 export const ConfigurationDrawer = ({
@@ -73,7 +77,11 @@ export const ConfigurationDrawer = ({
   enableFactualConsistencyScore,
   onUpdateEnableFactualConsistencyScore,
   summaryPromptName,
-  onUpdateSummaryPromptName
+  onUpdateSummaryPromptName,
+  rerankerId,
+  onUpdateRerankerId,
+  lambda,
+  onUpdateLambda
 }: Props) => {
   return (
     <VuiDrawer
@@ -217,6 +225,18 @@ export const ConfigurationDrawer = ({
         <VuiTextInput value={summaryPromptName} onChange={(e) => onUpdateSummaryPromptName(e.target.value)} fullWidth />
       </VuiFormGroup>
 
+      <VuiSpacer size="m" />
+
+      <VuiFormGroup label="Reranker ID" labelFor="rerankerId">
+        <VuiNumberInput value={rerankerId} onChange={(rerankerId) => onUpdateRerankerId(rerankerId as RerankerId)} />
+      </VuiFormGroup>
+
+      <VuiSpacer size="m" />
+
+      <VuiFormGroup label="Lambda" labelFor="lambda">
+        <VuiNumberInput value={lambda} onChange={(lambda) => onUpdateLambda(lambda as number)} max={1} min={0} step={0.001} />
+      </VuiFormGroup>
+
       <VuiSpacer size="l" />
 
       <VuiButtonPrimary color="primary" onClick={onClose}>

docs/src/index.tsx

@@ -2,7 +2,7 @@ import { ChangeEvent, useCallback, useState } from "react";
 import ReactDOM from "react-dom";
 import { BiLogoGithub } from "react-icons/bi";
 import JsxParser from "react-jsx-parser";
-import { ReactChatbot, SummaryLanguage, DEFAULT_SUMMARIZER } from "@vectara/react-chatbot";
+import { ReactChatbot, SummaryLanguage, DEFAULT_SUMMARIZER, DEFAULT_RERANKER_ID, DEFAULT_LAMBDA_VALUE } from "@vectara/react-chatbot";
 import {
   VuiAppContent,
   VuiAppHeader,
@@ -22,6 +22,7 @@ import { HeaderLogo } from "./components/HeaderLogo";
 import { ConfigurationDrawer } from "components/ConfigurationDrawer";
 import "./ui/_index.scss";
 import "./index.scss";
+import {RerankerId} from "../../src/types";
 
 const formatStringProp = (value?: string) => {
   if (!value) {
@@ -41,7 +42,9 @@ const generateCodeSnippet = (
   emptyStateDisplay?: string,
   isStreamingEnabled?: boolean,
   language?: SummaryLanguage,
-  exampleQuestions?: string
+  exampleQuestions?: string,
+  rerankerId?: RerankerId,
+  lambda?: number
 ) => {
   const props = [
     `customerId="${customerId === "" ? "<Your Vectara customer ID>" : customerId}"`,
@@ -79,6 +82,8 @@ const generateCodeSnippet = (
   props.push(`enableStreaming={${isStreamingEnabled}}`);
 
   props.push(`language="${language}"`);
+  props.push(`rerankerId=${rerankerId}`);
+  props.push(`lambda=${lambda}`);
 
   props.push(`isInitiallyOpen={ /* (optional) true, if the component should be initially opened */ }`);
   props.push(`zIndex={ /* (optional) number representing the z-index the component should have */ }`);
@@ -115,6 +120,8 @@ const App = () => {
   const [exampleQuestions, setExampleQuestions] = useState<string>("What is Vectara?, How does RAG work?");
   const [enableFactualConsistencyScore, setEnableFactualConsistencyScore] = useState<boolean>(false);
   const [summaryPromptName, setSummaryPromptName] = useState<string>(DEFAULT_SUMMARIZER);
+  const [rerankerId, setRerankerId] = useState<RerankerId>(DEFAULT_RERANKER_ID);
+  const [lambda, setLambda] = useState<number>(DEFAULT_LAMBDA_VALUE);
 
   const onUpdateCorpusIds = useCallback((e: ChangeEvent<HTMLInputElement>) => {
     const sanitizedValue = e.target.value.trim();
@@ -224,6 +231,8 @@ const App = () => {
               language={language}
               enableFactualConsistencyScore={enableFactualConsistencyScore}
               summaryPromptName={summaryPromptName}
+              rerankerId={rerankerId}
+              lambda={lambda}
             />
 
             <VuiSpacer size="m" />
@@ -264,7 +273,9 @@ const App = () => {
                 emptyStateJsx,
                 isStreamingEnabled,
                 language,
-                exampleQuestions
+                exampleQuestions,
+                rerankerId,
+                lambda
               )}
             </VuiCode>
 
@@ -363,6 +374,10 @@ export const App = () => {
               onUpdateEnableFactualConsistencyScore={setEnableFactualConsistencyScore}
               summaryPromptName={summaryPromptName}
               onUpdateSummaryPromptName={setSummaryPromptName}
+              rerankerId={rerankerId}
+              onUpdateRerankerId={setRerankerId}
+              lambda={lambda}
+              onUpdateLambda={setLambda}
             />
           </div>
         </VuiAppContent>

src/components/ChatView.tsx

@@ -7,7 +7,7 @@ import { Loader } from "./Loader";
 import { MinimizeIcon } from "./Icons";
 import { FactualConsistencyBadge } from "./FactualConsistencyBadge";
 import { ExampleQuestions } from "./exampleQuestions/ExampleQuestions";
-import { SummaryLanguage } from "types";
+import {RerankerId, SummaryLanguage} from "types";
 
 const inputSizeToQueryInputSize = {
   large: "l",
@@ -56,6 +56,11 @@ export interface Props {
 
   // Defines the name of the summary prompt. Defaults to "vectara-summary-ext-v1.2.0".
   summaryPromptName?: string;
+
+  // Define the reranker Id to be used , Defaults to "272725718"
+  rerankerId?: RerankerId;
+
+  lambda?: number
 }
 
 /**
@@ -77,7 +82,9 @@ export const ChatView = ({
   enableStreaming = true,
   language = "eng",
   enableFactualConsistencyScore,
-  summaryPromptName
+  summaryPromptName,
+  rerankerId,
+  lambda
 }: Props) => {
   const [isOpen, setIsOpen] = useState<boolean>(isInitiallyOpen ?? false);
   const [query, setQuery] = useState<string>("");
@@ -89,7 +96,9 @@ export const ChatView = ({
       enableStreaming,
       language,
       enableFactualConsistencyScore,
-      summaryPromptName
+      summaryPromptName,
+      rerankerId,
+      lambda
     });
 
   const appLayoutRef = useRef<HTMLDivElement>(null);

src/index.tsx

@@ -1,9 +1,9 @@
 import { ReactNode, useEffect, useRef } from "react";
 import * as ReactDOM from "react-dom";
 import { Props, ChatView } from "./components/ChatView";
-import type { SummaryLanguage } from "./types";
+import type {RerankerId, SummaryLanguage} from "./types";
 export type { Props } from "components/ChatView";
-export { DEFAULT_SUMMARIZER } from "./useChat";
+export { DEFAULT_SUMMARIZER, DEFAULT_RERANKER_ID, DEFAULT_LAMBDA_VALUE } from "./useChat";
 
 // @ts-ignore
 import cssText from "index.scss";
@@ -31,7 +31,9 @@ class ReactChatbotWebComponent extends HTMLElement {
       "enablestreaming",
       "language",
       "enablefactualconsistencyscore",
-      "summarypromptname"
+      "summarypromptname",
+      "rerankerId",
+      "lambda"
     ];
   }
 
@@ -81,6 +83,8 @@ class ReactChatbotWebComponent extends HTMLElement {
     const language = (this.getAttribute("language") as SummaryLanguage) ?? undefined;
     const enableFactualConsistencyScore = this.getAttribute("enableFactualConsistencyScore") === "true";
     const summaryPromptName = this.getAttribute("summaryPromptName") ?? undefined;
+    const rerankerId = this.getAttribute("rerankerId") !== null ? parseInt(this.getAttribute("rerankerId")!, 10) : undefined;
+    const lambda = this.getAttribute("lambda") !== null ? parseFloat(this.getAttribute("lambda")!) : undefined;
 
     ReactDOM.render(
       <div>
@@ -99,6 +103,8 @@ class ReactChatbotWebComponent extends HTMLElement {
           language={language}
           enableFactualConsistencyScore={enableFactualConsistencyScore}
           summaryPromptName={summaryPromptName}
+          rerankerId={rerankerId as RerankerId}
+          lambda={lambda}
         />
       </div>,
       this.mountPoint

src/types.ts

@@ -95,3 +95,5 @@ export type ChatTurn = {
   results: DeserializedSearchResult[];
   factualConsistencyScore?: number;
 };
+
+export type RerankerId = 272725717 | 272725719 | 272725718

src/useChat.ts

@@ -16,6 +16,9 @@ import { deserializeSearchResponse } from "utils/deserializeSearchResponse";
  */
 
 export const DEFAULT_SUMMARIZER = "vectara-summary-ext-v1.2.0";
+export const DEFAULT_RERANKER_ID = 272725718
+
+export const DEFAULT_LAMBDA_VALUE = 0.025
 
 type UseChatConfig = {
   customerId: string;
@@ -25,6 +28,8 @@ type UseChatConfig = {
   language?: SummaryLanguage;
   enableFactualConsistencyScore?: boolean;
   summaryPromptName?: string;
+  rerankerId?: number;
+  lambda?: number
 };
 
 export const useChat = ({
@@ -34,7 +39,9 @@ export const useChat = ({
   enableStreaming = true,
   language = "eng",
   enableFactualConsistencyScore,
-  summaryPromptName = DEFAULT_SUMMARIZER
+  summaryPromptName = DEFAULT_SUMMARIZER,
+  rerankerId = DEFAULT_RERANKER_ID,
+  lambda = DEFAULT_LAMBDA_VALUE
 }: UseChatConfig) => {
   const [messageHistory, setMessageHistory] = useState<ChatTurn[]>([]);
   const recentQuestion = useRef<string>("");
@@ -68,7 +75,7 @@ export const useChat = ({
       queryValue: query,
       rerank: true,
       rerankNumResults: 7,
-      rerankerId: 272725718,
+      rerankerId,
       rerankDiversityBias: 0.3,
       customerId: customerId,
       corpusId: corpusIds.join(","),
@@ -88,8 +95,10 @@ export const useChat = ({
             summaryNumSentences: 3,
             summaryPromptName,
             language,
+            rerankerId,
             enableFactualConsistencyScore,
-            chat: { store: true, conversationId: conversationId ?? undefined }
+            chat: { store: true, conversationId: conversationId ?? undefined },
+            lambda: lambda
           },
           (update) => onStreamUpdate(update)
         );
@@ -109,6 +118,7 @@ export const useChat = ({
           summaryMode: true,
           summaryNumResults: 7,
           summaryNumSentences: 3,
+          rerankerId,
           summaryPromptName,
           language,
           enableFactualConsistencyScore,