@memori.ai/memori-react
Version:
[](https://www.npmjs.com/package/@memori.ai/memori-react)  ![TypeScript Support](https
78 lines • 5.21 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from 'react';
import ChatTextArea from '../ChatTextArea/ChatTextArea';
import Button from '../ui/Button';
import { useTranslation } from 'react-i18next';
import Send from '../icons/Send';
import MicrophoneButton from '../MicrophoneButton/MicrophoneButton';
import cx from 'classnames';
import Microphone from '../icons/Microphone';
import UploadButton from '../UploadButton/UploadButton';
import FilePreview from '../FilePreview/FilePreview';
const ChatInputs = ({ dialogState, userMessage = '', sendOnEnter, onChangeUserMessage, sendMessage, onTextareaFocus, onTextareaBlur, resetTranscript, showMicrophone = false, microphoneMode = 'HOLD_TO_TALK', listening = false, stopAudio, startListening, stopListening, showUpload = false, sessionID, authToken, memoriID, client, }) => {
const { t } = useTranslation();
const [documentPreviewFiles, setDocumentPreviewFiles] = useState([]);
const { dialog } = client || {
dialog: { postMediumDeselectedEvent: null },
};
const onSendMessage = (files) => {
sendMessage(userMessage, files.map(file => ({
mediumID: file.mediumID || '',
mimeType: file.mimeType,
content: file.content,
title: file.name,
properties: { isAttachedFile: true },
type: file.type,
url: file.url,
})));
setDocumentPreviewFiles([]);
stopAudio();
speechSynthesis.speak(new SpeechSynthesisUtterance(''));
};
const onTextareaPressEnter = () => {
if (sendOnEnter === 'keypress' && (userMessage === null || userMessage === void 0 ? void 0 : userMessage.length) > 0) {
stopListening();
sendMessage(userMessage, documentPreviewFiles.map(file => ({
mediumID: file.mediumID || '',
mimeType: file.mimeType,
content: file.content,
title: file.name,
properties: { isAttachedFile: true },
type: file.type,
url: file.url,
})));
setDocumentPreviewFiles([]);
onChangeUserMessage('');
resetTranscript();
}
};
const removeFile = async (fileId, mediumID) => {
console.log('removeFile', fileId);
if (dialog.postMediumDeselectedEvent && sessionID && mediumID) {
await dialog.postMediumDeselectedEvent(sessionID, mediumID);
}
setDocumentPreviewFiles((prev) => prev.filter((file) => file.id !== fileId));
};
return (_jsxs("fieldset", { id: "chat-fieldset", className: "memori-chat-inputs", disabled: (dialogState === null || dialogState === void 0 ? void 0 : dialogState.state) === 'X2a' || (dialogState === null || dialogState === void 0 ? void 0 : dialogState.state) === 'X3', children: [_jsx(ChatTextArea, { value: userMessage, onChange: onChangeUserMessage, onPressEnter: onTextareaPressEnter, onFocus: onTextareaFocus, onBlur: onTextareaBlur, disabled: ['R2', 'R3', 'R4', 'R5', 'G3', 'X3'].includes((dialogState === null || dialogState === void 0 ? void 0 : dialogState.state) || '') }), showUpload && (_jsxs(_Fragment, { children: [_jsx(FilePreview, { previewFiles: documentPreviewFiles, removeFile: removeFile }), _jsx(UploadButton, { authToken: authToken, client: client, sessionID: sessionID, isMediaAccepted: (dialogState === null || dialogState === void 0 ? void 0 : dialogState.acceptsMedia) || false, setDocumentPreviewFiles: setDocumentPreviewFiles, documentPreviewFiles: documentPreviewFiles, memoriID: memoriID })] })), _jsx(Button, { shape: "circle", primary: !!(userMessage === null || userMessage === void 0 ? void 0 : userMessage.length), disabled: !userMessage || userMessage.length === 0, className: "memori-chat-inputs--send", onClick: () => {
onSendMessage(documentPreviewFiles);
}, title: t('send') || 'Send', icon: _jsx(Send, {}) }), showMicrophone && microphoneMode === 'HOLD_TO_TALK' && (_jsx(MicrophoneButton, { listening: listening, startListening: startListening, stopListening: () => {
stopListening();
if (!!(userMessage === null || userMessage === void 0 ? void 0 : userMessage.length)) {
sendMessage(userMessage);
}
}, stopAudio: stopAudio })), showMicrophone && microphoneMode === 'CONTINUOUS' && (_jsx(Button, { primary: true, className: cx('memori-chat-inputs--mic', {
'memori-chat-inputs--mic--listening': listening,
}), title: listening
? t('write_and_speak.micButtonPopoverListening') || 'Listening'
: t('write_and_speak.micButtonPopover') || 'Start listening', onClick: () => {
if (listening) {
stopListening();
}
else {
stopAudio();
startListening();
}
}, shape: "circle", icon: _jsx(Microphone, {}) }))] }));
};
export default ChatInputs;
//# sourceMappingURL=ChatInputs.js.map