Include web result used in answer in the response.

Author: tonybaloney

app/backend/approaches/approach.py

@@ -26,6 +26,7 @@
 
 from approaches.promptmanager import PromptManager
 from core.authentication import AuthenticationHelper
+from bing_client import WebPage
 
 
 @dataclass
@@ -236,6 +237,9 @@ def get_citation(self, sourcepage: str, use_image_citation: bool) -> str:
 
             return sourcepage
 
+    def get_links(self, webpages: list[WebPage]) -> list[str]:
+        return [f"{page.id}: {page.snippet}" for page in webpages]
+
     async def compute_text_embedding(self, q: str):
         SUPPORTED_DIMENSIONS_MODEL = {
             "text-embedding-ada-002": False,

app/backend/approaches/chatreadretrieveread.py

@@ -14,7 +14,7 @@
 from approaches.approach import Document, ThoughtStep
 from approaches.chatapproach import ChatApproach
 from approaches.promptmanager import PromptManager
-from bing_client import AsyncBingClient
+from bing_client import AsyncBingClient, WebPage
 from core.authentication import AuthenticationHelper
 
 
@@ -167,9 +167,10 @@ async def keyword_rewrite(rendered_prompt, tools):
 
         # STEP 3: Generate a contextual and content specific answer using the search results and chat history
         text_sources = self.get_sources_content(results, use_semantic_captions, use_image_citation=False)
-
+        web_sources: list[WebPage] = []
         if use_bing_search and bing_results.totalEstimatedMatches > 0:
-            web_sources = [hit.snippet for hit in bing_results.value[:2]]
+            web_sources = bing_results.value[:2]
+            web_sources_text = self.get_links(web_sources)
 
             rendered_answer_prompt = self.prompt_manager.render_prompt(
                 self.bing_answer_prompt,
@@ -179,7 +180,7 @@ async def keyword_rewrite(rendered_prompt, tools):
                     "past_messages": messages[:-1],
                     "user_query": original_user_query,
                     "text_sources": text_sources,
-                    "web_search_snippets": web_sources,
+                    "web_search_snippets": web_sources_text,
                 },
             )
         else:
@@ -205,7 +206,7 @@ async def keyword_rewrite(rendered_prompt, tools):
         )
 
         extra_info = {
-            "data_points": {"text": text_sources},
+            "data_points": {"text": text_sources, "web_search": [hit.model_dump() for hit in web_sources]},
             "thoughts": [
                 ThoughtStep(
                     "Prompt to generate search query",

app/backend/approaches/prompts/chat_bing_answer_question.prompty

@@ -24,7 +24,8 @@ Assistant helps the company employees with their healthcare plan questions, and
 Answer ONLY with the facts listed in the list of sources below. If there isn't enough information below, say you don't know. Do not generate answers that don't use the sources below. If asking a clarifying question to the user would help, ask the question.
 If the question is not in English, answer in the language used in the question.
 Each source has a name followed by colon and the actual information, always include the source name for each fact you use in the response. Use square brackets to reference the source, for example [info1.txt]. Don't combine sources, list each source separately, for example [info1.txt][info2.pdf].
-Additional web search snippets are included. If the sources do not answer the question, you can use the web search snippets to find the answer. The original sources take precedence over the web search snippets.
+Additional "web search snippets" are included, each with a unique URI then a colon and the snippet text in HTML. If the sources do not answer the question, you can use the web search snippets to find the answer. The original sources take precedence over the web search snippets.
+If you use a web search snippet in your response, always include the URI of the snippet in square brackets, for example [https://api.bing.microsoft.com/api/v7/#WebPages.0].
 {{ injected_prompt }}
 {% endif %}
 

app/frontend/src/components/SupportingContent/SupportingContent.tsx

@@ -2,13 +2,26 @@ import { parseSupportingContentItem } from "./SupportingContentParser";
 
 import styles from "./SupportingContent.module.css";
 
+interface WebPage {
+    id: string;
+    name: string;
+    url: string;
+    displayUrl: string;
+    dateLastCrawled: string;
+    language: string;
+    snippet?: string;
+    isFamilyFriendly?: boolean;
+    siteName?: string;
+}
+
 interface Props {
-    supportingContent: string[] | { text: string[]; images?: string[] };
+    supportingContent: string[] | { text: string[]; images?: string[]; web_search?: WebPage[] };
 }
 
 export const SupportingContent = ({ supportingContent }: Props) => {
     const textItems = Array.isArray(supportingContent) ? supportingContent : supportingContent.text;
     const imageItems = !Array.isArray(supportingContent) ? supportingContent?.images : [];
+    const webSearchItems = !Array.isArray(supportingContent) ? supportingContent?.web_search : [];
     return (
         <ul className={styles.supportingContentNavList}>
             {textItems.map((c, ind) => {
@@ -27,6 +40,17 @@ export const SupportingContent = ({ supportingContent }: Props) => {
                     </li>
                 );
             })}
+            {webSearchItems?.map((webPage, ind) => {
+                return (
+                    <li className={styles.supportingContentItem} key={`supporting-content-web-search-${ind}`}>
+                        <h4 className={styles.supportingContentItemHeader}>{webPage.name}</h4>
+                        <a className={styles.supportingContentItemText} href={webPage.url} target="_blank" rel="noreferrer">
+                            {webPage.url}
+                        </a>
+                        <p className={styles.supportingContentItemText}>{webPage.snippet}</p>
+                    </li>
+                );
+            })}
         </ul>
     );
 };