@plteam/chat-ui
Version:
CUI Kit is a free and open-source library for creating AI assistant chat interfaces, built with React, Material UI, and TypeScript
41 lines (40 loc) • 1.9 kB
JavaScript
import * as React from 'react';
import { useChatCoreSlots } from '../../core/ChatSlotsContext';
import { useMobile } from '../../../ui/Responsive';
import { useLocalizationContext } from '../../core/LocalizationContext';
import MdMenu from '../../../ui/menu/MdMenu';
import { PhotoCameraIcon, FolderIcon, AttachFileIcon } from '../../../icons';
const FileAttachmentButton = ({ disabled, onOpenFileDialog, onOpenDeviceCamera }) => {
const coreSlots = useChatCoreSlots();
const [anchorEl, setAnchorEl] = React.useState(null);
const isMobile = useMobile();
const locale = useLocalizationContext();
const handleClick = (event) => {
if (isMobile) {
setAnchorEl(event.currentTarget);
return;
}
onOpenFileDialog();
};
const handleClickFileDialogue = () => {
onOpenFileDialog();
setAnchorEl(null);
};
const handleClickoDeviceCamera = () => {
onOpenDeviceCamera();
setAnchorEl(null);
};
return (React.createElement(React.Fragment, null,
React.createElement(coreSlots.iconButton, { disabled: disabled, onClick: handleClick },
React.createElement(AttachFileIcon, null)),
React.createElement(MdMenu, { anchorEl: anchorEl, open: Boolean(anchorEl), anchorOrigin: {
vertical: 'top',
horizontal: 'left',
}, transformOrigin: {
vertical: 'top',
horizontal: 'left',
}, onClose: () => setAnchorEl(null) },
React.createElement(coreSlots.menuItem, { startIcon: PhotoCameraIcon, onClick: handleClickoDeviceCamera }, locale.attachmentImageShot),
React.createElement(coreSlots.menuItem, { startIcon: FolderIcon, onClick: handleClickFileDialogue }, locale.attachmentImageGallery))));
};
export default FileAttachmentButton;