sceyt-chat-react-uikit 1.7.2-beta.2 → 1.7.2-beta.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/index.js +119 -105
  2. package/index.modern.js +119 -105
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -10349,7 +10349,8 @@ var initialState$1 = {
10349
10349
  attachmentsUploadingProgress: {},
10350
10350
  playingAudioId: null,
10351
10351
  selectedMessagesMap: null,
10352
- oGMetadata: {}
10352
+ oGMetadata: {},
10353
+ attachmentUpdatedMap: {}
10353
10354
  };
10354
10355
  var messageSlice = createSlice({
10355
10356
  name: 'messages',
@@ -10478,39 +10479,8 @@ var messageSlice = createSlice({
10478
10479
  updateMessageAttachment: function updateMessageAttachment(state, action) {
10479
10480
  var _action$payload4 = action.payload,
10480
10481
  url = _action$payload4.url,
10481
- messageId = _action$payload4.messageId,
10482
- params = _action$payload4.params;
10483
- state.activeChannelMessages = state.activeChannelMessages.map(function (message) {
10484
- if (message.id === messageId) {
10485
- for (var index = 0; index < message.attachments.length; index++) {
10486
- var attachment = message.attachments[index];
10487
- if (attachment.url === url) {
10488
- message.attachments[index] = _extends({}, attachment, params);
10489
- }
10490
- }
10491
- }
10492
- if (message.attachments.length) {
10493
- var detachedAttachments = message.attachments.map(function (att) {
10494
- var _att$user, _att$user2;
10495
- return _extends({}, att, {
10496
- user: _extends({}, att.user, {
10497
- metadata: _extends({}, ((_att$user = att.user) === null || _att$user === void 0 ? void 0 : _att$user.metadata) || {}),
10498
- presence: _extends({}, ((_att$user2 = att.user) === null || _att$user2 === void 0 ? void 0 : _att$user2.presence) || {})
10499
- })
10500
- });
10501
- });
10502
- updateMessageOnAllMessages(messageId, {
10503
- attachments: detachedAttachments
10504
- });
10505
- updateMessageOnMap(message.channelId, {
10506
- messageId: messageId,
10507
- params: {
10508
- attachments: detachedAttachments
10509
- }
10510
- });
10511
- }
10512
- return message;
10513
- });
10482
+ attachmentUrl = _action$payload4.attachmentUrl;
10483
+ state.attachmentUpdatedMap[url] = attachmentUrl;
10514
10484
  },
10515
10485
  addReactionToMessage: function addReactionToMessage(state, action) {
10516
10486
  var _action$payload5 = action.payload,
@@ -10698,6 +10668,15 @@ var messageSlice = createSlice({
10698
10668
  url = _action$payload10.url,
10699
10669
  metadata = _action$payload10.metadata;
10700
10670
  state.oGMetadata[url] = metadata;
10671
+ },
10672
+ updateOGMetadata: function updateOGMetadata(state, action) {
10673
+ var _action$payload11 = action.payload,
10674
+ url = _action$payload11.url,
10675
+ metadata = _action$payload11.metadata;
10676
+ if (metadata) {
10677
+ var existing = state.oGMetadata[url];
10678
+ state.oGMetadata[url] = existing ? _extends({}, existing, metadata) : metadata;
10679
+ }
10701
10680
  }
10702
10681
  },
10703
10682
  extraReducers: function extraReducers(builder) {
@@ -10748,7 +10727,8 @@ var _messageSlice$actions = messageSlice.actions,
10748
10727
  addSelectedMessage = _messageSlice$actions.addSelectedMessage,
10749
10728
  removeSelectedMessage = _messageSlice$actions.removeSelectedMessage,
10750
10729
  clearSelectedMessages = _messageSlice$actions.clearSelectedMessages,
10751
- setOGMetadata = _messageSlice$actions.setOGMetadata;
10730
+ setOGMetadata = _messageSlice$actions.setOGMetadata,
10731
+ updateOGMetadata = _messageSlice$actions.updateOGMetadata;
10752
10732
  var MessageReducer = messageSlice.reducer;
10753
10733
 
10754
10734
  var initialState$2 = {
@@ -11834,11 +11814,16 @@ function setOGMetadataAC(url, metadata) {
11834
11814
  metadata: metadata
11835
11815
  });
11836
11816
  }
11837
- function setUpdateMessageAttachmentAC(url, messageId, params) {
11817
+ function updateOGMetadataAC(url, metadata) {
11818
+ return updateOGMetadata({
11819
+ url: url,
11820
+ metadata: metadata
11821
+ });
11822
+ }
11823
+ function setUpdateMessageAttachmentAC(url, attachmentUrl) {
11838
11824
  return updateMessageAttachment({
11839
11825
  url: url,
11840
- messageId: messageId,
11841
- params: params
11826
+ attachmentUrl: attachmentUrl
11842
11827
  });
11843
11828
  }
11844
11829
  function updateMessageAC(messageId, params, addIfNotExists) {
@@ -17149,6 +17134,9 @@ var playingAudioIdSelector = function playingAudioIdSelector(store) {
17149
17134
  var selectedMessagesMapSelector = function selectedMessagesMapSelector(store) {
17150
17135
  return store.MessageReducer.selectedMessagesMap;
17151
17136
  };
17137
+ var attachmentUpdatedMapSelector = function attachmentUpdatedMapSelector(store) {
17138
+ return store.MessageReducer.attachmentUpdatedMap;
17139
+ };
17152
17140
 
17153
17141
  var getFrame = function getFrame(videoSrc, time) {
17154
17142
  try {
@@ -29609,13 +29597,17 @@ var Attachment = function Attachment(_ref) {
29609
29597
  var connectionStatus = useSelector(connectionStatusSelector);
29610
29598
  var theme = useSelector(themeSelector);
29611
29599
  var imageContRef = React.useRef(null);
29612
- var _useState = React.useState(!attachment.attachmentUrl),
29600
+ var attachmentUpdatedMap = useSelector(attachmentUpdatedMapSelector) || {};
29601
+ var attachmentUrlFromMap = React.useMemo(function () {
29602
+ return attachmentUpdatedMap[attachment.url];
29603
+ }, [attachmentUpdatedMap, attachment.url]);
29604
+ var _useState = React.useState(!attachmentUrlFromMap),
29613
29605
  imageLoading = _useState[0],
29614
29606
  setImageLoading = _useState[1];
29615
29607
  var _useState2 = React.useState(false),
29616
29608
  downloadingFile = _useState2[0],
29617
29609
  setDownloadingFile = _useState2[1];
29618
- var _useState3 = React.useState(''),
29610
+ var _useState3 = React.useState(attachmentUrlFromMap),
29619
29611
  attachmentUrl = _useState3[0],
29620
29612
  setAttachmentUrl = _useState3[1];
29621
29613
  var _useState4 = React.useState(),
@@ -29639,27 +29631,26 @@ var Attachment = function Attachment(_ref) {
29639
29631
  var fileNameRef = React.useRef(null);
29640
29632
  var customDownloader = getCustomDownloader();
29641
29633
  var previewFileType = isPreview && attachment.data.type.split('/')[0];
29634
+ var attachmentMetadata = React.useMemo(function () {
29635
+ return isJSON(attachment.metadata) ? JSON.parse(attachment.metadata) : attachment.metadata;
29636
+ }, [attachment.metadata]);
29642
29637
  var _useMemo = React.useMemo(function () {
29643
29638
  var attachmentData = null;
29644
- if (attachment.metadata && typeof attachment.metadata === 'string') {
29645
- attachmentData = isJSON(attachment.metadata) ? JSON.parse(attachment.metadata) : attachment.metadata;
29646
- } else if (attachment.metadata && attachment.metadata.szw && attachment.metadata.szh) {
29647
- attachmentData = attachment.metadata;
29648
- }
29639
+ attachmentData = attachmentMetadata;
29649
29640
  return attachmentData && attachmentData.szw && attachmentData.szh ? calculateRenderedImageWidth(attachmentData.szw, attachmentData.szh, attachment.type === attachmentTypes.image ? imageAttachmentMaxWidth : videoAttachmentMaxWidth, attachment.type === attachmentTypes.image ? imageAttachmentMaxHeight || 400 : videoAttachmentMaxHeight) : [];
29650
- }, []),
29641
+ }, [attachmentMetadata]),
29651
29642
  renderWidth = _useMemo[0],
29652
29643
  renderHeight = _useMemo[1];
29653
29644
  var isInUploadingState = attachmentCompilationState[attachment.tid] && (attachmentCompilationState[attachment.tid] === UPLOAD_STATE.UPLOADING || attachmentCompilationState[attachment.tid] === UPLOAD_STATE.PAUSED);
29654
29645
  var attachmentThumb;
29655
29646
  var withPrefix = true;
29656
- if (attachment.type !== attachmentTypes.voice && attachment.type !== attachmentTypes.link && attachment.metadata && attachment.metadata.tmb) {
29647
+ if (attachment.type !== attachmentTypes.voice && attachment.type !== attachmentTypes.link && attachmentMetadata && attachmentMetadata.tmb) {
29657
29648
  try {
29658
- if (attachment.metadata.tmb.length < 70) {
29659
- attachmentThumb = base64ToToDataURL(attachment.metadata.tmb);
29649
+ if (attachmentMetadata.tmb.length < 70) {
29650
+ attachmentThumb = base64ToToDataURL(attachmentMetadata.tmb);
29660
29651
  withPrefix = false;
29661
29652
  } else {
29662
- attachmentThumb = attachment.metadata && attachment.metadata.tmb;
29653
+ attachmentThumb = attachmentMetadata && attachmentMetadata.tmb;
29663
29654
  }
29664
29655
  } catch (e) {
29665
29656
  log.error('error on get attachmentThumb', e);
@@ -29823,9 +29814,7 @@ var Attachment = function Attachment(_ref) {
29823
29814
  if (attachment.type === attachmentTypes.image && !isPreview) {
29824
29815
  if (cachedUrl) {
29825
29816
  setAttachmentUrl(cachedUrl);
29826
- dispatch(setUpdateMessageAttachmentAC(attachment.url, attachment.messageId, {
29827
- attachmentUrl: cachedUrl
29828
- }));
29817
+ dispatch(setUpdateMessageAttachmentAC(attachment.url, cachedUrl));
29829
29818
  setIsCached(true);
29830
29819
  } else {
29831
29820
  setIsCached(false);
@@ -31398,7 +31387,7 @@ var validateUrl = function validateUrl(url) {
31398
31387
  }
31399
31388
  };
31400
31389
  var OGMetadata = function OGMetadata(_ref) {
31401
- var _metadata$og5, _metadata$og5$image, _metadata$og5$image$, _metadata$og6, _metadata$og6$image, _metadata$og6$image$, _metadata$og7, _metadata$og8, _metadata$og8$favicon, _metadata$og9, _metadata$og9$favicon, _metadata$og0, _metadata$og1, _metadata$og10;
31390
+ var _metadata$og4, _metadata$og4$image, _metadata$og4$image$, _metadata$og5, _metadata$og5$image, _metadata$og5$image$, _metadata$og6, _metadata$og7, _metadata$og7$favicon, _metadata$og8, _metadata$og8$favicon, _metadata$og9, _metadata$og0, _metadata$og1;
31402
31391
  var attachments = _ref.attachments,
31403
31392
  state = _ref.state;
31404
31393
  var dispatch = useDispatch();
@@ -31432,47 +31421,61 @@ var OGMetadata = function OGMetadata(_ref) {
31432
31421
  var ogMetadataQueryBuilder = React.useCallback(function (url) {
31433
31422
  try {
31434
31423
  var client = getClient();
31435
- var _temp2 = function () {
31424
+ var _temp3 = function () {
31436
31425
  if (client) {
31437
- var _temp = _catch(function () {
31426
+ var _temp2 = _catch(function () {
31438
31427
  var queryBuilder = new client.MessageLinkOGQueryBuilder(url);
31439
31428
  return Promise.resolve(queryBuilder.build()).then(function (query) {
31440
31429
  return Promise.resolve(query.loadOGData()).then(function (metadata) {
31441
31430
  var _metadata$og, _metadata$og$image, _metadata$og$image$;
31442
31431
  var image = new Image();
31443
31432
  image.src = metadata === null || metadata === void 0 ? void 0 : (_metadata$og = metadata.og) === null || _metadata$og === void 0 ? void 0 : (_metadata$og$image = _metadata$og.image) === null || _metadata$og$image === void 0 ? void 0 : (_metadata$og$image$ = _metadata$og$image[0]) === null || _metadata$og$image$ === void 0 ? void 0 : _metadata$og$image$.url;
31444
- if (image.src) {
31445
- image.onload = function () {
31446
- try {
31447
- var imageWidth = image.width;
31448
- var imageHeight = image.height;
31449
- return Promise.resolve(storeMetadata(url, _extends({}, metadata, {
31450
- imageWidth: imageWidth,
31451
- imageHeight: imageHeight
31452
- }))).then(function () {
31453
- handleMetadata(_extends({}, metadata, {
31433
+ var _temp = function () {
31434
+ if (image.src) {
31435
+ image.onload = function () {
31436
+ try {
31437
+ var imageWidth = image.width;
31438
+ var imageHeight = image.height;
31439
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata, {
31454
31440
  imageWidth: imageWidth,
31455
31441
  imageHeight: imageHeight
31456
- }));
31457
- });
31458
- } catch (e) {
31459
- return Promise.reject(e);
31460
- }
31461
- };
31462
- image.onerror = function () {
31463
- setImageLoadError(true);
31464
- };
31465
- }
31442
+ }))).then(function () {
31443
+ handleMetadata(_extends({}, metadata, {
31444
+ imageWidth: imageWidth,
31445
+ imageHeight: imageHeight
31446
+ }));
31447
+ });
31448
+ } catch (e) {
31449
+ return Promise.reject(e);
31450
+ }
31451
+ };
31452
+ image.onerror = function () {
31453
+ try {
31454
+ setImageLoadError(true);
31455
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata))).then(function () {
31456
+ handleMetadata(_extends({}, metadata));
31457
+ });
31458
+ } catch (e) {
31459
+ return Promise.reject(e);
31460
+ }
31461
+ };
31462
+ } else {
31463
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata))).then(function () {
31464
+ handleMetadata(_extends({}, metadata));
31465
+ });
31466
+ }
31467
+ }();
31468
+ if (_temp && _temp.then) return _temp.then(function () {});
31466
31469
  });
31467
31470
  });
31468
31471
  }, function () {
31469
31472
  console.log('Failed to fetch OG metadata');
31470
31473
  handleMetadata(null);
31471
31474
  });
31472
- if (_temp && _temp.then) return _temp.then(function () {});
31475
+ if (_temp2 && _temp2.then) return _temp2.then(function () {});
31473
31476
  }
31474
31477
  }();
31475
- return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {
31478
+ return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {
31476
31479
  return null;
31477
31480
  }) : null);
31478
31481
  } catch (e) {
@@ -31488,9 +31491,8 @@ var OGMetadata = function OGMetadata(_ref) {
31488
31491
  try {
31489
31492
  if (cachedMetadata) {
31490
31493
  handleMetadata(cachedMetadata);
31491
- } else {
31492
- ogMetadataQueryBuilder(url);
31493
31494
  }
31495
+ ogMetadataQueryBuilder(url);
31494
31496
  return Promise.resolve();
31495
31497
  } catch (e) {
31496
31498
  return Promise.reject(e);
@@ -31510,11 +31512,14 @@ var OGMetadata = function OGMetadata(_ref) {
31510
31512
  return url;
31511
31513
  }, [attachment === null || attachment === void 0 ? void 0 : attachment.url]);
31512
31514
  var showOGMetadata = React.useMemo(function () {
31513
- var _metadata$og2, _metadata$og3, _metadata$og3$image, _metadata$og3$image$, _metadata$og4;
31514
- return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : (_metadata$og3$image = _metadata$og3.image) === null || _metadata$og3$image === void 0 ? void 0 : (_metadata$og3$image$ = _metadata$og3$image[0]) === null || _metadata$og3$image$ === void 0 ? void 0 : _metadata$og3$image$.url) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og4 = metadata.og) === null || _metadata$og4 === void 0 ? void 0 : _metadata$og4.description) && metadata;
31515
+ var _metadata$og2, _metadata$og3;
31516
+ return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : _metadata$og3.description) && metadata;
31515
31517
  }, [state, metadata]);
31516
31518
  var calculatedImageHeight = React.useMemo(function () {
31517
- return ((metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) || 0) / (((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) || 0) / 400);
31519
+ if (!(metadata !== null && metadata !== void 0 && metadata.imageWidth)) {
31520
+ return 0;
31521
+ }
31522
+ return (metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) / ((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) / 400);
31518
31523
  }, [metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth, metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight]);
31519
31524
  return /*#__PURE__*/React__default.createElement(OGMetadataContainer, {
31520
31525
  showOGMetadata: !!showOGMetadata
@@ -31523,40 +31528,47 @@ var OGMetadata = function OGMetadata(_ref) {
31523
31528
  window.open(attachment === null || attachment === void 0 ? void 0 : attachment.url, '_blank');
31524
31529
  },
31525
31530
  style: {
31526
- width: '400px'
31531
+ width: showOGMetadata ? '400px' : 'auto'
31527
31532
  }
31528
31533
  }, /*#__PURE__*/React__default.createElement(ImageContainer, {
31529
31534
  showOGMetadata: !!showOGMetadata && !imageLoadError,
31530
31535
  containerWidth: 400,
31531
- height: calculatedImageHeight,
31536
+ containerHeight: calculatedImageHeight,
31532
31537
  shouldAnimate: shouldAnimate
31533
- }, metadata !== null && metadata !== void 0 && (_metadata$og5 = metadata.og) !== null && _metadata$og5 !== void 0 && (_metadata$og5$image = _metadata$og5.image) !== null && _metadata$og5$image !== void 0 && (_metadata$og5$image$ = _metadata$og5$image[0]) !== null && _metadata$og5$image$ !== void 0 && _metadata$og5$image$.url && !imageLoadError ? (/*#__PURE__*/React__default.createElement(Img, {
31534
- src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og6 = metadata.og) === null || _metadata$og6 === void 0 ? void 0 : (_metadata$og6$image = _metadata$og6.image) === null || _metadata$og6$image === void 0 ? void 0 : (_metadata$og6$image$ = _metadata$og6$image[0]) === null || _metadata$og6$image$ === void 0 ? void 0 : _metadata$og6$image$.url,
31538
+ }, metadata !== null && metadata !== void 0 && (_metadata$og4 = metadata.og) !== null && _metadata$og4 !== void 0 && (_metadata$og4$image = _metadata$og4.image) !== null && _metadata$og4$image !== void 0 && (_metadata$og4$image$ = _metadata$og4$image[0]) !== null && _metadata$og4$image$ !== void 0 && _metadata$og4$image$.url && !imageLoadError ? (/*#__PURE__*/React__default.createElement(Img, {
31539
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og5 = metadata.og) === null || _metadata$og5 === void 0 ? void 0 : (_metadata$og5$image = _metadata$og5.image) === null || _metadata$og5$image === void 0 ? void 0 : (_metadata$og5$image$ = _metadata$og5$image[0]) === null || _metadata$og5$image$ === void 0 ? void 0 : _metadata$og5$image$.url,
31535
31540
  alt: 'OG metadata image',
31536
31541
  imageWidth: 400,
31537
- height: calculatedImageHeight,
31542
+ imageHeight: calculatedImageHeight,
31538
31543
  shouldAnimate: shouldAnimate
31539
31544
  })) : null), showOGMetadata ? (/*#__PURE__*/React__default.createElement(OGText, {
31540
31545
  shouldAnimate: shouldAnimate
31541
31546
  }, /*#__PURE__*/React__default.createElement(Url, {
31542
31547
  maxWidth: 400,
31543
31548
  shouldAnimate: shouldAnimate
31544
- }, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && _metadata$og7.title ? (/*#__PURE__*/React__default.createElement(Title, {
31549
+ }, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og6 = metadata.og) !== null && _metadata$og6 !== void 0 && _metadata$og6.title ? (/*#__PURE__*/React__default.createElement(Title, {
31545
31550
  maxWidth: 400,
31546
31551
  shouldAnimate: shouldAnimate
31547
- }, metadata !== null && metadata !== void 0 && (_metadata$og8 = metadata.og) !== null && _metadata$og8 !== void 0 && (_metadata$og8$favicon = _metadata$og8.favicon) !== null && _metadata$og8$favicon !== void 0 && _metadata$og8$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
31552
+ }, metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && (_metadata$og7$favicon = _metadata$og7.favicon) !== null && _metadata$og7$favicon !== void 0 && _metadata$og7$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
31548
31553
  shouldAnimate: shouldAnimate,
31549
- src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : (_metadata$og9$favicon = _metadata$og9.favicon) === null || _metadata$og9$favicon === void 0 ? void 0 : _metadata$og9$favicon.url,
31554
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og8 = metadata.og) === null || _metadata$og8 === void 0 ? void 0 : (_metadata$og8$favicon = _metadata$og8.favicon) === null || _metadata$og8$favicon === void 0 ? void 0 : _metadata$og8$favicon.url,
31550
31555
  onLoad: function onLoad() {
31551
31556
  return setFaviconLoadError(false);
31552
31557
  },
31553
31558
  onError: function onError() {
31554
- return setFaviconLoadError(true);
31559
+ dispatch(updateOGMetadataAC(attachment === null || attachment === void 0 ? void 0 : attachment.url, _extends({}, metadata, {
31560
+ og: _extends({}, metadata === null || metadata === void 0 ? void 0 : metadata.og, {
31561
+ favicon: {
31562
+ url: ''
31563
+ }
31564
+ })
31565
+ })));
31566
+ setFaviconLoadError(true);
31555
31567
  }
31556
- })) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og0 = metadata.og) === null || _metadata$og0 === void 0 ? void 0 : _metadata$og0.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og1 = metadata.og) !== null && _metadata$og1 !== void 0 && _metadata$og1.description ? (/*#__PURE__*/React__default.createElement(Desc, {
31568
+ })) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : _metadata$og9.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og0 = metadata.og) !== null && _metadata$og0 !== void 0 && _metadata$og0.description ? (/*#__PURE__*/React__default.createElement(Desc, {
31557
31569
  maxWidth: 400,
31558
31570
  shouldAnimate: shouldAnimate
31559
- }, metadata === null || metadata === void 0 ? void 0 : (_metadata$og10 = metadata.og) === null || _metadata$og10 === void 0 ? void 0 : _metadata$og10.description)) : null)) : null));
31571
+ }, metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : _metadata$og1.description)) : null)) : null));
31560
31572
  };
