renamed corpusKey to corpusKeys

vectara · Jul 24, 2024 · 604aa7d · 604aa7d
1 parent c239d0a
commit 604aa7d
Show file tree

Hide file tree

Showing 14 changed files with 74 additions and 73 deletions.
diff --git a/README.md b/README.md
@@ -60,7 +60,7 @@ import { ReactChatbot } from "@vectara/react-chatbot";
 
 <ReactChatbot
   customerId="CUSTOMER_ID"
-  corpusIds={["CORPUS_ID_1", "CORPUS_ID_2", "CORPUS_ID_N"]}
+  corpusKeys={["CORPUS_KEY_1", "CORPUS_KEY_2", "CORPUS_KEY_N"]}
   apiKey="API_KEY"
   title="My Chatbot"
   placeholder="Chat with your AI assistant"
@@ -79,9 +79,10 @@ import { ReactChatbot } from "@vectara/react-chatbot";
 
 Every Vectara account is associated with a customer ID. You can find your customer ID by logging into the [Vectara Console](https://console.vectara.com/) and opening your account dropdown in the top-right corner.
 
-##### `corpusIds` (required)
+##### `corpuskeys` (required)
 
-After you [create a corpus](https://docs.vectara.com/docs/console-ui/creating-a-corpus), you can find its ID by navigating to the corpus and looking in the top-left corner, next to the corpus name.
+After you [create a corpus](https://docs.vectara.com/docs/console-ui/creating-a-corpus), you can find its Key by navigating to the corpus and looking in the top-left corner, next to the corpus name.
+To run queries against multiple corpora, use a comma-separated list of corpus keys. For example: "corpus_1,corpus_2".
 
 ##### `apiKey` (required)
 
@@ -230,7 +231,7 @@ export const App = (props: Props): ReactNode => {
       setChatWidget(
         <ReactChatbot
           customerId="CUSTOMER_ID"
-          corpusIds={["CORPUS_ID_1", "CORPUS_ID_2", "CORPUS_ID_N"]}
+          corpusKeys={["CORPUS_KEY_1", "CORPUS_KEY_2", "CORPUS_KEY_N"]}
           apiKey="API_KEY"
         />
       );

diff --git a/docs/package-lock.json b/docs/package-lock.json
diff --git a/docs/src/components/ConfigurationDrawer.tsx b/docs/src/components/ConfigurationDrawer.tsx
@@ -21,8 +21,8 @@ import { SUMMARY_LANGUAGES, RerankerId } from "../../../src/types";
 type Props = {
   isOpen: boolean;
   onClose: () => void;
-  corpusKey: string;
-  onUpdateCorpusKey: (event: React.ChangeEvent<HTMLInputElement>) => void;
+  corpusKeys: string;
+  onUpdateCorpusKeys: (event: React.ChangeEvent<HTMLInputElement>) => void;
   customerId: string;
   onUpdateCustomerId: (event: React.ChangeEvent<HTMLInputElement>) => void;
   apiKey: string;
@@ -56,8 +56,8 @@ type Props = {
 export const ConfigurationDrawer = ({
   isOpen,
   onClose,
-  corpusKey,
-  onUpdateCorpusKey,
+  corpusKeys,
+  onUpdateCorpusKeys,
   customerId,
   onUpdateCustomerId,
   apiKey,
@@ -121,7 +121,7 @@ export const ConfigurationDrawer = ({
       <VuiSpacer size="m" />
 
       <VuiFormGroup label="Corpus Key" labelFor="corpusId">
-        <VuiTextInput value={corpusKey} onChange={onUpdateCorpusKey} />
+        <VuiTextInput value={corpusKeys} onChange={onUpdateCorpusKeys} />
       </VuiFormGroup>
 
       <VuiSpacer size="m" />

diff --git a/docs/src/index.tsx b/docs/src/index.tsx
@@ -34,7 +34,7 @@ const formatStringProp = (value?: string) => {
 
 const generateCodeSnippet = (
   customerId?: string,
-  corpusKey?: string,
+  corpusKeys?: string,
   apiKey?: string,
   title?: string,
   placeholder?: string,
@@ -49,7 +49,7 @@ const generateCodeSnippet = (
 ) => {
   const props = [
     `customerId="${customerId === "" ? "<Your Vectara customer ID>" : customerId}"`,
-    `corpusIds="${corpusKey === "" ? "<Your Vectara Corpus key>" : corpusKey}"`,
+    `corpusKeys="${corpusKeys === "" ? "<Your Vectara Corpus key>" : corpusKeys}"`,
     `apiKey="${apiKey === "" ? "<Your Vectara API key>" : apiKey}"`
   ];
 
@@ -108,7 +108,7 @@ const DEFAULT_PLACEHOLDER = 'Try "What is Vectara?" or "How does RAG work?"';
 const App = () => {
   const [isConfigurationDrawerOpen, setIsConfigurationDrawerOpen] = useState(false);
   const [isChatbotForcedOpen, setIsChatbotForcedOpen] = useState(true);
-  const [corpusKey, setCorpusKey] = useState<string>("");
+  const [corpusKeys, setCorpusKeys] = useState<string>("");
   const [customerId, setCustomerId] = useState<string>("");
   const [apiKey, setApiKey] = useState<string>("");
   const [title, setTitle] = useState<string>(DEFAULT_TITLE);
@@ -124,8 +124,8 @@ const App = () => {
   const [rerankerId, setRerankerId] = useState<RerankerId>(DEFAULT_RERANKER_ID);
   const [lambda, setLambda] = useState<number>(DEFAULT_LAMBDA_VALUE);
 
-  const onUpdateCorpusKey = useCallback((e: ChangeEvent<HTMLInputElement>) => {
-    setCorpusKey(e.target.value);
+  const onUpdateCorpusKeys = useCallback((e: ChangeEvent<HTMLInputElement>) => {
+    setCorpusKeys(e.target.value);
   }, []);
 
   const onUpdateCustomerId = useCallback((e: ChangeEvent<HTMLInputElement>) => {
@@ -212,7 +212,7 @@ const App = () => {
              * This ensures that we don't voluntarily display the docs corpus details in the text fields.
              */}
             <ReactChatbot
-              corpusKey={corpusKey === "" ? DEFAULT_CORPUS_KEY : corpusKey}
+              corpusKey={corpusKeys === "" ? DEFAULT_CORPUS_KEY : corpusKeys}
               customerId={customerId === "" ? DEFAULT_CUSTOMER_ID : customerId}
               apiKey={apiKey === "" ? DEFAULT_API_KEY : apiKey}
               title={title === "" ? undefined : title}
@@ -261,7 +261,7 @@ const App = () => {
             <VuiCode language="tsx">
               {generateCodeSnippet(
                 customerId,
-                corpusKey,
+                corpusKeys,
                 apiKey,
                 title,
                 placeholder,
@@ -305,7 +305,7 @@ export const App = () => {
     startNewConversation
   } = useChat({
     customerId: DEFAULT_CUSTOMER_ID,
-    corpusKey: DEFAULT_CORPUS_KEY,
+    corpusKeys: DEFAULT_CORPUS_KEY,
     apiKey: DEFAULT_API_KEY,
     enableStreaming: true, // Enable streaming, false otherwise. Defaults to true.
     numberOfSearchResults: 15, // Number of search results to use for summary.
@@ -348,8 +348,8 @@ export const App = () => {
             <ConfigurationDrawer
               isOpen={isConfigurationDrawerOpen}
               onClose={() => setIsConfigurationDrawerOpen(false)}
-              corpusKey={corpusKey}
-              onUpdateCorpusKey={onUpdateCorpusKey}
+              corpusKeys={corpusKeys}
+              onUpdateCorpusKeys={onUpdateCorpusKeys}
               customerId={customerId}
               onUpdateCustomerId={onUpdateCustomerId}
               apiKey={apiKey}

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@vectara/react-chatbot",
-  "version": "2.0.0",
+  "version": "3.0.0",
   "description": "A Vectara-powered Chatbot component",
   "main": "lib/index.js",
   "module": "lib/index.js",
@@ -32,7 +32,7 @@
   "dependencies": {
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
-    "@vectara/stream-query-client": "^3.1.0",
+    "@vectara/stream-query-client": "^3.2.0",
     "classnames": "^2.3.2",
     "lodash": "^4.17.21",
     "prismjs": "^1.29.0",

diff --git a/src/components/ChatReferences.tsx b/src/components/ChatReferences.tsx
@@ -1,4 +1,4 @@
-import {VuiFlexContainer, VuiFlexItem, VuiText, VuiAccordion, VuiSpacer, VuiLink} from "../vui";
+import {VuiFlexContainer, VuiFlexItem, VuiText, VuiAccordion, VuiSpacer} from "../vui";
 import { SearchResultWithSnippet } from "../types";
 
 type Props = {
@@ -44,9 +44,9 @@ const ChatReference = ({ result, position }: { result: SearchResultWithSnippet;
           <VuiText size="s">
             <p>
               {url ? (
-                  <a href={url} target="_blank">
-                    {text}
-                  </a>
+                <a href={url} target="_blank">
+                  {text}
+                </a>
               ) : (
                   text
               )}

diff --git a/src/components/ChatView.tsx b/src/components/ChatView.tsx
@@ -21,8 +21,8 @@ export interface Props {
   // Vectara API key
   apiKey: string;
 
-  // Vectara corpus IDs
-  corpusKey: string;
+  // Vectara corpus keys
+  corpusKeys: string;
 
   // Title to be shown in the UI header
   title?: string;
@@ -75,7 +75,7 @@ export interface Props {
  */
 export const ChatView = ({
   customerId,
-  corpusKey,
+  corpusKeys,
   apiKey,
   title = "My Chatbot",
   placeholder = "Chat with your AI Assistant",
@@ -97,7 +97,7 @@ export const ChatView = ({
   const { sendMessage, startNewConversation, messageHistory, isLoading, hasError, activeMessage, isStreamingResponse } =
     useChat({
       customerId,
-      corpusKey,
+      corpusKeys,
       apiKey,
       numberOfSearchResults,
       language,

diff --git a/src/components/FactualConsistencyBadge.tsx b/src/components/FactualConsistencyBadge.tsx
@@ -20,28 +20,28 @@ export const FactualConsistencyBadge = ({ score }: Props) => {
     }
 
     badge = (
-        <VuiBadge color={badgeColor as "neutral" | "success" | "danger"}>
-          Factual Consistency Score: {sanitizedScore}
-        </VuiBadge>
+      <VuiBadge color={badgeColor as "neutral" | "success" | "danger"}>
+        Factual Consistency Score: {sanitizedScore}
+      </VuiBadge>
     );
   }
 
   return (
-      <VuiFlexContainer alignItems="center" data-testid="factualConsistencyBadge">
-        {score === undefined && <VuiSpinner size="s" />}
-
-        {badge}
-
-        <VuiText size="xs">
-          <p>
-            <VuiLink
-                href="https://docs.vectara.com/docs/api-reference/search-apis/search?#factual-consistency-score"
-                target="_blank"
-            >
-              What's this?
-            </VuiLink>
-          </p>
-        </VuiText>
-      </VuiFlexContainer>
+    <VuiFlexContainer alignItems="center" data-testid="factualConsistencyBadge">
+      {score === undefined && <VuiSpinner size="s" />}
+
+      {badge}
+
+      <VuiText size="xs">
+        <p>
+          <VuiLink
+              href="https://docs.vectara.com/docs/api-reference/search-apis/search?#factual-consistency-score"
+              target="_blank"
+          >
+            What's this?
+          </VuiLink>
+        </p>
+      </VuiText>
+    </VuiFlexContainer>
   );
 };
diff --git a/src/index.test.tsx b/src/index.test.tsx
@@ -6,7 +6,7 @@ import * as useChatInterface from "./useChat";
 
 const MIN_PROPS = {
   customerId: "mock-customer-id",
-  corpusKey: "1",
+  corpusKeys: "1",
   apiKey: "mock-api-key"
 };
 

diff --git a/src/index.tsx b/src/index.tsx
@@ -19,7 +19,7 @@ class ReactChatbotWebComponent extends HTMLElement {
   static get observedAttributes() {
     return [
       "customerid",
-      "corpuskey",
+      "corpuskeys",
       "apikey",
       "title",
       "placeholder",
@@ -69,7 +69,7 @@ class ReactChatbotWebComponent extends HTMLElement {
 
   public connectedCallback() {
     const customerId = this.getAttribute("customerId") ?? "";
-    const corpusKey = (this.getAttribute("corpuskey") ?? "");
+    const corpusKeys = (this.getAttribute("corpuskey") ?? "");
     const apiKey = this.getAttribute("apiKey") ?? "";
     const title = this.getAttribute("title") ?? undefined;
     const placeholder = this.getAttribute("placeholder") ?? undefined;
@@ -92,7 +92,7 @@ class ReactChatbotWebComponent extends HTMLElement {
       <div>
         <ChatView
           customerId={customerId}
-          corpusKey={corpusKey}
+          corpusKeys={corpusKeys}
           apiKey={apiKey}
           title={title}
           placeholder={placeholder}

diff --git a/src/useChat.test.ts b/src/useChat.test.ts
@@ -42,7 +42,7 @@ describe("useChat", () => {
   describe("streaming", () => {
     it("should send messages and update hook values", async () => {
       const { result } = renderHook(() =>
-          useChat({ customerId: "mock-customer-id", corpusKey: "1", apiKey: "mock-api-key" })
+          useChat({ customerId: "mock-customer-id", corpusKeys: "1", apiKey: "mock-api-key" })
       );
 
       streamQuerySpy.mockImplementation(async ({onStreamEvent}) => {
@@ -85,7 +85,7 @@ describe("useChat", () => {
   describe("non-streaming", () => {
     it("should send messages and update message history", async () => {
       const { result } = renderHook(() =>
-          useChat({ customerId: "mock-customer-id", corpusKey: "1", apiKey: "mock-api-key", enableStreaming: false })
+          useChat({ customerId: "mock-customer-id", corpusKeys: "1", apiKey: "mock-api-key", enableStreaming: false })
       );
 
       sendSearchRequestSpy.mockImplementation(() => Promise.resolve(MOCK_API_RESPONSE));
@@ -105,7 +105,7 @@ describe("useChat", () => {
 
     it("should reflect error state", async () => {
       const { result } = renderHook(() =>
-          useChat({ customerId: "mock-customer-id", corpusKey: "1", apiKey: "mock-api-key", enableStreaming: false })
+          useChat({ customerId: "mock-customer-id", corpusKeys: "1", apiKey: "mock-api-key", enableStreaming: false })
       );
       sendSearchRequestSpy.mockImplementation(() => {
         throw "error";
@@ -120,7 +120,7 @@ describe("useChat", () => {
 
     it("should reflect loading state", async () => {
       const { result } = renderHook(() =>
-          useChat({ customerId: "mock-customer-id", corpusKey: "1", apiKey: "mock-api-key" })
+          useChat({ customerId: "mock-customer-id", corpusKeys: "1", apiKey: "mock-api-key" })
       );
       sendSearchRequestSpy.mockImplementation(() => {
         return new Promise(() => {});
@@ -136,7 +136,7 @@ describe("useChat", () => {
 
   it("should be able to reset the conversation", async () => {
     const { result } = renderHook(() =>
-        useChat({ customerId: "mock-customer-id", corpusKey: "1", apiKey: "mock-api-key", enableStreaming: false })
+        useChat({ customerId: "mock-customer-id", corpusKeys: "1", apiKey: "mock-api-key", enableStreaming: false })
     );
     sendSearchRequestSpy.mockImplementation(() => Promise.resolve(MOCK_API_RESPONSE));