university/diplom-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

.

Browse Source
This commit is contained in:
Lionarius
2025-05-21 08:46:12 +03:00
parent 9531bff01a
commit 079ce23363
94 changed files with 4630 additions and 2704 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
app/components/chat-message-attachment.tsx
View File

@@ -1,8 +1,4 @@
import {
Download,
ExternalLink,
Maximize
} from "lucide-react";
import { Download, ExternalLink, Maximize } from "lucide-react";
import { AspectRatio } from "~/components/ui/aspect-ratio"; // Shadcn UI AspectRatio
import { Button } from "~/components/ui/button"; // Shadcn UI Button
import {
@@ -28,7 +24,9 @@ interface ChatMessageAttachmentProps {
file: UploadedFile;
}
export default function ChatMessageAttachment({ file }: ChatMessageAttachmentProps) {
export default function ChatMessageAttachment({
file,
}: ChatMessageAttachmentProps) {
if (file.contentType.startsWith("image/")) {
return <ImageAttachment file={file} />;
}
@@ -38,9 +36,12 @@ export default function ChatMessageAttachment({ file }: ChatMessageAttachmentPro
function GenericFileAttachment({ file }: ChatMessageAttachmentProps) {
return (
<TooltipProvider delayDuration={100}>
<div className="flex items-center gap-3 rounded-lg border bg-card p-3 shadow-sm w-full max-w-xs sm:max-w-sm">
<div className="flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-md bg-muted">
<FileIcon className="h-8 w-8 text-muted-foreground" contentType={file.contentType} />
<div className="flex items-center gap-3 rounded-lg border bg-card p-3 shadow-sm ">
<div className="flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-md">
<FileIcon
className="h-8 w-8 text-muted-foreground"
contentType={file.contentType}
/>
</div>
<div className="flex-1 overflow-hidden">
<p className="truncate text-sm font-medium text-card-foreground">
@@ -54,7 +55,12 @@ function GenericFileAttachment({ file }: ChatMessageAttachmentProps) {
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" asChild>
<a href={file.url} target="_blank" rel="noreferrer" download={file.filename}>
<a
href={file.url}
target="_blank"
rel="noreferrer"
download={file.filename}
>
<Download className="h-4 w-4" />
<span className="sr-only">Download</span>
</a>
@@ -65,9 +71,15 @@ function GenericFileAttachment({ file }: ChatMessageAttachmentProps) {
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" asChild>
<a href={file.url} target="_blank" rel="noreferrer">
<a
href={file.url}
target="_blank"
rel="noreferrer"
>
<ExternalLink className="h-4 w-4" />
<span className="sr-only">Open in new tab</span>
<span className="sr-only">
Open in new tab
</span>
</a>
</Button>
</TooltipTrigger>
@@ -85,7 +97,10 @@ function ImageAttachment({ file }: ChatMessageAttachmentProps) {
<TooltipProvider delayDuration={100}>
<div className="group relative w-48 cursor-pointer sm:w-64">
<DialogTrigger asChild>
<AspectRatio ratio={16 / 9} className="overflow-hidden rounded-lg border bg-muted">
<AspectRatio
ratio={16 / 9}
className="overflow-hidden rounded-lg border bg-muted"
>
<img
src={file.url}
alt={file.filename}
@@ -106,7 +121,9 @@ function ImageAttachment({ file }: ChatMessageAttachmentProps) {
<DialogContent className="max-w-3xl p-0">
<DialogHeader className="p-4 pb-0">
<DialogTitle className="truncate">{file.filename}</DialogTitle>
<DialogTitle className="truncate">
{file.filename}
</DialogTitle>
</DialogHeader>
<div className="p-4 pt-0 max-h-[70vh] overflow-y-auto">
<img
@@ -118,7 +135,8 @@ function ImageAttachment({ file }: ChatMessageAttachmentProps) {
<DialogFooter className="flex-col items-stretch gap-2 border-t p-4 sm:flex-row sm:justify-end sm:space-x-2">
<Button variant="outline" asChild>
<a href={file.url} target="_blank" rel="noreferrer">
<ExternalLink className="mr-2 h-4 w-4" /> Open original
<ExternalLink className="mr-2 h-4 w-4" /> Open
original
</a>
</Button>
<Button asChild>
@@ -133,4 +151,4 @@ function ImageAttachment({ file }: ChatMessageAttachmentProps) {
</DialogContent>
</Dialog>
);
}
}