31561
31573
  var OGMetadataContainer = styled__default.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n min-width: inherit;\n max-width: inherit;\n display: grid;\n grid-template-columns: 1fr;\n background-color: rgba(0, 0, 0, 0.034);\n border-radius: 6px;\n margin-bottom: 0.4rem;\n margin: 0 auto;\n margin-bottom: ", ";\n &:hover {\n background-color: rgba(0, 0, 0, 0.1);\n cursor: pointer;\n }\n"])), function (_ref2) {
31562
31574
  var showOGMetadata = _ref2.showOGMetadata;
@@ -31566,15 +31578,17 @@ var ImageContainer = styled__default.div(_templateObject2$v || (_templateObject2
31566
31578
  var containerWidth = _ref3.containerWidth;
31567
31579
  return containerWidth ? "\n max-width: " + (containerWidth + "px") + ";\n " : "\n max-width: 100%;\n width: 100%;\n ";
31568
31580
  }, function (_ref4) {
31569
- var height = _ref4.height,
31581
+ var containerHeight = _ref4.containerHeight,
31570
31582
  showOGMetadata = _ref4.showOGMetadata;
31571
- return height ? "\n max-height: " + (height + "px") + ";\n height: " + (showOGMetadata ? height + "px" : '0') + ";\n " : "\n max-height: 200px;\n height: " + (showOGMetadata ? '200px' : '0') + ";\n ";
31583
+ return containerHeight ? "\n max-height: " + (containerHeight + "px") + ";\n height: " + (showOGMetadata ? containerHeight + "px" : '0') + ";\n " : "\n height: 0;\n ";
31572
31584
  }, function (_ref5) {
31573
- var showOGMetadata = _ref5.showOGMetadata;
31574
- return showOGMetadata ? 1 : 0;
31585
+ var showOGMetadata = _ref5.showOGMetadata,
31586
+ containerHeight = _ref5.containerHeight;
31587
+ return showOGMetadata && containerHeight ? 1 : 0;
31575
31588
  }, function (_ref6) {
31576
- var showOGMetadata = _ref6.showOGMetadata;
31577
- return showOGMetadata ? '4px' : '0';
31589
+ var showOGMetadata = _ref6.showOGMetadata,
31590
+ containerHeight = _ref6.containerHeight;
31591
+ return showOGMetadata && containerHeight ? '4px' : '0';
31578
31592
  }, function (_ref7) {
31579
31593
  var shouldAnimate = _ref7.shouldAnimate;
31580
31594
  return shouldAnimate && "\n transition: height 0.2s ease;\n ";
@@ -31604,12 +31618,12 @@ var Desc = styled__default.p(_templateObject6$f || (_templateObject6$f = _tagged
31604
31618
  var shouldAnimate = _ref12.shouldAnimate;
31605
31619
  return shouldAnimate && "\n transition: all 0.2s ease;\n ";
31606
31620
  });
31607
- var Img = styled__default.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n object-fit: cover;\n ", "\n"])), function (_ref13) {
31621
+ var Img = styled__default.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n object-fit: cover;\n ", "\n"])), function (_ref13) {
31608
31622
  var imageWidth = _ref13.imageWidth;
31609
31623
  return imageWidth && "\n max-width: " + (imageWidth + "px") + ";\n width: " + ("calc(" + imageWidth + "px - 8px)") + ";\n ";
31610
31624
  }, function (_ref14) {
31611
- var height = _ref14.height;
31612
- return height && "\n max-height: " + (height + "px") + ";\n min-height: " + (height + "px") + ";\n height: " + (height + "px") + ";\n ";
31625
+ var imageHeight = _ref14.imageHeight;
31626
+ return imageHeight && "\n max-height: " + (imageHeight + "px") + ";\n min-height: " + (imageHeight + "px") + ";\n height: " + (imageHeight + "px") + ";\n ";
31613
31627
  }, function (_ref15) {
31614
31628
  var shouldAnimate = _ref15.shouldAnimate;
31615
31629
  return shouldAnimate && "\n transition: height 0.2s ease;\n ";
@@ -36199,7 +36213,6 @@ var AudioRecord = function AudioRecord(_ref) {
36199
36213
  handleStopRecording();
36200
36214
  if (currentRecordedFile) {
36201
36215
  var _wavesurfer$current2;
36202
- removeAudioRecordingFromMap(currentChannelId);
36203
36216
  dispatch(setChannelDraftMessageIsRemovedAC(currentChannelId));
36204
36217
  setRecordedFile(null);
36205
36218
  setPlayAudio(false);
@@ -36208,8 +36221,9 @@ var AudioRecord = function AudioRecord(_ref) {
36208
36221
  }
36209
36222
  } else {
36210
36223
  shouldDraw = false;
36211
- recorder.stop();
36224
+ recorder === null || recorder === void 0 ? void 0 : recorder.stop();
36212
36225
  }
36226
+ removeAudioRecordingFromMap(currentChannelId);
36213
36227
  setRecordingIsReadyToPlay(false);
36214
36228
  setStartRecording(false);
36215
36229
  setCurrentTime(0);
package/index.modern.js CHANGED
@@ -10328,7 +10328,8 @@ var initialState$1 = {
10328
10328
  attachmentsUploadingProgress: {},
10329
10329
  playingAudioId: null,
10330
10330
  selectedMessagesMap: null,
10331
- oGMetadata: {}
10331
+ oGMetadata: {},
10332
+ attachmentUpdatedMap: {}
10332
10333
  };
10333
10334
  var messageSlice = createSlice({
10334
10335
  name: 'messages',
@@ -10457,39 +10458,8 @@ var messageSlice = createSlice({
10457
10458
  updateMessageAttachment: function updateMessageAttachment(state, action) {
10458
10459
  var _action$payload4 = action.payload,
10459
10460
  url = _action$payload4.url,
10460
- messageId = _action$payload4.messageId,
10461
- params = _action$payload4.params;
10462
- state.activeChannelMessages = state.activeChannelMessages.map(function (message) {
10463
- if (message.id === messageId) {
10464
- for (var index = 0; index < message.attachments.length; index++) {
10465
- var attachment = message.attachments[index];
10466
- if (attachment.url === url) {
10467
- message.attachments[index] = _extends({}, attachment, params);
10468
- }
10469
- }
10470
- }
10471
- if (message.attachments.length) {
10472
- var detachedAttachments = message.attachments.map(function (att) {
10473
- var _att$user, _att$user2;
10474
- return _extends({}, att, {
10475
- user: _extends({}, att.user, {
10476
- metadata: _extends({}, ((_att$user = att.user) === null || _att$user === void 0 ? void 0 : _att$user.metadata) || {}),
10477
- presence: _extends({}, ((_att$user2 = att.user) === null || _att$user2 === void 0 ? void 0 : _att$user2.presence) || {})
10478
- })
10479
- });
10480
- });
10481
- updateMessageOnAllMessages(messageId, {
10482
- attachments: detachedAttachments
10483
- });
10484
- updateMessageOnMap(message.channelId, {
10485
- messageId: messageId,
10486
- params: {
10487
- attachments: detachedAttachments
10488
- }
10489
- });
10490
- }
10491
- return message;
10492
- });
10461
+ attachmentUrl = _action$payload4.attachmentUrl;
10462
+ state.attachmentUpdatedMap[url] = attachmentUrl;
10493
10463
  },
10494
10464
  addReactionToMessage: function addReactionToMessage(state, action) {
10495
10465
  var _action$payload5 = action.payload,
@@ -10677,6 +10647,15 @@ var messageSlice = createSlice({
10677
10647
  url = _action$payload10.url,
10678
10648
  metadata = _action$payload10.metadata;
10679
10649
  state.oGMetadata[url] = metadata;
10650
+ },
10651
+ updateOGMetadata: function updateOGMetadata(state, action) {
10652
+ var _action$payload11 = action.payload,
10653
+ url = _action$payload11.url,
10654
+ metadata = _action$payload11.metadata;
10655
+ if (metadata) {
10656
+ var existing = state.oGMetadata[url];
10657
+ state.oGMetadata[url] = existing ? _extends({}, existing, metadata) : metadata;
10658
+ }
10680
10659
  }
10681
10660
  },
10682
10661
  extraReducers: function extraReducers(builder) {
@@ -10727,7 +10706,8 @@ var _messageSlice$actions = messageSlice.actions,
10727
10706
  addSelectedMessage = _messageSlice$actions.addSelectedMessage,
10728
10707
  removeSelectedMessage = _messageSlice$actions.removeSelectedMessage,
10729
10708
  clearSelectedMessages = _messageSlice$actions.clearSelectedMessages,
10730
- setOGMetadata = _messageSlice$actions.setOGMetadata;
10709
+ setOGMetadata = _messageSlice$actions.setOGMetadata,
10710
+ updateOGMetadata = _messageSlice$actions.updateOGMetadata;
10731
10711
  var MessageReducer = messageSlice.reducer;
10732
10712
 
10733
10713
  var initialState$2 = {
@@ -11813,11 +11793,16 @@ function setOGMetadataAC(url, metadata) {
11813
11793
  metadata: metadata
11814
11794
  });
11815
11795
  }
11816
- function setUpdateMessageAttachmentAC(url, messageId, params) {
11796
+ function updateOGMetadataAC(url, metadata) {
11797
+ return updateOGMetadata({
11798
+ url: url,
11799
+ metadata: metadata
11800
+ });
11801
+ }
11802
+ function setUpdateMessageAttachmentAC(url, attachmentUrl) {
11817
11803
  return updateMessageAttachment({
11818
11804
  url: url,
11819
- messageId: messageId,
11820
- params: params
11805
+ attachmentUrl: attachmentUrl
11821
11806
  });
11822
11807
  }
11823
11808
  function updateMessageAC(messageId, params, addIfNotExists) {
@@ -17128,6 +17113,9 @@ var playingAudioIdSelector = function playingAudioIdSelector(store) {
17128
17113
  var selectedMessagesMapSelector = function selectedMessagesMapSelector(store) {
17129
17114
  return store.MessageReducer.selectedMessagesMap;
17130
17115
  };
17116
+ var attachmentUpdatedMapSelector = function attachmentUpdatedMapSelector(store) {
17117
+ return store.MessageReducer.attachmentUpdatedMap;
17118
+ };
17131
17119
 
17132
17120
  var getFrame = function getFrame(videoSrc, time) {
17133
17121
  try {
@@ -29588,13 +29576,17 @@ var Attachment = function Attachment(_ref) {
29588
29576
  var connectionStatus = useSelector(connectionStatusSelector);
29589
29577
  var theme = useSelector(themeSelector);
29590
29578
  var imageContRef = useRef(null);
29591
- var _useState = useState(!attachment.attachmentUrl),
29579
+ var attachmentUpdatedMap = useSelector(attachmentUpdatedMapSelector) || {};
29580
+ var attachmentUrlFromMap = useMemo(function () {
29581
+ return attachmentUpdatedMap[attachment.url];
29582
+ }, [attachmentUpdatedMap, attachment.url]);
29583
+ var _useState = useState(!attachmentUrlFromMap),
29592
29584
  imageLoading = _useState[0],
29593
29585
  setImageLoading = _useState[1];
29594
29586
  var _useState2 = useState(false),
29595
29587
  downloadingFile = _useState2[0],
29596
29588
  setDownloadingFile = _useState2[1];
29597
- var _useState3 = useState(''),
29589
+ var _useState3 = useState(attachmentUrlFromMap),
29598
29590
  attachmentUrl = _useState3[0],
29599
29591
  setAttachmentUrl = _useState3[1];
29600
29592
  var _useState4 = useState(),
@@ -29618,27 +29610,26 @@ var Attachment = function Attachment(_ref) {
29618
29610
  var fileNameRef = useRef(null);
29619
29611
  var customDownloader = getCustomDownloader();
29620
29612
  var previewFileType = isPreview && attachment.data.type.split('/')[0];
29613
+ var attachmentMetadata = useMemo(function () {
29614
+ return isJSON(attachment.metadata) ? JSON.parse(attachment.metadata) : attachment.metadata;
29615
+ }, [attachment.metadata]);
29621
29616
  var _useMemo = useMemo(function () {
29622
29617
  var attachmentData = null;
29623
- if (attachment.metadata && typeof attachment.metadata === 'string') {
29624
- attachmentData = isJSON(attachment.metadata) ? JSON.parse(attachment.metadata) : attachment.metadata;
29625
- } else if (attachment.metadata && attachment.metadata.szw && attachment.metadata.szh) {
29626
- attachmentData = attachment.metadata;
29627
- }
29618
+ attachmentData = attachmentMetadata;
29628
29619
  return attachmentData && attachmentData.szw && attachmentData.szh ? calculateRenderedImageWidth(attachmentData.szw, attachmentData.szh, attachment.type === attachmentTypes.image ? imageAttachmentMaxWidth : videoAttachmentMaxWidth, attachment.type === attachmentTypes.image ? imageAttachmentMaxHeight || 400 : videoAttachmentMaxHeight) : [];
29629
- }, []),
29620
+ }, [attachmentMetadata]),
29630
29621
  renderWidth = _useMemo[0],
29631
29622
  renderHeight = _useMemo[1];
29632
29623
  var isInUploadingState = attachmentCompilationState[attachment.tid] && (attachmentCompilationState[attachment.tid] === UPLOAD_STATE.UPLOADING || attachmentCompilationState[attachment.tid] === UPLOAD_STATE.PAUSED);
29633
29624
  var attachmentThumb;
29634
29625
  var withPrefix = true;
29635
- if (attachment.type !== attachmentTypes.voice && attachment.type !== attachmentTypes.link && attachment.metadata && attachment.metadata.tmb) {
29626
+ if (attachment.type !== attachmentTypes.voice && attachment.type !== attachmentTypes.link && attachmentMetadata && attachmentMetadata.tmb) {
29636
29627
  try {
29637
- if (attachment.metadata.tmb.length < 70) {
29638
- attachmentThumb = base64ToToDataURL(attachment.metadata.tmb);
29628
+ if (attachmentMetadata.tmb.length < 70) {
29629
+ attachmentThumb = base64ToToDataURL(attachmentMetadata.tmb);
29639
29630
  withPrefix = false;
29640
29631
  } else {
29641
- attachmentThumb = attachment.metadata && attachment.metadata.tmb;
29632
+ attachmentThumb = attachmentMetadata && attachmentMetadata.tmb;
29642
29633
  }
29643
29634
  } catch (e) {
29644
29635
  log.error('error on get attachmentThumb', e);
@@ -29802,9 +29793,7 @@ var Attachment = function Attachment(_ref) {
29802
29793
  if (attachment.type === attachmentTypes.image && !isPreview) {
29803
29794
  if (cachedUrl) {
29804
29795
  setAttachmentUrl(cachedUrl);
29805
- dispatch(setUpdateMessageAttachmentAC(attachment.url, attachment.messageId, {
29806
- attachmentUrl: cachedUrl
29807
- }));
29796
+ dispatch(setUpdateMessageAttachmentAC(attachment.url, cachedUrl));
29808
29797
  setIsCached(true);
29809
29798
  } else {
29810
29799
  setIsCached(false);
@@ -31377,7 +31366,7 @@ var validateUrl = function validateUrl(url) {
31377
31366
  }
31378
31367
  };
31379
31368
  var OGMetadata = function OGMetadata(_ref) {
31380
- var _metadata$og5, _metadata$og5$image, _metadata$og5$image$, _metadata$og6, _metadata$og6$image, _metadata$og6$image$, _metadata$og7, _metadata$og8, _metadata$og8$favicon, _metadata$og9, _metadata$og9$favicon, _metadata$og0, _metadata$og1, _metadata$og10;
31369
+ var _metadata$og4, _metadata$og4$image, _metadata$og4$image$, _metadata$og5, _metadata$og5$image, _metadata$og5$image$, _metadata$og6, _metadata$og7, _metadata$og7$favicon, _metadata$og8, _metadata$og8$favicon, _metadata$og9, _metadata$og0, _metadata$og1;
31381
31370
  var attachments = _ref.attachments,
31382
31371
  state = _ref.state;
31383
31372
  var dispatch = useDispatch();
@@ -31411,47 +31400,61 @@ var OGMetadata = function OGMetadata(_ref) {
31411
31400
  var ogMetadataQueryBuilder = useCallback(function (url) {
31412
31401
  try {
31413
31402
  var client = getClient();
31414
- var _temp2 = function () {
31403
+ var _temp3 = function () {
31415
31404
  if (client) {
31416
- var _temp = _catch(function () {
31405
+ var _temp2 = _catch(function () {
31417
31406
  var queryBuilder = new client.MessageLinkOGQueryBuilder(url);
31418
31407
  return Promise.resolve(queryBuilder.build()).then(function (query) {
31419
31408
  return Promise.resolve(query.loadOGData()).then(function (metadata) {
31420
31409
  var _metadata$og, _metadata$og$image, _metadata$og$image$;
31421
31410
  var image = new Image();
31422
31411
  image.src = metadata === null || metadata === void 0 ? void 0 : (_metadata$og = metadata.og) === null || _metadata$og === void 0 ? void 0 : (_metadata$og$image = _metadata$og.image) === null || _metadata$og$image === void 0 ? void 0 : (_metadata$og$image$ = _metadata$og$image[0]) === null || _metadata$og$image$ === void 0 ? void 0 : _metadata$og$image$.url;
31423
- if (image.src) {
31424
- image.onload = function () {
31425
- try {
31426
- var imageWidth = image.width;
31427
- var imageHeight = image.height;
31428
- return Promise.resolve(storeMetadata(url, _extends({}, metadata, {
31429
- imageWidth: imageWidth,
31430
- imageHeight: imageHeight
31431
- }))).then(function () {
31432
- handleMetadata(_extends({}, metadata, {
31412
+ var _temp = function () {
31413
+ if (image.src) {
31414
+ image.onload = function () {
31415
+ try {
31416
+ var imageWidth = image.width;
31417
+ var imageHeight = image.height;
31418
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata, {
31433
31419
  imageWidth: imageWidth,
31434
31420
  imageHeight: imageHeight
31435
- }));
31436
- });
31437
- } catch (e) {
31438
- return Promise.reject(e);
31439
- }
31440
- };
31441
- image.onerror = function () {
31442
- setImageLoadError(true);
31443
- };
31444
- }
31421
+ }))).then(function () {
31422
+ handleMetadata(_extends({}, metadata, {
31423
+ imageWidth: imageWidth,
31424
+ imageHeight: imageHeight
31425
+ }));
31426
+ });
31427
+ } catch (e) {
31428
+ return Promise.reject(e);
31429
+ }
31430
+ };
31431
+ image.onerror = function () {
31432
+ try {
31433
+ setImageLoadError(true);
31434
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata))).then(function () {
31435
+ handleMetadata(_extends({}, metadata));
31436
+ });
31437
+ } catch (e) {
31438
+ return Promise.reject(e);
31439
+ }
31440
+ };
31441
+ } else {
31442
+ return Promise.resolve(storeMetadata(url, _extends({}, metadata))).then(function () {
31443
+ handleMetadata(_extends({}, metadata));
31444
+ });
31445
+ }
31446
+ }();
31447
+ if (_temp && _temp.then) return _temp.then(function () {});
31445
31448
  });
31446
31449
  });
31447
31450
  }, function () {
31448
31451
  console.log('Failed to fetch OG metadata');
31449
31452
  handleMetadata(null);
31450
31453
  });
31451
- if (_temp && _temp.then) return _temp.then(function () {});
31454
+ if (_temp2 && _temp2.then) return _temp2.then(function () {});
31452
31455
  }
31453
31456
  }();
31454
- return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {
31457
+ return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {
31455
31458
  return null;
31456
31459
  }) : null);
31457
31460
  } catch (e) {
@@ -31467,9 +31470,8 @@ var OGMetadata = function OGMetadata(_ref) {
31467
31470
  try {
31468
31471
  if (cachedMetadata) {
31469
31472
  handleMetadata(cachedMetadata);
31470
- } else {
31471
- ogMetadataQueryBuilder(url);
31472
31473
  }
31474
+ ogMetadataQueryBuilder(url);
31473
31475
  return Promise.resolve();
31474
31476
  } catch (e) {
31475
31477
  return Promise.reject(e);
@@ -31489,11 +31491,14 @@ var OGMetadata = function OGMetadata(_ref) {
31489
31491
  return url;
31490
31492
  }, [attachment === null || attachment === void 0 ? void 0 : attachment.url]);
31491
31493
  var showOGMetadata = useMemo(function () {
31492
- var _metadata$og2, _metadata$og3, _metadata$og3$image, _metadata$og3$image$, _metadata$og4;
31493
- return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : (_metadata$og3$image = _metadata$og3.image) === null || _metadata$og3$image === void 0 ? void 0 : (_metadata$og3$image$ = _metadata$og3$image[0]) === null || _metadata$og3$image$ === void 0 ? void 0 : _metadata$og3$image$.url) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og4 = metadata.og) === null || _metadata$og4 === void 0 ? void 0 : _metadata$og4.description) && metadata;
31494
+ var _metadata$og2, _metadata$og3;
31495
+ return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : _metadata$og2.title) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : _metadata$og3.description) && metadata;
31494
31496
  }, [state, metadata]);
31495
31497
  var calculatedImageHeight = useMemo(function () {
31496
- return ((metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) || 0) / (((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) || 0) / 400);
31498
+ if (!(metadata !== null && metadata !== void 0 && metadata.imageWidth)) {
31499
+ return 0;
31500
+ }
31501
+ return (metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight) / ((metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth) / 400);
31497
31502
  }, [metadata === null || metadata === void 0 ? void 0 : metadata.imageWidth, metadata === null || metadata === void 0 ? void 0 : metadata.imageHeight]);
31498
31503
  return /*#__PURE__*/React__default.createElement(OGMetadataContainer, {
31499
31504
  showOGMetadata: !!showOGMetadata
@@ -31502,40 +31507,47 @@ var OGMetadata = function OGMetadata(_ref) {
31502
31507
  window.open(attachment === null || attachment === void 0 ? void 0 : attachment.url, '_blank');
31503
31508
  },
31504
31509
  style: {
31505
- width: '400px'
31510
+ width: showOGMetadata ? '400px' : 'auto'
31506
31511
  }
31507
31512
  }, /*#__PURE__*/React__default.createElement(ImageContainer, {
31508
31513
  showOGMetadata: !!showOGMetadata && !imageLoadError,
31509
31514
  containerWidth: 400,
31510
- height: calculatedImageHeight,
31515
+ containerHeight: calculatedImageHeight,
31511
31516
  shouldAnimate: shouldAnimate
31512
- }, metadata !== null && metadata !== void 0 && (_metadata$og5 = metadata.og) !== null && _metadata$og5 !== void 0 && (_metadata$og5$image = _metadata$og5.image) !== null && _metadata$og5$image !== void 0 && (_metadata$og5$image$ = _metadata$og5$image[0]) !== null && _metadata$og5$image$ !== void 0 && _metadata$og5$image$.url && !imageLoadError ? (/*#__PURE__*/React__default.createElement(Img, {
31513
- src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og6 = metadata.og) === null || _metadata$og6 === void 0 ? void 0 : (_metadata$og6$image = _metadata$og6.image) === null || _metadata$og6$image === void 0 ? void 0 : (_metadata$og6$image$ = _metadata$og6$image[0]) === null || _metadata$og6$image$ === void 0 ? void 0 : _metadata$og6$image$.url,
31517
+ }, metadata !== null && metadata !== void 0 && (_metadata$og4 = metadata.og) !== null && _metadata$og4 !== void 0 && (_metadata$og4$image = _metadata$og4.image) !== null && _metadata$og4$image !== void 0 && (_metadata$og4$image$ = _metadata$og4$image[0]) !== null && _metadata$og4$image$ !== void 0 && _metadata$og4$image$.url && !imageLoadError ? (/*#__PURE__*/React__default.createElement(Img, {
31518
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og5 = metadata.og) === null || _metadata$og5 === void 0 ? void 0 : (_metadata$og5$image = _metadata$og5.image) === null || _metadata$og5$image === void 0 ? void 0 : (_metadata$og5$image$ = _metadata$og5$image[0]) === null || _metadata$og5$image$ === void 0 ? void 0 : _metadata$og5$image$.url,
31514
31519
  alt: 'OG metadata image',
31515
31520
  imageWidth: 400,
31516
- height: calculatedImageHeight,
31521
+ imageHeight: calculatedImageHeight,
31517
31522
  shouldAnimate: shouldAnimate
31518
31523
  })) : null), showOGMetadata ? (/*#__PURE__*/React__default.createElement(OGText, {
31519
31524
  shouldAnimate: shouldAnimate
31520
31525
  }, /*#__PURE__*/React__default.createElement(Url, {
31521
31526
  maxWidth: 400,
31522
31527
  shouldAnimate: shouldAnimate
31523
- }, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && _metadata$og7.title ? (/*#__PURE__*/React__default.createElement(Title, {
31528
+ }, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og6 = metadata.og) !== null && _metadata$og6 !== void 0 && _metadata$og6.title ? (/*#__PURE__*/React__default.createElement(Title, {
31524
31529
  maxWidth: 400,
31525
31530
  shouldAnimate: shouldAnimate
31526
- }, metadata !== null && metadata !== void 0 && (_metadata$og8 = metadata.og) !== null && _metadata$og8 !== void 0 && (_metadata$og8$favicon = _metadata$og8.favicon) !== null && _metadata$og8$favicon !== void 0 && _metadata$og8$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
31531
+ }, metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && (_metadata$og7$favicon = _metadata$og7.favicon) !== null && _metadata$og7$favicon !== void 0 && _metadata$og7$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
31527
31532
  shouldAnimate: shouldAnimate,
31528
- src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : (_metadata$og9$favicon = _metadata$og9.favicon) === null || _metadata$og9$favicon === void 0 ? void 0 : _metadata$og9$favicon.url,
31533
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og8 = metadata.og) === null || _metadata$og8 === void 0 ? void 0 : (_metadata$og8$favicon = _metadata$og8.favicon) === null || _metadata$og8$favicon === void 0 ? void 0 : _metadata$og8$favicon.url,
31529
31534
  onLoad: function onLoad() {
31530
31535
  return setFaviconLoadError(false);
31531
31536
  },
31532
31537
  onError: function onError() {
31533
- return setFaviconLoadError(true);
31538
+ dispatch(updateOGMetadataAC(attachment === null || attachment === void 0 ? void 0 : attachment.url, _extends({}, metadata, {
31539
+ og: _extends({}, metadata === null || metadata === void 0 ? void 0 : metadata.og, {
31540
+ favicon: {
31541
+ url: ''
31542
+ }
31543
+ })
31544
+ })));
31545
+ setFaviconLoadError(true);
31534
31546
  }
31535
- })) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og0 = metadata.og) === null || _metadata$og0 === void 0 ? void 0 : _metadata$og0.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og1 = metadata.og) !== null && _metadata$og1 !== void 0 && _metadata$og1.description ? (/*#__PURE__*/React__default.createElement(Desc, {
31547
+ })) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og9 = metadata.og) === null || _metadata$og9 === void 0 ? void 0 : _metadata$og9.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og0 = metadata.og) !== null && _metadata$og0 !== void 0 && _metadata$og0.description ? (/*#__PURE__*/React__default.createElement(Desc, {
31536
31548
  maxWidth: 400,
31537
31549
  shouldAnimate: shouldAnimate
31538
- }, metadata === null || metadata === void 0 ? void 0 : (_metadata$og10 = metadata.og) === null || _metadata$og10 === void 0 ? void 0 : _metadata$og10.description)) : null)) : null));
31550
+ }, metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : _metadata$og1.description)) : null)) : null));
31539
31551
  };
31540
31552
  var OGMetadataContainer = styled.div(_templateObject$A || (_templateObject$A = _taggedTemplateLiteralLoose(["\n min-width: inherit;\n max-width: inherit;\n display: grid;\n grid-template-columns: 1fr;\n background-color: rgba(0, 0, 0, 0.034);\n border-radius: 6px;\n margin-bottom: 0.4rem;\n margin: 0 auto;\n margin-bottom: ", ";\n &:hover {\n background-color: rgba(0, 0, 0, 0.1);\n cursor: pointer;\n }\n"])), function (_ref2) {
31541
31553
  var showOGMetadata = _ref2.showOGMetadata;
@@ -31545,15 +31557,17 @@ var ImageContainer = styled.div(_templateObject2$v || (_templateObject2$v = _tag
31545
31557
  var containerWidth = _ref3.containerWidth;
31546
31558
  return containerWidth ? "\n max-width: " + (containerWidth + "px") + ";\n " : "\n max-width: 100%;\n width: 100%;\n ";
31547
31559
  }, function (_ref4) {
31548
- var height = _ref4.height,
31560
+ var containerHeight = _ref4.containerHeight,
31549
31561
  showOGMetadata = _ref4.showOGMetadata;
31550
- return height ? "\n max-height: " + (height + "px") + ";\n height: " + (showOGMetadata ? height + "px" : '0') + ";\n " : "\n max-height: 200px;\n height: " + (showOGMetadata ? '200px' : '0') + ";\n ";
31562
+ return containerHeight ? "\n max-height: " + (containerHeight + "px") + ";\n height: " + (showOGMetadata ? containerHeight + "px" : '0') + ";\n " : "\n height: 0;\n ";
31551
31563
  }, function (_ref5) {
31552
- var showOGMetadata = _ref5.showOGMetadata;
31553
- return showOGMetadata ? 1 : 0;
31564
+ var showOGMetadata = _ref5.showOGMetadata,
31565
+ containerHeight = _ref5.containerHeight;
31566
+ return showOGMetadata && containerHeight ? 1 : 0;
31554
31567
  }, function (_ref6) {
31555
- var showOGMetadata = _ref6.showOGMetadata;
31556
- return showOGMetadata ? '4px' : '0';
31568
+ var showOGMetadata = _ref6.showOGMetadata,
31569
+ containerHeight = _ref6.containerHeight;
31570
+ return showOGMetadata && containerHeight ? '4px' : '0';
31557
31571
  }, function (_ref7) {
31558
31572
  var shouldAnimate = _ref7.shouldAnimate;
31559
31573
  return shouldAnimate && "\n transition: height 0.2s ease;\n ";
@@ -31583,12 +31597,12 @@ var Desc = styled.p(_templateObject6$f || (_templateObject6$f = _taggedTemplateL
31583
31597
  var shouldAnimate = _ref12.shouldAnimate;
31584
31598
  return shouldAnimate && "\n transition: all 0.2s ease;\n ";
31585
31599
  });
31586
- var Img = styled.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n object-fit: cover;\n ", "\n"])), function (_ref13) {
31600
+ var Img = styled.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n\n object-fit: cover;\n ", "\n"])), function (_ref13) {
31587
31601
  var imageWidth = _ref13.imageWidth;
31588
31602
  return imageWidth && "\n max-width: " + (imageWidth + "px") + ";\n width: " + ("calc(" + imageWidth + "px - 8px)") + ";\n ";
31589
31603
  }, function (_ref14) {
31590
- var height = _ref14.height;
31591
- return height && "\n max-height: " + (height + "px") + ";\n min-height: " + (height + "px") + ";\n height: " + (height + "px") + ";\n ";
31604
+ var imageHeight = _ref14.imageHeight;
31605
+ return imageHeight && "\n max-height: " + (imageHeight + "px") + ";\n min-height: " + (imageHeight + "px") + ";\n height: " + (imageHeight + "px") + ";\n ";
31592
31606
  }, function (_ref15) {
31593
31607
  var shouldAnimate = _ref15.shouldAnimate;
31594
31608
  return shouldAnimate && "\n transition: height 0.2s ease;\n ";
@@ -36178,7 +36192,6 @@ var AudioRecord = function AudioRecord(_ref) {
36178
36192
  handleStopRecording();
36179
36193
  if (currentRecordedFile) {
36180
36194
  var _wavesurfer$current2;
36181
- removeAudioRecordingFromMap(currentChannelId);
36182
36195
  dispatch(setChannelDraftMessageIsRemovedAC(currentChannelId));
36183
36196
  setRecordedFile(null);
36184
36197
  setPlayAudio(false);
@@ -36187,8 +36200,9 @@ var AudioRecord = function AudioRecord(_ref) {
36187
36200
  }
36188
36201
  } else {
36189
36202
  shouldDraw = false;
36190
- recorder.stop();
36203
+ recorder === null || recorder === void 0 ? void 0 : recorder.stop();
36191
36204
  }
36205
+ removeAudioRecordingFromMap(currentChannelId);
36192
36206
  setRecordingIsReadyToPlay(false);
36193
36207
  setStartRecording(false);
36194
36208
  setCurrentTime(0);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.7.2-beta.2",
3
+ "version": "1.7.2-beta.3",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",