Initial document display

backend/danswer/main.py

@@ -90,7 +90,7 @@ def get_application() -> FastAPI:
     )
 
     @application.on_event("startup")
-    async def startup_event() -> None:
+    def startup_event() -> None:
         from danswer.semantic_search.semantic_search import (
             warm_up_models,
         )  # To avoid circular imports

backend/danswer/server/search_backend.py

@@ -81,7 +81,7 @@ async def promote_admin(
 
 
 @router.get("/direct-qa", response_model=QAResponse)
-def direct_qa(question: QAQuestion):
+def direct_qa(question: QAQuestion = Depends()):
     start_time = time.time()
 
     query = question.query
@@ -104,7 +104,7 @@ def direct_qa(question: QAQuestion):
 
 
 @router.get("/stream-direct-qa")
-def stream_direct_qa(question: QAQuestion):
+def stream_direct_qa(question: QAQuestion = Depends()):
     top_documents_key = "top_documents"
     answer_key = "answer"
     quotes_key = "quotes"
@@ -147,7 +147,7 @@ def stream_direct_qa(question: QAQuestion):
 
 
 @router.get("/keyword-search", response_model=KeywordResponse)
-def keyword_search(question: QAQuestion):
+def keyword_search(question: QAQuestion = Depends()):
     ts_client = TSClient.get_instance()
     query = question.query
     collection = question.collection

web/src/components/Header.tsx

@@ -11,7 +11,7 @@ export const Header: React.FC = () => {
 
   return (
     <header className="bg-gray-800 text-gray-200 py-4">
-      <div className="mx-auto mx-8 flex">
+      <div className="mx-8 flex">
         <h1 className="text-2xl font-bold">danswer 💃</h1>
 
         <div

web/src/components/SearchBar.tsx

@@ -7,14 +7,14 @@ import { SearchResultsDisplay } from "./SearchResultsDisplay";
 import { SearchResponse } from "./types";
 
 const searchRequest = async (query: string): Promise<SearchResponse> => {
-  const response = await fetch("/api/direct-qa", {
-    method: "POST",
-    headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({
-      query: query,
-      collection: "semantic_search",
-    }),
-  });
+  const url = new URL("/api/direct-qa", window.location.origin);
+  const params = new URLSearchParams({
+    query,
+    collection: "semantic_search",
+  }).toString();
+  url.search = params;
+
+  const response = await fetch(url);
   return response.json();
 };
 

web/src/components/SearchResultsDisplay.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { Globe, SlackLogo, GoogleDriveLogo } from "@phosphor-icons/react";
 import "tailwindcss/tailwind.css";
-import { SearchResponse } from "./types";
+import { Quote, SearchResponse } from "./types";
 import { ThinkingAnimation } from "./Thinking";
 
 interface SearchResultsDisplayProps {
@@ -38,31 +38,64 @@ export const SearchResultsDisplay: React.FC<SearchResultsDisplayProps> = ({
   }
 
   const { answer, quotes } = data;
-
   if (!answer || !quotes) {
     return <div>Unable to find an answer</div>;
   }
 
-  return (
-    <div className="p-4 border rounded-md border-gray-700">
-      <h2 className="text font-bold mb-2">Answer</h2>
-      <p className="mb-4">{answer}</p>
+  const dedupedQuotes: Quote[] = [];
+  const seen = new Set<string>();
+  Object.values(quotes).forEach((quote) => {
+    if (!seen.has(quote.document_id)) {
+      dedupedQuotes.push(quote);
+      seen.add(quote.document_id);
+    }
+  });
 
-      <h2 className="text-sm font-bold mb-2">Sources</h2>
-      <div className="flex">
-        {Object.entries(quotes).map(([_, quoteInfo]) => (
-          <a
-            key={quoteInfo.document_id}
-            className="p-2 border border-gray-800 rounded-lg text-sm flex max-w-[230px] hover:bg-gray-800"
-            href={quoteInfo.link}
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            {getSourceIcon(quoteInfo.source_type)}
-            <p className="truncate break-all">{quoteInfo.document_id}</p>
-          </a>
+  return (
+    <>
+      <div className="p-4 border rounded-md border-gray-700">
+        <h2 className="text font-bold mb-2">AI Answer</h2>
+        <p className="mb-4">{answer}</p>
+
+        <h2 className="text-sm font-bold mb-2">Sources</h2>
+        <div className="flex">
+          {dedupedQuotes.map((quoteInfo) => (
+            <a
+              key={quoteInfo.document_id}
+              className="p-2 border border-gray-800 rounded-lg text-sm flex max-w-[230px] hover:bg-gray-800"
+              href={quoteInfo.link}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              {getSourceIcon(quoteInfo.source_type)}
+              <p className="truncate break-all">
+                {quoteInfo.semantic_identifier || quoteInfo.document_id}
+              </p>
+            </a>
+          ))}
+        </div>
+      </div>
+      <div className="mt-4">
+        <div className="font-bold border-b mb-4 pb-1 border-gray-800">
+          Results
+        </div>
+        {dedupedQuotes.map((quoteInfo) => (
+          <div key={quoteInfo.document_id} className="text-sm">
+            <a
+              className="rounded-lg flex font-bold"
+              href={quoteInfo.link}
+              target="_blank"
+              rel="noopener noreferrer"
+            >
+              {getSourceIcon(quoteInfo.source_type)}
+              <p className="truncate break-all">
+                {quoteInfo.semantic_identifier || quoteInfo.document_id}
+              </p>
+            </a>
+            <p className="p-2 mb-2 text-gray-200">{quoteInfo.blurb}</p>
+          </div>
         ))}
       </div>
-    </div>
+    </>
   );
 };

web/src/components/types.tsx

@@ -2,6 +2,8 @@ export interface Quote {
   document_id: string;
   link: string;
   source_type: string;
+  blurb: string;
+  semantic_identifier: string | null;
 }
 
 export interface SearchResponse {