mirror of https://github.com/kortix-ai/suna.git
wip
This commit is contained in:
parent
04ce0e499b
commit
a873e3467c
|
@ -113,37 +113,43 @@ function renderMarkdownContent(content: string, handleToolClick: (assistantMessa
|
|||
<Markdown className="text-sm prose prose-sm dark:prose-invert chat-markdown max-w-none break-words [&>:first-child]:mt-0 prose-headings:mt-3">{askContent}</Markdown>
|
||||
|
||||
{attachments.length > 0 && (
|
||||
<div className="mt-3 space-y-2">
|
||||
<div className="text-xs font-medium text-muted-foreground">Attachments:</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<div className="mt-6">
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
|
||||
{attachments.map((attachment, idx) => {
|
||||
const extension = attachment.split('.').pop()?.toLowerCase();
|
||||
const isImage = ['jpg', 'jpeg', 'png', 'gif', 'webp', 'svg'].includes(extension || '');
|
||||
const isPdf = extension === 'pdf';
|
||||
const isMd = extension === 'md';
|
||||
const isCode = ['js', 'jsx', 'ts', 'tsx', 'py', 'html', 'css', 'json'].includes(extension || '');
|
||||
const filename = attachment.split('/').pop() || 'file';
|
||||
|
||||
let icon = <File className="h-3.5 w-3.5 text-muted-foreground" />;
|
||||
if (isImage) icon = <File className="h-3.5 w-3.5 text-purple-500" />;
|
||||
if (isPdf) icon = <File className="h-3.5 w-3.5 text-red-500" />;
|
||||
if (isMd) icon = <File className="h-3.5 w-3.5 text-blue-500" />;
|
||||
if (isCode) icon = <File className="h-3.5 w-3.5 text-emerald-500" />;
|
||||
// Define file size (in a real app, this would come from the backend)
|
||||
const fileSize =
|
||||
extension === 'html' ? '52.68 KB' :
|
||||
attachment.includes('itinerary') ? '4.14 KB' :
|
||||
attachment.includes('proposal') ? '6.20 KB' :
|
||||
attachment.includes('todo') ? '1.89 KB' :
|
||||
attachment.includes('research') ? '3.75 KB' :
|
||||
`${(Math.random() * 5 + 1).toFixed(2)} KB`;
|
||||
|
||||
// Get file type display
|
||||
const fileType = extension === 'html' ? 'Code' : 'Text';
|
||||
|
||||
return (
|
||||
<button
|
||||
key={`attachment-${idx}`}
|
||||
onClick={() => fileViewerHandler?.(attachment)}
|
||||
className="group inline-flex items-center gap-2 rounded-md border bg-muted/5 px-2.5 py-1.5 text-sm transition-colors hover:bg-muted/10"
|
||||
className="group flex items-center gap-3 p-4 rounded-md bg-muted/10 hover:bg-muted/20 transition-colors"
|
||||
>
|
||||
<div className="flex h-6 w-6 shrink-0 items-center justify-center rounded-md border bg-background">
|
||||
{icon}
|
||||
<div className="flex items-center justify-center">
|
||||
<File className="h-5 w-5 text-muted-foreground" />
|
||||
</div>
|
||||
<div className="flex-1 overflow-hidden">
|
||||
<div className="font-medium truncate max-w-[120px]">
|
||||
{attachment.split('/').pop()}
|
||||
<div className="flex-1 min-w-0 text-left">
|
||||
<div className="text-sm font-medium text-foreground truncate">
|
||||
{filename}
|
||||
</div>
|
||||
<div className="text-xs text-muted-foreground flex items-center gap-1">
|
||||
<span>{fileType}</span>
|
||||
<span>·</span>
|
||||
<span>{fileSize}</span>
|
||||
</div>
|
||||
</div>
|
||||
<ChevronRight className="h-3.5 w-3.5 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100" />
|
||||
</button>
|
||||
);
|
||||
})}
|
||||
|
@ -1410,3 +1416,4 @@ export default function ThreadPage({ params }: { params: Promise<ThreadParams> }
|
|||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue