dmitry.galkin
3e21c2334c
Stripped from vercel/chatbot (Apache 2.0): - Dropped @vercel/* packages and AI Gateway - Removed artifacts feature (code/text/sheet/image side panel) - Switched AI provider to @ai-sdk/openai-compatible -> EGBE LiteLLM - Replaced Vercel Blob upload with data URLs - Dropped Redis resumable streams and rate limiter (in-memory now) - Added Dockerfile (Next.js standalone) + entrypoint that runs migrations - Wired DATABASE_URL, EGBE_AI_API_URL/KEY, NEXT_PUBLIC_BASE_URL for app-deploy.sh
54 lines
1.6 KiB
TypeScript
54 lines
1.6 KiB
TypeScript
import type { Attachment } from "@/lib/types";
|
|
import { Spinner } from "../ui/spinner";
|
|
import { CrossSmallIcon } from "./icons";
|
|
|
|
export const PreviewAttachment = ({
|
|
attachment,
|
|
isUploading = false,
|
|
onRemove,
|
|
}: {
|
|
attachment: Attachment;
|
|
isUploading?: boolean;
|
|
onRemove?: () => void;
|
|
}) => {
|
|
const { name, url, contentType } = attachment;
|
|
|
|
return (
|
|
<div
|
|
className="group relative h-24 w-24 shrink-0 overflow-hidden rounded-xl border border-border/40 bg-muted"
|
|
data-testid="input-attachment-preview"
|
|
>
|
|
{contentType?.startsWith("image") ? (
|
|
// eslint-disable-next-line @next/next/no-img-element
|
|
<img
|
|
alt={name ?? "attachment"}
|
|
className="size-full object-cover"
|
|
src={url}
|
|
/>
|
|
) : (
|
|
<div className="flex size-full items-center justify-center text-muted-foreground text-xs">
|
|
File
|
|
</div>
|
|
)}
|
|
|
|
{isUploading && (
|
|
<div
|
|
className="absolute inset-0 flex items-center justify-center rounded-xl bg-black/40 backdrop-blur-sm"
|
|
data-testid="input-attachment-loader"
|
|
>
|
|
<Spinner className="size-5" />
|
|
</div>
|
|
)}
|
|
|
|
{onRemove && !isUploading && (
|
|
<button
|
|
className="absolute top-1.5 right-1.5 flex size-5 items-center justify-center rounded-full bg-black/60 text-white opacity-0 backdrop-blur-sm transition-opacity hover:bg-black/80 group-hover:opacity-100"
|
|
onClick={onRemove}
|
|
type="button"
|
|
>
|
|
<CrossSmallIcon size={10} />
|
|
</button>
|
|
)}
|
|
</div>
|
|
);
|
|
};
|