use translation prop

packages/docsearch-react/src/AskAiScreen.tsx

@@ -65,6 +65,10 @@ export type AskAiScreenTranslations = Partial<{
    * Button text for generating a summary.
    */
   generateSummaryButtonText: string;
+  /**
+   * Translations for the conversation summary.
+   */
+  conversationSummaryTitle: string;
 }>;
 
 type AskAiScreenProps = Omit<ScreenStateProps<InternalDocSearchHit>, 'translations'> & {
@@ -493,7 +497,7 @@ export function AskAiScreen({ translations = {}, ...props }: AskAiScreenProps):
               ))}
           </div>
         )}
-        {summary && <ConversationSummary summary={summary} translations={null} />}
+        {summary && <ConversationSummary summary={summary} translations={translations} />}
       </div>
     </div>
   );

packages/docsearch-react/src/ConversationSummary.tsx

@@ -1,22 +1,23 @@
 import type { JSX } from 'react';
 import React from 'react';
 
+import type { AskAiScreenTranslations } from './AskAiScreen';
 import { SparklesIcon } from './icons';
 import { MemoizedMarkdown } from './MemoizedMarkdown';
 
 export type ConversationSummaryProps = {
   summary: string;
-  translations?: {
-    summaryTitle?: string;
-  } | null;
+  translations: AskAiScreenTranslations;
 };
 
 export function ConversationSummary({ summary, translations }: ConversationSummaryProps): JSX.Element {
+  const { conversationSummaryTitle = 'Summary' } = translations;
+
   return (
     <div className="DocSearch-ConversationSummary">
       <div className="DocSearch-ConversationSummary-title">
         <SparklesIcon />
-        <span>{translations?.summaryTitle || 'Summary'}</span>
+        <span>{conversationSummaryTitle}</span>
       </div>
       <div className="DocSearch-ConversationSummary-content">
         <MemoizedMarkdown content={summary} copyButtonText="" copyButtonCopiedText="" isStreaming={false} />

packages/docsearch-react/src/utils/ai.ts

@@ -69,8 +69,12 @@ export function extractLinksFromMessage(message: AIMessage | null): ExtractedLin
   return links;
 }
 
-export const buildDummyAskAiHit = (query: string, messages: AIMessage[], index: number = 0): StoredAskAiState => {
-  const textPart = messages[index].parts.find((part) => part.type === 'text');
+export const buildDummyAskAiHit = (
+  query: string,
+  messages: AIMessage[],
+  conversationStarterIndex: number = 0,
+): StoredAskAiState => {
+  const textPart = messages[conversationStarterIndex].parts.find((part) => part.type === 'text');
   const sanitizedText = textPart?.text ? sanitizeUserInput(textPart.text) : '';
 
   return {