sceyt-chat-react-uikit 1.7.8-beta.7 → 1.7.8-beta.8

package/components/AudioRecord/index.d.ts

@@ -11,5 +11,5 @@ interface AudioPlayerProps {
     channelId: string;
     maxRecordingDuration?: number;
 }
-declare const AudioRecord: React.FC<AudioPlayerProps>;
-export default AudioRecord;
+declare const _default: React.NamedExoticComponent<AudioPlayerProps>;
+export default _default;

package/index.js

@@ -16370,7 +16370,7 @@ function getChannels(action) {
               try {
                 return Promise.resolve(new Promise(function (resolve) {
                   channel.getMessagesById([channel.newReactions[0].messageId]).then(function (messages) {
-                    channelMessageMap[channel.id] = messages[0];
+                    channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id] = messages[0];
                     log.info('[getChannels] successfully fetched reaction message for channel:', channel === null || channel === void 0 ? void 0 : channel.id);
                     resolve(true);
                   })["catch"](function (e) {
@@ -16389,8 +16389,8 @@ function getChannels(action) {
       case 13:
         log.info('[getChannels] reaction messages fetched:', channelMessageMap ? (_Object$keys = Object.keys(channelMessageMap)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.length : 0);
         mappedChannels = mappedChannels.map(function (channel) {
-          if (channelMessageMap[channel.id]) {
-            channel.lastReactedMessage = channelMessageMap[channel.id];
+          if (channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id]) {
+            channel.lastReactedMessage = channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id];
           }
           return channel;
         });
@@ -41312,6 +41312,13 @@ function SvgRecordButton(props) {
 }
 
 var _templateObject$O, _templateObject2$J, _templateObject3$C, _templateObject4$x, _templateObject5$s, _templateObject6$o, _templateObject7$n;
+var fieldsObject = {
+  channelId: '',
+  currentRecordedFile: null,
+  recording: null,
+  recorder: null,
+  wavesurferContainer: null
+};
 var shouldDraw = false;
 var DEFAULT_MAX_RECORDING_DURATION = 600;
 var AudioRecord = function AudioRecord(_ref) {
@@ -41645,7 +41652,7 @@ var AudioRecord = function AudioRecord(_ref) {
     handleStopRecording();
     shouldDraw = false;
     var id = cId || channelId;
-    recorder.stop().getMp3().then(function (_ref4) {
+    recorder === null || recorder === void 0 ? void 0 : recorder.stop().getMp3().then(function (_ref4) {
       var buffer = _ref4[0],
         blob = _ref4[1];
       var file = new File(buffer, 'record.mp3', {
@@ -41765,6 +41772,30 @@ var AudioRecord = function AudioRecord(_ref) {
       }
     };
   }, [recording, maxRecordingDuration]);
+  React.useEffect(function () {
+    fieldsObject.channelId = channelId;
+  }, [channelId]);
+  React.useEffect(function () {
+    fieldsObject.recorder = recorder;
+  }, [recorder]);
+  React.useEffect(function () {
+    fieldsObject.currentRecordedFile = currentRecordedFile;
+  }, [currentRecordedFile]);
+  React.useEffect(function () {
+    fieldsObject.recording = recording;
+  }, [recording]);
+  React.useEffect(function () {
+    fieldsObject.wavesurferContainer = wavesurferContainer.current;
+  }, [wavesurferContainer.current]);
+  React.useEffect(function () {
+    return function () {
+      var _fieldsObject$current;
+      if (fieldsObject.channelId && (!fieldsObject.currentRecordedFile || !((_fieldsObject$current = fieldsObject.currentRecordedFile) !== null && _fieldsObject$current !== void 0 && _fieldsObject$current.file)) && fieldsObject.recorder && fieldsObject.recording) {
+        stopRecording(false, fieldsObject.channelId, true, fieldsObject.recorder, fieldsObject.wavesurferContainer);
+        handleStopRecording();
+      }
+    };
+  }, []);
   React.useEffect(function () {
     if (currentRecordedFile) {
       _initWaveSurfer();
@@ -41889,6 +41920,9 @@ var AudioRecord = function AudioRecord(_ref) {
     iconColor: accentColor
   }, showRecording || currentRecordedFile ? /*#__PURE__*/React__default.createElement(SvgSend, null) : /*#__PURE__*/React__default.createElement(SvgRecordButton, null)));
 };
+var AudioRecord$1 = /*#__PURE__*/React.memo(AudioRecord, function (prevProps, nextProps) {
+  return prevProps.channelId === nextProps.channelId && prevProps.showRecording === nextProps.showRecording && prevProps.maxRecordingDuration === nextProps.maxRecordingDuration;
+});
 var Container$l = styled__default.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n  width: 32px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  ", ";\n  transition: all 0.3s ease-in-out;\n"])), function (props) {
   return props.recording && "width: 400px";
 });
@@ -42467,7 +42501,7 @@ function onError(error) {
 var prevActiveChannelId;
 var attachmentsUpdate = [];
 var SendMessageInput = function SendMessageInput(_ref3) {
-  var _pollOptions$choosePo;
+  var _pollOptions$choosePo, _getAudioRecordingFro;
   var handleAttachmentSelected = _ref3.handleAttachmentSelected,
     handleSendMessage = _ref3.handleSendMessage,
     _ref3$disabled = _ref3.disabled,
@@ -43583,7 +43617,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
         document.body.removeAttribute('onbeforeunload');
       }
     }
-  }, [messageText, attachments, editMessageText, readyVideoAttachments, messageBodyAttributes]);
+  }, [messageText, attachments, editMessageText, readyVideoAttachments, messageBodyAttributes, messageToEdit]);
   useDidUpdate(function () {
     if (mentionedUsers && mentionedUsers.length) {
       setDraftMessageToMap(activeChannel.id, {
@@ -43898,7 +43932,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     onChange: handleFileUpload,
     multiple: true,
     type: 'file'
-  }), showRecording || getAudioRecordingFromMap(activeChannel.id) ? (/*#__PURE__*/React__default.createElement(AudioCont, null)) : (/*#__PURE__*/React__default.createElement(MessageInputWrapper, {
+  }), (showRecording || getAudioRecordingFromMap(activeChannel.id)) && !messageToEdit ? (/*#__PURE__*/React__default.createElement(AudioCont, null)) : (/*#__PURE__*/React__default.createElement(MessageInputWrapper, {
     className: 'message_input_wrapper',
     borderRadius: messageForReply || messageToEdit ? borderRadiusOnOpenedEditReplyMessage : borderRadius,
     ref: inputWrapperRef,
@@ -44021,7 +44055,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     ErrorBoundary: LexicalErrorBoundary
   }), floatingAnchorElem && !isSmallWidthViewport && allowTextEdit && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(FloatingTextFormatToolbarPlugin, {
     anchorElem: floatingAnchorElem
-  })))))))), sendMessageIsActive || !voiceMessage || messageToEdit ? (/*#__PURE__*/React__default.createElement(SendMessageButton, {
+  })))))))), sendMessageIsActive || !voiceMessage && !((_getAudioRecordingFro = getAudioRecordingFromMap(activeChannel === null || activeChannel === void 0 ? void 0 : activeChannel.id)) !== null && _getAudioRecordingFro !== void 0 && _getAudioRecordingFro.file) || messageToEdit ? (/*#__PURE__*/React__default.createElement(SendMessageButton, {
     isCustomButton: CustomSendMessageButton,
     isActive: sendMessageIsActive,
     order: sendIconOrder,
@@ -44037,7 +44071,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     color: accentColor,
     iconColor: accentColor,
     activeColor: accentColor
-  }, /*#__PURE__*/React__default.createElement(AudioRecord, {
+  }, /*#__PURE__*/React__default.createElement(AudioRecord$1, {
     sendRecordedFile: sendRecordedFile,
     setShowRecording: setShowRecording,
     showRecording: showRecording,

package/index.modern.js

@@ -16369,7 +16369,7 @@ function getChannels(action) {
               try {
                 return Promise.resolve(new Promise(function (resolve) {
                   channel.getMessagesById([channel.newReactions[0].messageId]).then(function (messages) {
-                    channelMessageMap[channel.id] = messages[0];
+                    channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id] = messages[0];
                     log.info('[getChannels] successfully fetched reaction message for channel:', channel === null || channel === void 0 ? void 0 : channel.id);
                     resolve(true);
                   })["catch"](function (e) {
@@ -16388,8 +16388,8 @@ function getChannels(action) {
       case 13:
         log.info('[getChannels] reaction messages fetched:', channelMessageMap ? (_Object$keys = Object.keys(channelMessageMap)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.length : 0);
         mappedChannels = mappedChannels.map(function (channel) {
-          if (channelMessageMap[channel.id]) {
-            channel.lastReactedMessage = channelMessageMap[channel.id];
+          if (channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id]) {
+            channel.lastReactedMessage = channelMessageMap[channel === null || channel === void 0 ? void 0 : channel.id];
           }
           return channel;
         });
@@ -41311,6 +41311,13 @@ function SvgRecordButton(props) {
 }
 
 var _templateObject$O, _templateObject2$J, _templateObject3$C, _templateObject4$x, _templateObject5$s, _templateObject6$o, _templateObject7$n;
+var fieldsObject = {
+  channelId: '',
+  currentRecordedFile: null,
+  recording: null,
+  recorder: null,
+  wavesurferContainer: null
+};
 var shouldDraw = false;
 var DEFAULT_MAX_RECORDING_DURATION = 600;
 var AudioRecord = function AudioRecord(_ref) {
@@ -41644,7 +41651,7 @@ var AudioRecord = function AudioRecord(_ref) {
     handleStopRecording();
     shouldDraw = false;
     var id = cId || channelId;
-    recorder.stop().getMp3().then(function (_ref4) {
+    recorder === null || recorder === void 0 ? void 0 : recorder.stop().getMp3().then(function (_ref4) {
       var buffer = _ref4[0],
         blob = _ref4[1];
       var file = new File(buffer, 'record.mp3', {
@@ -41764,6 +41771,30 @@ var AudioRecord = function AudioRecord(_ref) {
       }
     };
   }, [recording, maxRecordingDuration]);
+  useEffect(function () {
+    fieldsObject.channelId = channelId;
+  }, [channelId]);
+  useEffect(function () {
+    fieldsObject.recorder = recorder;
+  }, [recorder]);
+  useEffect(function () {
+    fieldsObject.currentRecordedFile = currentRecordedFile;
+  }, [currentRecordedFile]);
+  useEffect(function () {
+    fieldsObject.recording = recording;
+  }, [recording]);
+  useEffect(function () {
+    fieldsObject.wavesurferContainer = wavesurferContainer.current;
+  }, [wavesurferContainer.current]);
+  useEffect(function () {
+    return function () {
+      var _fieldsObject$current;
+      if (fieldsObject.channelId && (!fieldsObject.currentRecordedFile || !((_fieldsObject$current = fieldsObject.currentRecordedFile) !== null && _fieldsObject$current !== void 0 && _fieldsObject$current.file)) && fieldsObject.recorder && fieldsObject.recording) {
+        stopRecording(false, fieldsObject.channelId, true, fieldsObject.recorder, fieldsObject.wavesurferContainer);
+        handleStopRecording();
+      }
+    };
+  }, []);
   useEffect(function () {
     if (currentRecordedFile) {
       _initWaveSurfer();
@@ -41888,6 +41919,9 @@ var AudioRecord = function AudioRecord(_ref) {
     iconColor: accentColor
   }, showRecording || currentRecordedFile ? /*#__PURE__*/React__default.createElement(SvgSend, null) : /*#__PURE__*/React__default.createElement(SvgRecordButton, null)));
 };
+var AudioRecord$1 = /*#__PURE__*/memo(AudioRecord, function (prevProps, nextProps) {
+  return prevProps.channelId === nextProps.channelId && prevProps.showRecording === nextProps.showRecording && prevProps.maxRecordingDuration === nextProps.maxRecordingDuration;
+});
 var Container$l = styled.div(_templateObject$O || (_templateObject$O = _taggedTemplateLiteralLoose(["\n  width: 32px;\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  ", ";\n  transition: all 0.3s ease-in-out;\n"])), function (props) {
   return props.recording && "width: 400px";
 });
@@ -42466,7 +42500,7 @@ function onError(error) {
 var prevActiveChannelId;
 var attachmentsUpdate = [];
 var SendMessageInput = function SendMessageInput(_ref3) {
-  var _pollOptions$choosePo;
+  var _pollOptions$choosePo, _getAudioRecordingFro;
   var handleAttachmentSelected = _ref3.handleAttachmentSelected,
     handleSendMessage = _ref3.handleSendMessage,
     _ref3$disabled = _ref3.disabled,
@@ -43582,7 +43616,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
         document.body.removeAttribute('onbeforeunload');
       }
     }
-  }, [messageText, attachments, editMessageText, readyVideoAttachments, messageBodyAttributes]);
+  }, [messageText, attachments, editMessageText, readyVideoAttachments, messageBodyAttributes, messageToEdit]);
   useDidUpdate(function () {
     if (mentionedUsers && mentionedUsers.length) {
       setDraftMessageToMap(activeChannel.id, {
@@ -43897,7 +43931,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     onChange: handleFileUpload,
     multiple: true,
     type: 'file'
-  }), showRecording || getAudioRecordingFromMap(activeChannel.id) ? (/*#__PURE__*/React__default.createElement(AudioCont, null)) : (/*#__PURE__*/React__default.createElement(MessageInputWrapper, {
+  }), (showRecording || getAudioRecordingFromMap(activeChannel.id)) && !messageToEdit ? (/*#__PURE__*/React__default.createElement(AudioCont, null)) : (/*#__PURE__*/React__default.createElement(MessageInputWrapper, {
     className: 'message_input_wrapper',
     borderRadius: messageForReply || messageToEdit ? borderRadiusOnOpenedEditReplyMessage : borderRadius,
     ref: inputWrapperRef,
@@ -44020,7 +44054,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     ErrorBoundary: LexicalErrorBoundary
   }), floatingAnchorElem && !isSmallWidthViewport && allowTextEdit && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(FloatingTextFormatToolbarPlugin, {
     anchorElem: floatingAnchorElem
-  })))))))), sendMessageIsActive || !voiceMessage || messageToEdit ? (/*#__PURE__*/React__default.createElement(SendMessageButton, {
+  })))))))), sendMessageIsActive || !voiceMessage && !((_getAudioRecordingFro = getAudioRecordingFromMap(activeChannel === null || activeChannel === void 0 ? void 0 : activeChannel.id)) !== null && _getAudioRecordingFro !== void 0 && _getAudioRecordingFro.file) || messageToEdit ? (/*#__PURE__*/React__default.createElement(SendMessageButton, {
     isCustomButton: CustomSendMessageButton,
     isActive: sendMessageIsActive,
     order: sendIconOrder,
@@ -44036,7 +44070,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
     color: accentColor,
     iconColor: accentColor,
     activeColor: accentColor
-  }, /*#__PURE__*/React__default.createElement(AudioRecord, {
+  }, /*#__PURE__*/React__default.createElement(AudioRecord$1, {
     sendRecordedFile: sendRecordedFile,
     setShowRecording: setShowRecording,
     showRecording: showRecording,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sceyt-chat-react-uikit",
-  "version": "1.7.8-beta.7",
+  "version": "1.7.8-beta.8",
   "description": "Interactive React UI Components for Sceyt Chat.",
   "author": "Sceyt",
   "license": "MIT",