File size: 2,388 Bytes
12621bc |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
import React from "react";
import { Button } from "@/components/ui/button";
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger, DropdownMenuSeparator } from "@/components/ui/dropdown-menu";
import { Input as InputField } from "@/components/ui/input";
import { Paperclip, Upload, Link2 } from "lucide-react";
interface AttachmentDropdownProps {
isUrlInputOpen: boolean;
setIsUrlInputOpen: (open: boolean) => void;
urlInput: string;
setUrlInput: (url: string) => void;
handleAttachmentFileUpload: (event: React.ChangeEvent<HTMLInputElement>) => void;
handleAttachmentUrlUpload: () => void;
}
export const AttachmentDropdown = React.memo(({
isUrlInputOpen,
setIsUrlInputOpen,
urlInput,
setUrlInput,
handleAttachmentFileUpload,
handleAttachmentUrlUpload
}: AttachmentDropdownProps) => (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button
variant="ghost"
size="icon"
className="h-8 w-8"
>
<Paperclip className="h-4 w-4" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="start" className="w-[300px]">
<DropdownMenuItem
onSelect={() => {
const input = document.createElement("input");
input.type = "file";
input.multiple = true;
input.accept = ".pdf,.doc,.docx,.txt,.jpg,.jpeg,.png,.gif,.mp3,.mp4,.wav,.ogg";
input.onchange = (e) => handleAttachmentFileUpload(e as unknown as React.ChangeEvent<HTMLInputElement>);
input.click();
}}
>
<Upload className="h-4 w-4 mr-2" />
Upload Files
</DropdownMenuItem>
<DropdownMenuSeparator />
<DropdownMenuItem onSelect={(e) => {
e.preventDefault();
setIsUrlInputOpen(true);
}}>
<Link2 className="h-4 w-4 mr-2" />
Add URLs
</DropdownMenuItem>
{isUrlInputOpen && (
<div className="p-2 flex gap-2">
<InputField
value={urlInput}
onChange={(e) => setUrlInput(e.target.value)}
placeholder="Enter URLs (comma-separated)"
className="flex-1"
/>
<Button size="sm" onClick={handleAttachmentUrlUpload}>
Add
</Button>
</div>
)}
</DropdownMenuContent>
</DropdownMenu>
));
AttachmentDropdown.displayName = "AttachmentDropdown"; |