From 3f8bd8b34e6af02cdefb4430402b7321b97ec02d Mon Sep 17 00:00:00 2001
From: pablonyx <pablo@danswer.ai>
Date: Wed, 11 Dec 2024 13:37:11 -0800
Subject: [PATCH] Clean citation cards (#3396)

* seed

* initial steps

* clean up

* fully clickable
---
 backend/danswer/setup.py                      |  3 +--
 .../chat/message/MemoizedTextComponents.tsx   | 20 ++++++-------------
 web/src/components/search/DocumentDisplay.tsx | 20 +++++++++++++++----
 .../components/search/results/Citation.tsx    |  7 ++++++-
 4 files changed, 29 insertions(+), 21 deletions(-)

diff --git a/backend/danswer/setup.py b/backend/danswer/setup.py
index db9cdce85d1..9571ac28926 100644
--- a/backend/danswer/setup.py
+++ b/backend/danswer/setup.py
@@ -39,7 +39,6 @@
 from danswer.natural_language_processing.search_nlp_models import EmbeddingModel
 from danswer.natural_language_processing.search_nlp_models import warm_up_bi_encoder
 from danswer.natural_language_processing.search_nlp_models import warm_up_cross_encoder
-from danswer.seeding.load_docs import seed_initial_documents
 from danswer.seeding.load_yamls import load_chat_yamls
 from danswer.server.manage.llm.models import LLMProviderUpsertRequest
 from danswer.server.settings.store import load_settings
@@ -151,7 +150,7 @@ def setup_danswer(
     # update multipass indexing setting based on GPU availability
     update_default_multipass_indexing(db_session)
 
-    seed_initial_documents(db_session, tenant_id, cohere_enabled)
+    # seed_initial_documents(db_session, tenant_id, cohere_enabled)
 
 
 def translate_saved_search_settings(db_session: Session) -> None:
diff --git a/web/src/app/chat/message/MemoizedTextComponents.tsx b/web/src/app/chat/message/MemoizedTextComponents.tsx
index 779b6ce8461..efdce4ca86b 100644
--- a/web/src/app/chat/message/MemoizedTextComponents.tsx
+++ b/web/src/app/chat/message/MemoizedTextComponents.tsx
@@ -1,10 +1,12 @@
 import { Citation } from "@/components/search/results/Citation";
 import { WebResultIcon } from "@/components/WebResultIcon";
 import { LoadedDanswerDocument } from "@/lib/search/interfaces";
-import { getSourceMetadata } from "@/lib/sources";
+import { getSourceMetadata, SOURCE_METADATA_MAP } from "@/lib/sources";
 import { ValidSources } from "@/lib/types";
 import React, { memo } from "react";
 import isEqual from "lodash/isEqual";
+import { SlackIcon } from "@/components/icons/icons";
+import { SourceIcon } from "@/components/SourceIcon";
 
 export const MemoizedAnchor = memo(
   ({ docs, updatePresentingDocument, children }: any) => {
@@ -19,19 +21,9 @@ export const MemoizedAnchor = memo(
           ? new URL(associatedDoc.link).origin + "/favicon.ico"
           : "";
 
-        const getIcon = (sourceType: ValidSources, link: string) => {
-          return getSourceMetadata(sourceType).icon({ size: 18 });
-        };
-
-        const icon =
-          associatedDoc?.source_type === "web" ? (
-            <WebResultIcon url={associatedDoc.link} />
-          ) : (
-            getIcon(
-              associatedDoc?.source_type || "web",
-              associatedDoc?.link || ""
-            )
-          );
+        const icon = (
+          <SourceIcon sourceType={associatedDoc?.source_type} iconSize={18} />
+        );
 
         return (
           <MemoizedLink
diff --git a/web/src/components/search/DocumentDisplay.tsx b/web/src/components/search/DocumentDisplay.tsx
index 04b17b02791..17867e1edde 100644
--- a/web/src/components/search/DocumentDisplay.tsx
+++ b/web/src/components/search/DocumentDisplay.tsx
@@ -21,6 +21,7 @@ import { CustomTooltip, TooltipGroup } from "../tooltip/CustomTooltip";
 import { WarningCircle } from "@phosphor-icons/react";
 import TextView from "../chat_search/TextView";
 import { SearchResultIcon } from "../SearchResultIcon";
+import { ValidSources } from "@/lib/types";
 
 export const buildDocumentSummaryDisplay = (
   matchHighlights: string[],
@@ -425,21 +426,32 @@ export function CompactDocumentCard({
   document,
   icon,
   url,
+  updatePresentingDocument,
 }: {
   document: LoadedDanswerDocument;
   icon?: React.ReactNode;
   url?: string;
+  updatePresentingDocument: (documentIndex: LoadedDanswerDocument) => void;
 }) {
   return (
-    <div className="max-w-[250px]  pb-0 pt-0 mt-0 flex gap-y-0  flex-col  content-start items-start gap-0 ">
-      <h3 className="text-sm font-semibold flex  items-center gap-x-1 text-text-900 pt-0 mt-0 truncate w-full">
+    <div
+      onClick={() => {
+        if (document.source_type === ValidSources.File) {
+          updatePresentingDocument(document);
+        } else if (document.link) {
+          window.open(document.link, "_blank");
+        }
+      }}
+      className="max-w-[250px] cursor-pointer pb-0 pt-0 mt-0 flex gap-y-0  flex-col  content-start items-start gap-0 "
+    >
+      <div className="text-sm font-semibold flex  items-center gap-x-1 text-text-900 pt-0 mt-0 truncate w-full">
         {icon}
         {(document.semantic_identifier || document.document_id).slice(0, 40)}
         {(document.semantic_identifier || document.document_id).length > 40 &&
           "..."}
-      </h3>
+      </div>
       {document.blurb && (
-        <p className="text-xs  mb-0 text-gray-600 line-clamp-2">
+        <p className="text-xs mb-0 text-gray-600 line-clamp-2">
           {document.blurb}
         </p>
       )}
diff --git a/web/src/components/search/results/Citation.tsx b/web/src/components/search/results/Citation.tsx
index c10b4c11594..4abb877abfc 100644
--- a/web/src/components/search/results/Citation.tsx
+++ b/web/src/components/search/results/Citation.tsx
@@ -52,7 +52,12 @@ export function Citation({
           </div>
         </TooltipTrigger>
         <TooltipContent width="mb-2 max-w-lg" className="bg-background">
-          <CompactDocumentCard url={url} icon={icon} document={document} />
+          <CompactDocumentCard
+            updatePresentingDocument={updatePresentingDocument}
+            url={url}
+            icon={icon}
+            document={document}
+          />
         </TooltipContent>
       </Tooltip>
     </TooltipProvider>