3e13ac88dc
- ChatFileCard: icon, filename, size, download button with theme-aware bg-muted styling - ChatFilePreview: inline image rendering with constrained max-h-[300px], ChatFileCard for all other types - formatFileSize helper (B, KB, MB) - lucide icons: ImageIcon, FileCode, FileText, File per category
29 lines
948 B
TypeScript
29 lines
948 B
TypeScript
import { ChatFileCard } from "./ChatFileCard";
|
|
import type { ChatFile } from "@paperclipai/shared";
|
|
|
|
interface ChatFilePreviewProps {
|
|
file: ChatFile;
|
|
contentPath: string;
|
|
}
|
|
|
|
export function ChatFilePreview({ file, contentPath }: ChatFilePreviewProps) {
|
|
if (file.category === "image") {
|
|
return (
|
|
<div className="flex flex-col gap-1">
|
|
<a href={contentPath} target="_blank" rel="noreferrer" className="block w-fit">
|
|
<img
|
|
src={contentPath}
|
|
alt={file.originalFilename}
|
|
loading="lazy"
|
|
className="max-h-[300px] rounded-lg object-contain"
|
|
/>
|
|
</a>
|
|
{/* Always show card below image for download button */}
|
|
<ChatFileCard file={file} contentPath={contentPath} />
|
|
</div>
|
|
);
|
|
}
|
|
|
|
// For all non-image types (code, document, other): render the file card with download
|
|
return <ChatFileCard file={file} contentPath={contentPath} />;
|
|
}
|