apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-06-06 20:15:17 +02:00
Code Issues Projects Releases Packages Wiki Activity

added document summary UI

Browse source
This commit is contained in:
Anish Sarkar 2025-09-02 02:08:50 +05:30
parent c1b22da874
commit 164598fe5a
1 changed files with 31 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

33
surfsense_web/components/chat/ChatCitation.tsx
View file

@ -1,10 +1,11 @@
"use client"; "use client";
import { ExternalLink, FileText, Loader2 } from "lucide-react"; import { ChevronDown, ChevronUp, ExternalLink, FileText, Loader2 } from "lucide-react";
import type React from "react"; import type React from "react";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import { MarkdownViewer } from "@/components/markdown-viewer"; import { MarkdownViewer } from "@/components/markdown-viewer";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
import { ScrollArea } from "@/components/ui/scroll-area"; import { ScrollArea } from "@/components/ui/scroll-area";
import { import {
Sheet, Sheet,
@ -24,6 +25,7 @@ export const CitationDisplay: React.FC<{ index: number; node: any }> = ({ index,
const { document, loading, error, fetchDocumentByChunk, clearDocument } = useDocumentByChunk(); const { document, loading, error, fetchDocumentByChunk, clearDocument } = useDocumentByChunk();
const chunksContainerRef = useRef<HTMLDivElement>(null); const chunksContainerRef = useRef<HTMLDivElement>(null);
const highlightedChunkRef = useRef<HTMLDivElement>(null); const highlightedChunkRef = useRef<HTMLDivElement>(null);
const [summaryOpen, setSummaryOpen] = useState(false);
// Check if this is a source type that should render directly from node // Check if this is a source type that should render directly from node
const isDirectRenderSource = sourceType === "TAVILY_API" || sourceType === "LINKUP_API"; const isDirectRenderSource = sourceType === "TAVILY_API" || sourceType === "LINKUP_API";
@ -165,7 +167,34 @@ export const CitationDisplay: React.FC<{ index: number; node: any }> = ({ index,
{/* Chunks */} {/* Chunks */}
<div className="space-y-6" ref={chunksContainerRef}> <div className="space-y-6" ref={chunksContainerRef}>
<h3 className="text-base font-semibold mb-4">Document Content</h3> <div className="mb-4">
{/* Header row: header and button side by side */}
<div className="flex flex-row items-center gap-4">
<h3 className="text-base font-semibold mb-2 md:mb-0">Document Content</h3>
{document.content && (
<Collapsible open={summaryOpen} onOpenChange={setSummaryOpen}>
<CollapsibleTrigger className="flex items-center gap-2 py-2 px-3 font-medium border rounded-md bg-muted hover:bg-muted/80 transition-colors">
<span>Summary</span>
{summaryOpen ? (
<ChevronUp className="h-4 w-4 transition-transform" />
) : (
<ChevronDown className="h-4 w-4 transition-transform" />
)}
</CollapsibleTrigger>
</Collapsible>
)}
</div>
{/* Expanded summary content: always full width, below the row */}
{document.content && (
<Collapsible open={summaryOpen} onOpenChange={setSummaryOpen}>
<CollapsibleContent className="pt-2 w-full">
<div className="w-full">
<MarkdownViewer content={document.content} />
</div>
</CollapsibleContent>
</Collapsible>
)}
</div>
{document.chunks.map((chunk, idx) => ( {document.chunks.map((chunk, idx) => (
<div <div
key={chunk.id} key={chunk.id}