sceyt-chat-react-uikit 1.7.1-beta.8 → 1.7.1

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 (6) hide show
  1. package/components/Channel/index.d.ts +22 -1
  2. package/components/ChannelList/ChannelSearch/index.d.ts +1 -0
  3. package/components/ChannelList/index.d.ts +6 -1
  4. package/index.js +718 -413
  5. package/index.modern.js +718 -413
  6. package/package.json +1 -1
package/index.modern.js CHANGED
@@ -9070,7 +9070,7 @@ function updateChannelLastMessageOnAllChannels(channelId, message) {
9070
9070
  var updateChannel = allChannels.find(function (chan) {
9071
9071
  return chan.id === channelId;
9072
9072
  });
9073
- if (message.state === 'Deleted' || message.state === 'Edited') {
9073
+ if ((message === null || message === void 0 ? void 0 : message.state) === 'Deleted' || (message === null || message === void 0 ? void 0 : message.state) === 'Edited') {
9074
9074
  var _updateChannel;
9075
9075
  if (((_updateChannel = updateChannel) === null || _updateChannel === void 0 ? void 0 : _updateChannel.lastMessage.id) === message.id) {
9076
9076
  allChannels = allChannels.map(function (chan) {
@@ -10319,6 +10319,7 @@ var initialState$1 = {
10319
10319
  attachmentsUploadingState: {},
10320
10320
  scrollToMessage: null,
10321
10321
  scrollToMessageHighlight: true,
10322
+ scrollToMessageBehavior: 'smooth',
10322
10323
  scrollToMentionedMessage: false,
10323
10324
  reactionsList: [],
10324
10325
  reactionsHasNext: true,
@@ -10345,6 +10346,7 @@ var messageSlice = createSlice({
10345
10346
  setScrollToMessage: function setScrollToMessage(state, action) {
10346
10347
  state.scrollToMessage = action.payload.messageId;
10347
10348
  state.scrollToMessageHighlight = action.payload.highlight;
10349
+ state.scrollToMessageBehavior = action.payload.behavior || 'smooth';
10348
10350
  },
10349
10351
  setScrollToMentionedMessage: function setScrollToMentionedMessage(state, action) {
10350
10352
  state.scrollToMentionedMessage = action.payload.isScrollToMentionedMessage;
@@ -10374,7 +10376,7 @@ var messageSlice = createSlice({
10374
10376
  return msg.tid === message.tid || msg.id === message.id;
10375
10377
  });
10376
10378
  });
10377
- if (direction === MESSAGE_LOAD_DIRECTION.PREV) {
10379
+ if (direction === MESSAGE_LOAD_DIRECTION.PREV && newMessagesLength > 0) {
10378
10380
  if (currentMessagesLength + newMessagesLength >= MESSAGES_MAX_LENGTH) {
10379
10381
  var _state$activeChannelM;
10380
10382
  setHasNextCached(true);
@@ -10396,7 +10398,7 @@ var messageSlice = createSlice({
10396
10398
  var _state$activeChannelM3;
10397
10399
  (_state$activeChannelM3 = state.activeChannelMessages).splice.apply(_state$activeChannelM3, [0, 0].concat(messagesIsNotIncludeInActiveChannelMessages));
10398
10400
  }
10399
- } else if (direction === 'next') {
10401
+ } else if (direction === 'next' && newMessagesLength > 0) {
10400
10402
  if (currentMessagesLength >= MESSAGES_MAX_LENGTH) {
10401
10403
  var _state$activeChannelM4;
10402
10404
  setHasPrevCached(true);
@@ -10585,8 +10587,8 @@ var messageSlice = createSlice({
10585
10587
  var _action$payload8 = action.payload,
10586
10588
  uploaded = _action$payload8.uploaded,
10587
10589
  total = _action$payload8.total,
10588
- attachmentId = _action$payload8.attachmentId,
10589
- progress = _action$payload8.progress;
10590
+ attachmentId = _action$payload8.attachmentId;
10591
+ var progress = uploaded / total;
10590
10592
  var updateData = {
10591
10593
  uploaded: uploaded,
10592
10594
  total: total,
@@ -11596,7 +11598,7 @@ function setMessageToEditAC(message) {
11596
11598
  message: message
11597
11599
  });
11598
11600
  }
11599
- function getMessagesAC(channel, loadWithLastMessage, messageId, limit, withDeliveredMessages, highlight) {
11601
+ function getMessagesAC(channel, loadWithLastMessage, messageId, limit, withDeliveredMessages, highlight, behavior) {
11600
11602
  if (highlight === void 0) {
11601
11603
  highlight = true;
11602
11604
  }
@@ -11608,7 +11610,8 @@ function getMessagesAC(channel, loadWithLastMessage, messageId, limit, withDeliv
11608
11610
  messageId: messageId,
11609
11611
  limit: limit,
11610
11612
  withDeliveredMessages: withDeliveredMessages,
11611
- highlight: highlight
11613
+ highlight: highlight,
11614
+ behavior: behavior
11612
11615
  }
11613
11616
  };
11614
11617
  }
@@ -11622,13 +11625,14 @@ function getMessageAC(channelId, messageId, limit) {
11622
11625
  }
11623
11626
  };
11624
11627
  }
11625
- function setScrollToMessagesAC(messageId, highlight) {
11628
+ function setScrollToMessagesAC(messageId, highlight, behavior) {
11626
11629
  if (highlight === void 0) {
11627
11630
  highlight = true;
11628
11631
  }
11629
11632
  return setScrollToMessage({
11630
11633
  messageId: messageId || '',
11631
- highlight: highlight
11634
+ highlight: highlight,
11635
+ behavior: behavior
11632
11636
  });
11633
11637
  }
11634
11638
  function setScrollToMentionedMessageAC(isScrollToMentionedMessage) {
@@ -15161,9 +15165,8 @@ function searchChannels(action) {
15161
15165
  handleChannels = function handleChannels(channels) {
15162
15166
  channels.forEach(function (channel) {
15163
15167
  if (channel.type === DEFAULT_CHANNEL_TYPE.DIRECT) {
15164
- var _channel$metadata;
15165
15168
  channel.metadata = isJSON(channel.metadata) ? JSON.parse(channel.metadata) : channel.metadata;
15166
- var isSelfChannel = (_channel$metadata = channel.metadata) === null || _channel$metadata === void 0 ? void 0 : _channel$metadata.s;
15169
+ var isSelfChannel = channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === SceytChatClient.user.id;
15167
15170
  var directChannelUser = isSelfChannel ? SceytChatClient.user : channel.members.find(function (member) {
15168
15171
  return member.id !== SceytChatClient.user.id;
15169
15172
  });
@@ -15281,9 +15284,8 @@ function getChannelsForForward() {
15281
15284
  return put(channelHasNextAC(channelsData.hasNext, true));
15282
15285
  case 4:
15283
15286
  channelsToAdd = channelsData.channels.filter(function (channel) {
15284
- var _channel$metadata2;
15285
15287
  channel.metadata = isJSON(channel.metadata) ? JSON.parse(channel.metadata) : channel.metadata;
15286
- var isSelfChannel = (_channel$metadata2 = channel.metadata) === null || _channel$metadata2 === void 0 ? void 0 : _channel$metadata2.s;
15288
+ var isSelfChannel = channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === _SceytChatClient.user.id;
15287
15289
  return channel.type === DEFAULT_CHANNEL_TYPE.BROADCAST || channel.type === DEFAULT_CHANNEL_TYPE.PUBLIC ? channel.userRole === 'admin' || channel.userRole === 'owner' : channel.type === DEFAULT_CHANNEL_TYPE.DIRECT ? isSelfChannel || channel.members.find(function (member) {
15288
15290
  return member.id && member.id !== _SceytChatClient.user.id;
15289
15291
  }) : true;
@@ -15350,9 +15352,8 @@ function searchChannelsForForward(action) {
15350
15352
  handleChannels = function handleChannels(channels) {
15351
15353
  channels.forEach(function (channel) {
15352
15354
  if (channel.type === DEFAULT_CHANNEL_TYPE.DIRECT) {
15353
- var _channel$metadata3;
15354
15355
  channel.metadata = isJSON(channel.metadata) ? JSON.parse(channel.metadata) : channel.metadata;
15355
- var isSelfChannel = (_channel$metadata3 = channel.metadata) === null || _channel$metadata3 === void 0 ? void 0 : _channel$metadata3.s;
15356
+ var isSelfChannel = channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === _SceytChatClient2.user.id;
15356
15357
  var directChannelUser = isSelfChannel ? _SceytChatClient2.user : channel.members.find(function (member) {
15357
15358
  return member.id !== _SceytChatClient2.user.id;
15358
15359
  });
@@ -17092,6 +17093,9 @@ var scrollToMessageSelector = function scrollToMessageSelector(store) {
17092
17093
  var scrollToMessageHighlightSelector = function scrollToMessageHighlightSelector(store) {
17093
17094
  return store.MessageReducer.scrollToMessageHighlight;
17094
17095
  };
17096
+ var scrollToMessageBehaviorSelector = function scrollToMessageBehaviorSelector(store) {
17097
+ return store.MessageReducer.scrollToMessageBehavior;
17098
+ };
17095
17099
  var reactionsListSelector = function reactionsListSelector(store) {
17096
17100
  return store.MessageReducer.reactionsList;
17097
17101
  };
@@ -18485,7 +18489,7 @@ function editMessage(action) {
18485
18489
  }, _marked6$1, null, [[0, 5]]);
18486
18490
  }
18487
18491
  function getMessagesQuery(action) {
18488
- var _action$payload, channel, loadWithLastMessage, messageId, limit, withDeliveredMessages, highlight, SceytChatClient, messageQueryBuilder, messageQuery, cachedMessages, result, allMessages, havLastMessage, secondResult, sentMessages, messagesMap, filteredSentMessages, _allMessages, messageIndex, maxLengthPart, _secondResult, thirdResult, _secondResult2, _thirdResult, _secondResult3, _secondResult4, updatedMessages, pendingMessages, _messagesMap, filteredPendingMessages, _t9;
18492
+ var _action$payload, channel, loadWithLastMessage, messageId, limit, withDeliveredMessages, highlight, behavior, SceytChatClient, messageQueryBuilder, messageQuery, cachedMessages, result, allMessages, havLastMessage, secondResult, sentMessages, messagesMap, filteredSentMessages, _allMessages, messageIndex, maxLengthPart, _secondResult, thirdResult, _secondResult2, _thirdResult, _secondResult3, _secondResult4, updatedMessages, pendingMessages, _messagesMap, filteredPendingMessages, _t9;
18489
18493
  return _regenerator().w(function (_context9) {
18490
18494
  while (1) switch (_context9.p = _context9.n) {
18491
18495
  case 0:
@@ -18493,9 +18497,9 @@ function getMessagesQuery(action) {
18493
18497
  _context9.n = 1;
18494
18498
  return put(setMessagesLoadingStateAC(LOADING_STATE.LOADING));
18495
18499
  case 1:
18496
- _action$payload = action.payload, channel = _action$payload.channel, loadWithLastMessage = _action$payload.loadWithLastMessage, messageId = _action$payload.messageId, limit = _action$payload.limit, withDeliveredMessages = _action$payload.withDeliveredMessages, highlight = _action$payload.highlight;
18500
+ _action$payload = action.payload, channel = _action$payload.channel, loadWithLastMessage = _action$payload.loadWithLastMessage, messageId = _action$payload.messageId, limit = _action$payload.limit, withDeliveredMessages = _action$payload.withDeliveredMessages, highlight = _action$payload.highlight, behavior = _action$payload.behavior;
18497
18501
  if (!(channel.id && !channel.isMockChannel)) {
18498
- _context9.n = 47;
18502
+ _context9.n = 48;
18499
18503
  break;
18500
18504
  }
18501
18505
  SceytChatClient = getClient();
@@ -18523,6 +18527,7 @@ function getMessagesQuery(action) {
18523
18527
  break;
18524
18528
  }
18525
18529
  setHasPrevCached(false);
18530
+ setMessagesToMap(channel.id, []);
18526
18531
  setAllMessages([]);
18527
18532
  _context9.n = 3;
18528
18533
  return call(messageQuery.loadPreviousMessageId, '0');
@@ -18579,13 +18584,13 @@ function getMessagesQuery(action) {
18579
18584
  break;
18580
18585
  }
18581
18586
  _context9.n = 12;
18582
- return put(setScrollToMessagesAC(messageId, highlight));
18587
+ return put(setScrollToMessagesAC(messageId, highlight, behavior));
18583
18588
  case 12:
18584
- _context9.n = 45;
18589
+ _context9.n = 46;
18585
18590
  break;
18586
18591
  case 13:
18587
18592
  if (!messageId) {
18588
- _context9.n = 25;
18593
+ _context9.n = 26;
18589
18594
  break;
18590
18595
  }
18591
18596
  _allMessages = getAllMessages();
@@ -18594,7 +18599,7 @@ function getMessagesQuery(action) {
18594
18599
  });
18595
18600
  maxLengthPart = MESSAGES_MAX_LENGTH / 2;
18596
18601
  if (!(messageIndex >= maxLengthPart)) {
18597
- _context9.n = 15;
18602
+ _context9.n = 16;
18598
18603
  break;
18599
18604
  }
18600
18605
  result.messages = _allMessages.slice(messageIndex - maxLengthPart, messageIndex + maxLengthPart);
@@ -18603,151 +18608,160 @@ function getMessagesQuery(action) {
18603
18608
  case 14:
18604
18609
  setHasPrevCached(messageIndex > maxLengthPart);
18605
18610
  setHasNextCached(_allMessages.length > maxLengthPart);
18611
+ _context9.n = 15;
18612
+ return put(setMessagesHasPrevAC(true));
18613
+ case 15:
18606
18614
  _context9.n = 22;
18607
18615
  break;
18608
- case 15:
18616
+ case 16:
18609
18617
  messageQuery.limit = MESSAGES_MAX_LENGTH;
18610
18618
  log.info('load by message id from server ...............', messageId);
18611
- _context9.n = 16;
18619
+ _context9.n = 17;
18612
18620
  return call(messageQuery.loadNearMessageId, messageId);
18613
- case 16:
18621
+ case 17:
18614
18622
  result = _context9.v;
18615
18623
  if (!(result.messages.length === 50)) {
18616
- _context9.n = 19;
18624
+ _context9.n = 20;
18617
18625
  break;
18618
18626
  }
18619
- messageQuery.limit = (MESSAGES_MAX_LENGTH - 50) / 2;
18620
- _context9.n = 17;
18627
+ messageQuery.limit = MESSAGES_MAX_LENGTH - 50;
18628
+ _context9.n = 18;
18621
18629
  return call(messageQuery.loadPreviousMessageId, result.messages[0].id);
18622
- case 17:
18630
+ case 18:
18623
18631
  _secondResult = _context9.v;
18624
18632
  messageQuery.reverse = false;
18625
- _context9.n = 18;
18633
+ _context9.n = 19;
18626
18634
  return call(messageQuery.loadNextMessageId, result.messages[result.messages.length - 1].id);
18627
- case 18:
18635
+ case 19:
18628
18636
  thirdResult = _context9.v;
18629
18637
  result.messages = [].concat(_secondResult.messages, result.messages, thirdResult.messages);
18630
18638
  result.hasNext = _secondResult.hasNext;
18631
18639
  messageQuery.reverse = true;
18632
- case 19:
18633
- log.info('result from server ....... ', result);
18634
18640
  _context9.n = 20;
18635
- return put(setMessagesHasNextAC(true));
18641
+ return put(setMessagesHasPrevAC(_secondResult.hasNext));
18636
18642
  case 20:
18643
+ log.info('result from server ....... ', result);
18637
18644
  _context9.n = 21;
18638
18645
  return put(setMessagesAC(JSON.parse(JSON.stringify(result.messages))));
18639
18646
  case 21:
18647
+ setMessagesToMap(channel.id, result.messages);
18640
18648
  setAllMessages([].concat(result.messages));
18641
18649
  setHasPrevCached(false);
18642
18650
  setHasNextCached(false);
18643
18651
  case 22:
18644
18652
  _context9.n = 23;
18645
- return put(setScrollToMessagesAC(messageId));
18653
+ return put(setMessagesHasNextAC(true));
18646
18654
  case 23:
18647
18655
  _context9.n = 24;
18648
- return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18656
+ return put(setScrollToMessagesAC(messageId, true, behavior));
18649
18657
  case 24:
18650
- _context9.n = 45;
18651
- break;
18658
+ _context9.n = 25;
18659
+ return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18652
18660
  case 25:
18661
+ _context9.n = 46;
18662
+ break;
18663
+ case 26:
18653
18664
  if (!(channel.newMessageCount && channel.lastDisplayedMessageId)) {
18654
- _context9.n = 38;
18665
+ _context9.n = 39;
18655
18666
  break;
18656
18667
  }
18668
+ setMessagesToMap(channel.id, []);
18657
18669
  setAllMessages([]);
18658
18670
  messageQuery.limit = MESSAGES_MAX_LENGTH;
18659
18671
  if (!Number(channel.lastDisplayedMessageId)) {
18660
- _context9.n = 31;
18672
+ _context9.n = 32;
18661
18673
  break;
18662
18674
  }
18663
- _context9.n = 26;
18675
+ _context9.n = 27;
18664
18676
  return call(messageQuery.loadNearMessageId, channel.lastDisplayedMessageId);
18665
- case 26:
18677
+ case 27:
18666
18678
  result = _context9.v;
18667
18679
  if (!(result.messages.length === 50)) {
18668
- _context9.n = 30;
18680
+ _context9.n = 31;
18669
18681
  break;
18670
18682
  }
18671
18683
  messageQuery.limit = channel.newMessageCount > 25 ? (MESSAGES_MAX_LENGTH - 50) / 2 : MESSAGES_MAX_LENGTH - 50;
18672
- _context9.n = 27;
18684
+ _context9.n = 28;
18673
18685
  return call(messageQuery.loadPreviousMessageId, result.messages[0].id);
18674
- case 27:
18686
+ case 28:
18675
18687
  _secondResult2 = _context9.v;
18676
18688
  if (!(channel.newMessageCount > 25)) {
18677
- _context9.n = 29;
18689
+ _context9.n = 30;
18678
18690
  break;
18679
18691
  }
18680
18692
  messageQuery.reverse = false;
18681
- _context9.n = 28;
18693
+ _context9.n = 29;
18682
18694
  return call(messageQuery.loadNextMessageId, result.messages[result.messages.length - 1].id);
18683
- case 28:
18695
+ case 29:
18684
18696
  _thirdResult = _context9.v;
18685
18697
  result.messages = [].concat(_secondResult2.messages, result.messages, _thirdResult.messages);
18686
18698
  messageQuery.reverse = true;
18687
- _context9.n = 30;
18699
+ _context9.n = 31;
18688
18700
  break;
18689
- case 29:
18690
- result.messages = [].concat(_secondResult2.messages, result.messages);
18691
18701
  case 30:
18692
- _context9.n = 34;
18693
- break;
18702
+ result.messages = [].concat(_secondResult2.messages, result.messages);
18694
18703
  case 31:
18695
- _context9.n = 32;
18696
- return call(messageQuery.loadPrevious);
18704
+ _context9.n = 35;
18705
+ break;
18697
18706
  case 32:
18707
+ _context9.n = 33;
18708
+ return call(messageQuery.loadPrevious);
18709
+ case 33:
18698
18710
  result = _context9.v;
18699
18711
  if (!(result.messages.length === 50)) {
18700
- _context9.n = 34;
18712
+ _context9.n = 35;
18701
18713
  break;
18702
18714
  }
18703
18715
  messageQuery.limit = MESSAGES_MAX_LENGTH - 50;
18704
- _context9.n = 33;
18716
+ _context9.n = 34;
18705
18717
  return call(messageQuery.loadPreviousMessageId, result.messages[0].id);
18706
- case 33:
18718
+ case 34:
18707
18719
  _secondResult3 = _context9.v;
18708
18720
  result.messages = [].concat(_secondResult3.messages, result.messages);
18709
18721
  result.hasNext = _secondResult3.hasNext;
18710
- case 34:
18711
- setMessagesToMap(channel.id, result.messages);
18712
- _context9.n = 35;
18713
- return put(setMessagesHasPrevAC(true));
18714
18722
  case 35:
18715
18723
  _context9.n = 36;
18716
- return put(setMessagesHasNextAC(channel.lastMessage && result.messages.length > 0 && channel.lastMessage.id !== result.messages[result.messages.length - 1].id));
18724
+ return put(setMessagesHasPrevAC(true));
18717
18725
  case 36:
18718
- setAllMessages([].concat(result.messages));
18719
18726
  _context9.n = 37;
18720
- return put(setMessagesAC(JSON.parse(JSON.stringify(result.messages))));
18727
+ return put(setMessagesHasNextAC(channel.lastMessage && result.messages.length > 0 && channel.lastMessage.id !== result.messages[result.messages.length - 1].id));
18721
18728
  case 37:
18722
- _context9.n = 45;
18723
- break;
18729
+ setMessagesToMap(channel.id, result.messages);
18730
+ setAllMessages([].concat(result.messages));
18731
+ _context9.n = 38;
18732
+ return put(setMessagesAC(JSON.parse(JSON.stringify(result.messages))));
18724
18733
  case 38:
18734
+ _context9.n = 46;
18735
+ break;
18736
+ case 39:
18737
+ setMessagesToMap(channel.id, []);
18725
18738
  setAllMessages([]);
18726
18739
  if (!(cachedMessages && cachedMessages.length)) {
18727
- _context9.n = 39;
18740
+ _context9.n = 40;
18728
18741
  break;
18729
18742
  }
18743
+ setMessagesToMap(channel.id, []);
18730
18744
  setAllMessages([].concat(cachedMessages));
18731
- _context9.n = 39;
18745
+ _context9.n = 40;
18732
18746
  return put(setMessagesAC(JSON.parse(JSON.stringify(cachedMessages))));
18733
- case 39:
18747
+ case 40:
18734
18748
  log.info('load message from server');
18735
- _context9.n = 40;
18749
+ _context9.n = 41;
18736
18750
  return call(messageQuery.loadPrevious);
18737
- case 40:
18751
+ case 41:
18738
18752
  result = _context9.v;
18739
18753
  if (!(result.messages.length === 50)) {
18740
- _context9.n = 42;
18754
+ _context9.n = 43;
18741
18755
  break;
18742
18756
  }
18743
18757
  messageQuery.limit = MESSAGES_MAX_LENGTH - 50;
18744
- _context9.n = 41;
18758
+ _context9.n = 42;
18745
18759
  return call(messageQuery.loadPreviousMessageId, result.messages[0].id);
18746
- case 41:
18760
+ case 42:
18747
18761
  _secondResult4 = _context9.v;
18748
18762
  result.messages = [].concat(_secondResult4.messages, result.messages);
18749
18763
  result.hasNext = _secondResult4.hasNext;
18750
- case 42:
18764
+ case 43:
18751
18765
  updatedMessages = [];
18752
18766
  result.messages.forEach(function (msg) {
18753
18767
  var updatedMessage = updateMessageOnMap(channel.id, {
@@ -18759,18 +18773,18 @@ function getMessagesQuery(action) {
18759
18773
  });
18760
18774
  setMessagesToMap(channel.id, updatedMessages);
18761
18775
  setAllMessages([].concat(updatedMessages));
18762
- _context9.n = 43;
18763
- return put(setMessagesAC(JSON.parse(JSON.stringify(updatedMessages))));
18764
- case 43:
18765
18776
  _context9.n = 44;
18766
- return put(setMessagesHasPrevAC(result.hasNext));
18777
+ return put(setMessagesAC(JSON.parse(JSON.stringify(updatedMessages))));
18767
18778
  case 44:
18768
18779
  _context9.n = 45;
18769
- return put(setMessagesHasNextAC(false));
18780
+ return put(setMessagesHasPrevAC(result.hasNext));
18770
18781
  case 45:
18782
+ _context9.n = 46;
18783
+ return put(setMessagesHasNextAC(false));
18784
+ case 46:
18771
18785
  pendingMessages = getPendingMessages(channel.id);
18772
18786
  if (!(pendingMessages && pendingMessages.length)) {
18773
- _context9.n = 46;
18787
+ _context9.n = 47;
18774
18788
  break;
18775
18789
  }
18776
18790
  _messagesMap = {};
@@ -18780,38 +18794,38 @@ function getMessagesQuery(action) {
18780
18794
  filteredPendingMessages = pendingMessages.filter(function (msg) {
18781
18795
  return !_messagesMap[msg.tid || ''];
18782
18796
  });
18783
- _context9.n = 46;
18797
+ _context9.n = 47;
18784
18798
  return put(addMessagesAC(filteredPendingMessages, MESSAGE_LOAD_DIRECTION.NEXT));
18785
- case 46:
18786
- _context9.n = 48;
18787
- break;
18788
18799
  case 47:
18800
+ _context9.n = 49;
18801
+ break;
18802
+ case 48:
18789
18803
  if (!channel.isMockChannel) {
18790
- _context9.n = 48;
18804
+ _context9.n = 49;
18791
18805
  break;
18792
18806
  }
18793
- _context9.n = 48;
18807
+ _context9.n = 49;
18794
18808
  return put(setMessagesAC([]));
18795
- case 48:
18796
- _context9.n = 50;
18797
- break;
18798
18809
  case 49:
18799
- _context9.p = 49;
18800
- _t9 = _context9.v;
18801
- log.error('error in message query', _t9);
18810
+ _context9.n = 51;
18811
+ break;
18802
18812
  case 50:
18803
18813
  _context9.p = 50;
18804
- _context9.n = 51;
18805
- return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18814
+ _t9 = _context9.v;
18815
+ log.error('error in message query', _t9);
18806
18816
  case 51:
18807
- return _context9.f(50);
18817
+ _context9.p = 51;
18818
+ _context9.n = 52;
18819
+ return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18808
18820
  case 52:
18821
+ return _context9.f(51);
18822
+ case 53:
18809
18823
  return _context9.a(2);
18810
18824
  }
18811
- }, _marked7$1, null, [[0, 49, 50, 52]]);
18825
+ }, _marked7$1, null, [[0, 50, 51, 53]]);
18812
18826
  }
18813
18827
  function getMessageQuery(action) {
18814
- var payload, channelId, messageId, channel, messages, _t0;
18828
+ var payload, channelId, messageId, channel, messages, fetchedMessage, _t0;
18815
18829
  return _regenerator().w(function (_context0) {
18816
18830
  while (1) switch (_context0.p = _context0.n) {
18817
18831
  case 0:
@@ -18819,34 +18833,53 @@ function getMessageQuery(action) {
18819
18833
  payload = action.payload;
18820
18834
  channelId = payload.channelId, messageId = payload.messageId;
18821
18835
  _context0.n = 1;
18822
- return call(getChannelFromMap, channelId);
18836
+ return call(getChannelFromAllChannels, channelId);
18823
18837
  case 1:
18824
18838
  channel = _context0.v;
18825
- _context0.n = 2;
18826
- return call(channel.getMessagesById, [messageId]);
18839
+ if (channel) {
18840
+ _context0.n = 2;
18841
+ break;
18842
+ }
18843
+ return _context0.a(2);
18827
18844
  case 2:
18828
- messages = _context0.v;
18829
18845
  _context0.n = 3;
18830
- return put(updateMessageAC(messageId, messages[0]));
18846
+ return call(channel.getMessagesById, [messageId]);
18831
18847
  case 3:
18848
+ messages = _context0.v;
18849
+ fetchedMessage = messages && messages[0] ? JSON.parse(JSON.stringify(messages[0])) : null;
18850
+ if (!fetchedMessage) {
18851
+ _context0.n = 6;
18852
+ break;
18853
+ }
18854
+ _context0.n = 4;
18855
+ return put(updateMessageAC(messageId, fetchedMessage));
18856
+ case 4:
18832
18857
  updateMessageOnMap(channel.id, {
18833
18858
  messageId: messageId,
18834
- params: messages[0]
18859
+ params: fetchedMessage
18835
18860
  });
18836
- updateMessageOnAllMessages(messageId, messages[0]);
18837
- _context0.n = 4;
18861
+ updateMessageOnAllMessages(messageId, fetchedMessage);
18862
+ _context0.n = 5;
18838
18863
  return put(setScrollToMessagesAC(messageId, false));
18839
- case 4:
18864
+ case 5:
18865
+ if (!(channel.lastMessage && channel.lastMessage.id === messageId)) {
18866
+ _context0.n = 6;
18867
+ break;
18868
+ }
18869
+ updateChannelLastMessageOnAllChannels(channel.id, fetchedMessage);
18840
18870
  _context0.n = 6;
18871
+ return put(updateChannelLastMessageAC(fetchedMessage, channel));
18872
+ case 6:
18873
+ _context0.n = 8;
18841
18874
  break;
18842
- case 5:
18843
- _context0.p = 5;
18875
+ case 7:
18876
+ _context0.p = 7;
18844
18877
  _t0 = _context0.v;
18845
18878
  log.error('error in message query', _t0);
18846
- case 6:
18879
+ case 8:
18847
18880
  return _context0.a(2);
18848
18881
  }
18849
- }, _marked8$1, null, [[0, 5]]);
18882
+ }, _marked8$1, null, [[0, 7]]);
18850
18883
  }
18851
18884
  function loadMoreMessages(action) {
18852
18885
  var payload, limit, direction, channelId, messageId, hasNext, SceytChatClient, messageQueryBuilder, messageQuery, result, _t1;
@@ -18935,25 +18968,38 @@ function loadMoreMessages(action) {
18935
18968
  _context1.n = 11;
18936
18969
  return put(addMessagesAC(JSON.parse(JSON.stringify(result.messages)), direction));
18937
18970
  case 11:
18938
- _context1.n = 13;
18971
+ _context1.n = 16;
18939
18972
  break;
18940
18973
  case 12:
18941
18974
  _context1.n = 13;
18942
18975
  return put(addMessagesAC([], direction));
18943
18976
  case 13:
18977
+ if (!(direction === MESSAGE_LOAD_DIRECTION.NEXT)) {
18978
+ _context1.n = 15;
18979
+ break;
18980
+ }
18944
18981
  _context1.n = 14;
18945
- return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18982
+ return put(setMessagesHasNextAC(false));
18946
18983
  case 14:
18947
18984
  _context1.n = 16;
18948
18985
  break;
18949
18986
  case 15:
18950
- _context1.p = 15;
18987
+ _context1.n = 16;
18988
+ return put(setMessagesHasPrevAC(false));
18989
+ case 16:
18990
+ _context1.n = 17;
18991
+ return put(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
18992
+ case 17:
18993
+ _context1.n = 19;
18994
+ break;
18995
+ case 18:
18996
+ _context1.p = 18;
18951
18997
  _t1 = _context1.v;
18952
18998
  log.error('error in load more messages', _t1);
18953
- case 16:
18999
+ case 19:
18954
19000
  return _context1.a(2);
18955
19001
  }
18956
- }, _marked9$1, null, [[0, 15]]);
19002
+ }, _marked9$1, null, [[0, 18]]);
18957
19003
  }
18958
19004
  function addReaction(action) {
18959
19005
  var payload, channelId, messageId, key, score, reason, enforceUnique, user, channel, _yield$call, _message2, reaction, channelUpdateParam, _t10;
@@ -19377,7 +19423,7 @@ function MessageSaga() {
19377
19423
  return takeLatest(GET_MESSAGES, getMessagesQuery);
19378
19424
  case 7:
19379
19425
  _context18.n = 8;
19380
- return takeLatest(GET_MESSAGE, getMessageQuery);
19426
+ return takeEvery(GET_MESSAGE, getMessageQuery);
19381
19427
  case 8:
19382
19428
  _context18.n = 9;
19383
19429
  return takeLatest(GET_MESSAGES_ATTACHMENTS, getMessageAttachments);
@@ -20982,6 +21028,50 @@ function SvgAvatar(props) {
20982
21028
  })));
20983
21029
  }
20984
21030
 
21031
+ var ATTACHMENTS_CACHE = 'attachments-cache';
21032
+ var isBrowser = typeof window !== 'undefined';
21033
+ var cacheAvailable;
21034
+ if (isBrowser) {
21035
+ cacheAvailable = 'caches' in window;
21036
+ } else {
21037
+ cacheAvailable = 'caches' in global;
21038
+ }
21039
+ var setAttachmentToCache = function setAttachmentToCache(attachmentUrl, attachmentResponse) {
21040
+ if (cacheAvailable) {
21041
+ caches.open(ATTACHMENTS_CACHE).then(function (cache) {
21042
+ try {
21043
+ cache.put(attachmentUrl, attachmentResponse).then(function () {
21044
+ log.info('Cache success');
21045
+ })["catch"](function (e) {
21046
+ log.info('Error on cache attachment ... ', e);
21047
+ caches["delete"](attachmentUrl);
21048
+ });
21049
+ return Promise.resolve();
21050
+ } catch (e) {
21051
+ return Promise.reject(e);
21052
+ }
21053
+ });
21054
+ }
21055
+ };
21056
+ var getAttachmentUrlFromCache = function getAttachmentUrlFromCache(attachmentUrl) {
21057
+ try {
21058
+ if (!cacheAvailable) {
21059
+ log.error('Cache is not available');
21060
+ return Promise.reject(new Error('Cache not available'));
21061
+ }
21062
+ return Promise.resolve(caches.match(attachmentUrl)).then(function (response) {
21063
+ if (response) {
21064
+ return Promise.resolve(response.blob()).then(URL.createObjectURL);
21065
+ } else {
21066
+ log.info('The image or video is not cached', attachmentUrl);
21067
+ return false;
21068
+ }
21069
+ });
21070
+ } catch (e) {
21071
+ return Promise.reject(e);
21072
+ }
21073
+ };
21074
+
20985
21075
  var _templateObject$3, _templateObject2$3, _templateObject3$2, _templateObject4$2;
20986
21076
  var Avatar = function Avatar(_ref) {
20987
21077
  var image = _ref.image,
@@ -20998,6 +21088,9 @@ var Avatar = function Avatar(_ref) {
20998
21088
  var theme = useSelector(themeSelector);
20999
21089
  var _useColor = useColors(),
21000
21090
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE];
21091
+ var _useState = useState(image || null),
21092
+ resolvedImageSrc = _useState[0],
21093
+ setResolvedImageSrc = _useState[1];
21001
21094
  var isDeletedUserAvatar = !image && !name;
21002
21095
  var avatarText = '';
21003
21096
  if (!image && name) {
@@ -21014,11 +21107,68 @@ var Avatar = function Avatar(_ref) {
21014
21107
  avatarText = _firstCharOfFirstWord ? String.fromCodePoint(_firstCharOfFirstWord) : '';
21015
21108
  }
21016
21109
  }
21110
+ useEffect(function () {
21111
+ var isCancelled = false;
21112
+ if (!image) {
21113
+ setResolvedImageSrc(null);
21114
+ return;
21115
+ }
21116
+ var isHttpUrl = /^https?:\/\//i.test(image);
21117
+ if (!isHttpUrl) {
21118
+ setResolvedImageSrc(image);
21119
+ return;
21120
+ }
21121
+ getAttachmentUrlFromCache(image).then(function (cachedUrl) {
21122
+ try {
21123
+ if (isCancelled) return Promise.resolve();
21124
+ var _temp2 = function () {
21125
+ if (cachedUrl) {
21126
+ setResolvedImageSrc(cachedUrl);
21127
+ } else {
21128
+ var _temp = _catch(function () {
21129
+ return Promise.resolve(fetch(image, {
21130
+ credentials: 'same-origin'
21131
+ })).then(function (response) {
21132
+ setAttachmentToCache(image, response.clone());
21133
+ setResolvedImageSrc(image);
21134
+ });
21135
+ }, function () {
21136
+ setResolvedImageSrc(image);
21137
+ });
21138
+ if (_temp && _temp.then) return _temp.then(function () {});
21139
+ }
21140
+ }();
21141
+ return Promise.resolve(_temp2 && _temp2.then ? _temp2.then(function () {}) : void 0);
21142
+ } catch (e) {
21143
+ return Promise.reject(e);
21144
+ }
21145
+ })["catch"](function () {
21146
+ try {
21147
+ if (isCancelled) return Promise.resolve();
21148
+ var _temp3 = _catch(function () {
21149
+ return Promise.resolve(fetch(image, {
21150
+ credentials: 'same-origin'
21151
+ })).then(function (response) {
21152
+ setAttachmentToCache(image, response.clone());
21153
+ setResolvedImageSrc(image);
21154
+ });
21155
+ }, function () {
21156
+ setResolvedImageSrc(image);
21157
+ });
21158
+ return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(function () {}) : void 0);
21159
+ } catch (e) {
21160
+ return Promise.reject(e);
21161
+ }
21162
+ });
21163
+ return function () {
21164
+ isCancelled = true;
21165
+ };
21166
+ }, [image]);
21017
21167
  return /*#__PURE__*/React__default.createElement(Container$1, {
21018
21168
  border: border,
21019
21169
  marginAuto: marginAuto,
21020
21170
  size: size,
21021
- isImage: !!(image || setDefaultAvatar),
21171
+ isImage: !!(resolvedImageSrc || setDefaultAvatar),
21022
21172
  avatarName: name,
21023
21173
  textSize: textSize,
21024
21174
  onClick: handleAvatarClick,
@@ -21032,7 +21182,7 @@ var Avatar = function Avatar(_ref) {
21032
21182
  }) : (/*#__PURE__*/React__default.createElement("span", null, avatarText)) : (/*#__PURE__*/React__default.createElement(AvatarImage, {
21033
21183
  draggable: false,
21034
21184
  showImage: true,
21035
- src: image,
21185
+ src: resolvedImageSrc || image,
21036
21186
  size: size,
21037
21187
  alt: ''
21038
21188
  })));
@@ -21123,7 +21273,6 @@ var ChannelMessageText = function ChannelMessageText(_ref2) {
21123
21273
  }), channel.lastReactedMessage && '"')))));
21124
21274
  };
21125
21275
  var Channel = function Channel(_ref3) {
21126
- var _channel$metadata;
21127
21276
  var channel = _ref3.channel,
21128
21277
  theme = _ref3.theme,
21129
21278
  _ref3$showAvatar = _ref3.showAvatar,
@@ -21147,7 +21296,10 @@ var Channel = function Channel(_ref3) {
21147
21296
  channelLastMessageTimeFontSize = _ref3.channelLastMessageTimeFontSize,
21148
21297
  channelLastMessageHeight = _ref3.channelLastMessageHeight,
21149
21298
  channelAvatarSize = _ref3.channelAvatarSize,
21150
- channelAvatarTextSize = _ref3.channelAvatarTextSize;
21299
+ channelAvatarTextSize = _ref3.channelAvatarTextSize,
21300
+ setSelectedChannel = _ref3.setSelectedChannel,
21301
+ getCustomLatestMessage = _ref3.getCustomLatestMessage,
21302
+ doNotShowMessageDeliveryTypes = _ref3.doNotShowMessageDeliveryTypes;
21151
21303
  var _useColor = useColors(),
21152
21304
  accentColor = _useColor[THEME_COLORS.ACCENT],
21153
21305
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -21168,7 +21320,7 @@ var Channel = function Channel(_ref3) {
21168
21320
  var activeChannel = useSelector(activeChannelSelector) || {};
21169
21321
  var channelDraftIsRemoved = useSelector(channelMessageDraftIsRemovedSelector);
21170
21322
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
21171
- var isSelfChannel = isDirectChannel && (((_channel$metadata = channel.metadata) === null || _channel$metadata === void 0 ? void 0 : _channel$metadata.s) || channel.members.length === 1 && channel.members[0].id === user.id);
21323
+ var isSelfChannel = isDirectChannel && channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === user.id;
21172
21324
  var directChannelUser = isDirectChannel && channel.members.find(function (member) {
21173
21325
  return member.id !== user.id;
21174
21326
  });
@@ -21185,13 +21337,6 @@ var Channel = function Channel(_ref3) {
21185
21337
  statusWidth = _useState3[0],
21186
21338
  setStatusWidth = _useState3[1];
21187
21339
  var avatarName = channel.subject || (isDirectChannel && directChannelUser ? directChannelUser.firstName || directChannelUser.id : isSelfChannel ? 'Me' : '');
21188
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
21189
- if (activeChannel.id !== chan.id) {
21190
- dispatch(sendTypingAC(false));
21191
- dispatch(clearMessagesAC());
21192
- dispatch(switchChannelActionAC(chan));
21193
- }
21194
- };
21195
21340
  var messageAuthorRef = useRef(null);
21196
21341
  var messageTimeAndStatusRef = useRef(null);
21197
21342
  useUpdatePresence(channel, true);
@@ -21276,6 +21421,43 @@ var Channel = function Channel(_ref3) {
21276
21421
  isDirectChannel: isDirectChannel
21277
21422
  });
21278
21423
  }, [typingOrRecording === null || typingOrRecording === void 0 ? void 0 : typingOrRecording.isTyping, typingOrRecording === null || typingOrRecording === void 0 ? void 0 : typingOrRecording.isRecording, draftMessageText, lastMessage, user, contactsMap, getFromContacts, lastMessageMetas, accentColor, typingOrRecording, channel, isDirectChannel]);
21424
+ var getCustomLatestMessageComponent = useCallback(function (_ref4) {
21425
+ var lastMessage = _ref4.lastMessage,
21426
+ typingOrRecording = _ref4.typingOrRecording,
21427
+ draftMessageText = _ref4.draftMessageText,
21428
+ textSecondary = _ref4.textSecondary,
21429
+ channel = _ref4.channel,
21430
+ channelLastMessageFontSize = _ref4.channelLastMessageFontSize,
21431
+ channelLastMessageHeight = _ref4.channelLastMessageHeight,
21432
+ isDirectChannel = _ref4.isDirectChannel,
21433
+ textPrimary = _ref4.textPrimary,
21434
+ messageAuthorRef = _ref4.messageAuthorRef,
21435
+ contactsMap = _ref4.contactsMap,
21436
+ getFromContacts = _ref4.getFromContacts,
21437
+ warningColor = _ref4.warningColor,
21438
+ user = _ref4.user,
21439
+ MessageText = _ref4.MessageText;
21440
+ return getCustomLatestMessage && getCustomLatestMessage({
21441
+ lastMessage: lastMessage,
21442
+ typingOrRecording: typingOrRecording,
21443
+ draftMessageText: draftMessageText,
21444
+ textSecondary: textSecondary,
21445
+ channel: channel,
21446
+ channelLastMessageFontSize: channelLastMessageFontSize,
21447
+ channelLastMessageHeight: channelLastMessageHeight,
21448
+ isDirectChannel: isDirectChannel,
21449
+ textPrimary: textPrimary,
21450
+ messageAuthorRef: messageAuthorRef,
21451
+ contactsMap: contactsMap,
21452
+ getFromContacts: getFromContacts,
21453
+ warningColor: warningColor,
21454
+ user: user,
21455
+ MessageText: MessageText
21456
+ });
21457
+ }, [getCustomLatestMessage, lastMessage, typingOrRecording, draftMessageText, textSecondary, channel, channelLastMessageFontSize, channelLastMessageHeight, isDirectChannel, textPrimary, messageAuthorRef, contactsMap, getFromContacts, warningColor, user, MessageText]);
21458
+ var isTypeValid = useCallback(function (type) {
21459
+ return !doNotShowMessageDeliveryTypes.includes(type);
21460
+ }, [doNotShowMessageDeliveryTypes]);
21279
21461
  return /*#__PURE__*/React__default.createElement(Container$2, {
21280
21462
  theme: theme,
21281
21463
  selectedChannel: channel.id === activeChannel.id,
@@ -21286,7 +21468,7 @@ var Channel = function Channel(_ref3) {
21286
21468
  selectedChannelBorderRadius: selectedChannelBorderRadius,
21287
21469
  channelsMargin: channelsMargin,
21288
21470
  onClick: function onClick() {
21289
- return handleChangeActiveChannel(channel);
21471
+ return setSelectedChannel(channel);
21290
21472
  },
21291
21473
  hoverBackground: channelHoverBackground || backgroundHovered
21292
21474
  }, showAvatar && (/*#__PURE__*/React__default.createElement(AvatarWrapper, null, /*#__PURE__*/React__default.createElement(Avatar, {
@@ -21312,7 +21494,23 @@ var Channel = function Channel(_ref3) {
21312
21494
  avatarSize: channelAvatarSize
21313
21495
  }, /*#__PURE__*/React__default.createElement("h3", null, channel.subject || (isDirectChannel && directChannelUser ? makeUsername(contactsMap && contactsMap[directChannelUser.id], directChannelUser, getFromContacts) : isSelfChannel ? 'Me' : '')), channel.muted && (/*#__PURE__*/React__default.createElement(MutedIcon, {
21314
21496
  color: notificationsIsMutedIconColor || iconInactive
21315
- }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21497
+ }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), getCustomLatestMessage ? getCustomLatestMessageComponent({
21498
+ lastMessage: lastMessage,
21499
+ typingOrRecording: typingOrRecording,
21500
+ draftMessageText: draftMessageText,
21501
+ textSecondary: textSecondary,
21502
+ channel: channel,
21503
+ channelLastMessageFontSize: channelLastMessageFontSize || '14px',
21504
+ channelLastMessageHeight: channelLastMessageHeight || '20px',
21505
+ isDirectChannel: isDirectChannel,
21506
+ textPrimary: textPrimary,
21507
+ messageAuthorRef: messageAuthorRef,
21508
+ contactsMap: contactsMap || {},
21509
+ getFromContacts: getFromContacts,
21510
+ warningColor: warningColor,
21511
+ user: user,
21512
+ MessageText: MessageText
21513
+ }) : (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21316
21514
  color: textSecondary,
21317
21515
  markedAsUnread: !!(channel.unread || channel.newMessageCount && channel.newMessageCount > 0),
21318
21516
  unreadMentions: !!(channel.newMentionCount && channel.newMentionCount > 0),
@@ -21348,7 +21546,7 @@ var Channel = function Channel(_ref3) {
21348
21546
  }, MessageText)))), /*#__PURE__*/React__default.createElement(ChannelStatus, {
21349
21547
  color: iconInactive,
21350
21548
  ref: messageTimeAndStatusRef
21351
- }, lastMessage && lastMessage.state !== MESSAGE_STATUS.DELETE && (/*#__PURE__*/React__default.createElement(DeliveryIconCont, null, lastMessage && lastMessage.user && lastMessage.user.id === user.id && lastMessage.type !== 'system' && MessageStatusIcon({
21549
+ }, lastMessage && lastMessage.state !== MESSAGE_STATUS.DELETE && (/*#__PURE__*/React__default.createElement(DeliveryIconCont, null, lastMessage && lastMessage.user && lastMessage.user.id === user.id && isTypeValid(lastMessage.type) && MessageStatusIcon({
21352
21550
  messageStatus: lastMessage.deliveryStatus,
21353
21551
  messageStatusDisplayingType: 'ticks',
21354
21552
  readIconColor: accentColor,
@@ -21415,9 +21613,9 @@ var Container$2 = styled.div(_templateObject6$1 || (_templateObject6$1 = _tagged
21415
21613
  return props.channelsMargin || '0 8px';
21416
21614
  }, function (props) {
21417
21615
  return props.selectedChannelBorderRadius || '12px';
21418
- }, function (_ref4) {
21419
- var selectedChannel = _ref4.selectedChannel,
21420
- hoverBackground = _ref4.hoverBackground;
21616
+ }, function (_ref5) {
21617
+ var selectedChannel = _ref5.selectedChannel,
21618
+ hoverBackground = _ref5.hoverBackground;
21421
21619
  return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
21422
21620
  }, UserStatus, function (props) {
21423
21621
  return props.selectedChannel ? props.selectedBackgroundColor : props.hoverBackground;
@@ -21432,9 +21630,9 @@ var DraftMessageText = styled.span(_templateObject8$1 || (_templateObject8$1 = _
21432
21630
  });
21433
21631
  var LastMessageAuthor = styled.div(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteralLoose(["\n max-width: 120px;\n font-weight: 500;\n color: ", ";\n\n ", "\n & > span {\n display: block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: 100%;\n }\n"])), function (props) {
21434
21632
  return props.color;
21435
- }, function (_ref5) {
21436
- var typing = _ref5.typing,
21437
- recording = _ref5.recording;
21633
+ }, function (_ref6) {
21634
+ var typing = _ref6.typing,
21635
+ recording = _ref6.recording;
21438
21636
  return (typing || recording) && "\n font-weight: 500;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n max-width: calc(100% - " + (typing ? 62 : 76) + "px);\n ";
21439
21637
  });
21440
21638
  var Points = styled.span(_templateObject0$1 || (_templateObject0$1 = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n color: ", ";\n font-style: normal;\n"])), function (props) {
@@ -21491,7 +21689,7 @@ var MessageTextContainer = styled.div(_templateObject20$1 || (_templateObject20$
21491
21689
 
21492
21690
  var _templateObject$5, _templateObject2$5;
21493
21691
  var SearchInputContainer = styled.div(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n position: relative;\n width: 100%;\n max-width: ", ";\n box-sizing: border-box;\n padding: ", ";\n\n & ", " {\n ", ";\n }\n"])), function (props) {
21494
- return props.inline && 'calc(100% - 24px)';
21692
+ return props.width || props.inline && 'calc(100% - 24px)';
21495
21693
  }, function (props) {
21496
21694
  return !props.inline && '0 12px 16px';
21497
21695
  }, ClearTypedText, function (props) {
@@ -21518,14 +21716,16 @@ var ChannelSearch = function ChannelSearch(_ref) {
21518
21716
  borderRadius = _ref.borderRadius,
21519
21717
  searchInputBackgroundColor = _ref.searchInputBackgroundColor,
21520
21718
  searchInputTextColor = _ref.searchInputTextColor,
21521
- fontSize = _ref.fontSize;
21719
+ fontSize = _ref.fontSize,
21720
+ width = _ref.width;
21522
21721
  var _useColor = useColors(),
21523
21722
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
21524
21723
  surface1 = _useColor[THEME_COLORS.SURFACE_1],
21525
21724
  iconInactive = _useColor[THEME_COLORS.ICON_INACTIVE],
21526
21725
  footnoteColor = _useColor[THEME_COLORS.TEXT_FOOTNOTE];
21527
21726
  return /*#__PURE__*/React__default.createElement(SearchInputContainer, {
21528
- inline: inline
21727
+ inline: inline,
21728
+ width: width
21529
21729
  }, /*#__PURE__*/React__default.createElement(StyledSearchSvg, {
21530
21730
  left: !inline ? '22px' : '',
21531
21731
  color: iconInactive
@@ -23306,6 +23506,7 @@ var ChannelList = function ChannelList(_ref) {
23306
23506
  searchInputTextColor = _ref.searchInputTextColor,
23307
23507
  _ref$searchChannelsPo = _ref.searchChannelsPosition,
23308
23508
  searchChannelsPosition = _ref$searchChannelsPo === void 0 ? 'bottom' : _ref$searchChannelsPo,
23509
+ channelSearchWidth = _ref.channelSearchWidth,
23309
23510
  searchInputBorderRadius = _ref.searchInputBorderRadius,
23310
23511
  selectedChannelBorderRadius = _ref.selectedChannelBorderRadius,
23311
23512
  selectedChannelPaddings = _ref.selectedChannelPaddings,
@@ -23352,7 +23553,10 @@ var ChannelList = function ChannelList(_ref) {
23352
23553
  channelAvatarTextSize = _ref.channelAvatarTextSize,
23353
23554
  searchChannelInputFontSize = _ref.searchChannelInputFontSize,
23354
23555
  searchedChannelsTitleFontSize = _ref.searchedChannelsTitleFontSize,
23355
- searchChannelsPadding = _ref.searchChannelsPadding;
23556
+ searchChannelsPadding = _ref.searchChannelsPadding,
23557
+ getCustomLatestMessage = _ref.getCustomLatestMessage,
23558
+ _ref$doNotShowMessage = _ref.doNotShowMessageDeliveryTypes,
23559
+ doNotShowMessageDeliveryTypes = _ref$doNotShowMessage === void 0 ? ['system'] : _ref$doNotShowMessage;
23356
23560
  var _useColor = useColors(),
23357
23561
  background = _useColor[THEME_COLORS.BACKGROUND],
23358
23562
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -23420,11 +23624,6 @@ var ChannelList = function ChannelList(_ref) {
23420
23624
  handleLoadMoreChannels();
23421
23625
  }
23422
23626
  };
23423
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
23424
- if (activeChannel.id !== chan.id) {
23425
- dispatch(switchChannelActionAC(chan));
23426
- }
23427
- };
23428
23627
  var handleCrateChatWithContact = function handleCrateChatWithContact(contact) {
23429
23628
  if (contact) {
23430
23629
  var channelData = {
@@ -23580,6 +23779,13 @@ var ChannelList = function ChannelList(_ref) {
23580
23779
  setListWidthIsSet(false);
23581
23780
  }
23582
23781
  }, [channels]);
23782
+ var setSelectedChannel = function setSelectedChannel(channel) {
23783
+ if (activeChannel.id !== channel.id) {
23784
+ dispatch(sendTypingAC(false));
23785
+ dispatch(clearMessagesAC());
23786
+ dispatch(switchChannelActionAC(channel));
23787
+ }
23788
+ };
23583
23789
  return /*#__PURE__*/React__default.createElement(Container$7, {
23584
23790
  className: className,
23585
23791
  withCustomList: !!List,
@@ -23593,6 +23799,7 @@ var ChannelList = function ChannelList(_ref) {
23593
23799
  padding: searchChannelsPadding
23594
23800
  }, Profile, showSearch && searchChannelsPosition === 'inline' ? (/*#__PURE__*/React__default.createElement(ChannelSearch, {
23595
23801
  inline: true,
23802
+ width: channelSearchWidth,
23596
23803
  borderRadius: searchInputBorderRadius,
23597
23804
  searchValue: searchValue,
23598
23805
  handleSearchValueChange: handleSearchValueChange,
@@ -23614,6 +23821,7 @@ var ChannelList = function ChannelList(_ref) {
23614
23821
  })))), showSearch && searchChannelsPosition === 'bottom' && (/*#__PURE__*/React__default.createElement(ChannelSearch, {
23615
23822
  searchValue: searchValue,
23616
23823
  theme: theme,
23824
+ width: channelSearchWidth,
23617
23825
  borderRadius: searchInputBorderRadius,
23618
23826
  handleSearchValueChange: handleSearchValueChange,
23619
23827
  getMyChannels: getMyChannels,
@@ -23624,13 +23832,13 @@ var ChannelList = function ChannelList(_ref) {
23624
23832
  channels: channels,
23625
23833
  searchedChannels: searchedChannels,
23626
23834
  selectedChannel: activeChannel,
23627
- setSelectedChannel: handleChangeActiveChannel,
23835
+ setSelectedChannel: setSelectedChannel,
23628
23836
  loadMoreChannels: handleLoadMoreChannels,
23629
23837
  searchValue: searchValue
23630
23838
  }, !searchValue ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, channels.map(function (channel) {
23631
23839
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23632
23840
  channel: channel,
23633
- setSelectedChannel: handleChangeActiveChannel,
23841
+ setSelectedChannel: setSelectedChannel,
23634
23842
  key: channel.id
23635
23843
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23636
23844
  theme: theme,
@@ -23656,7 +23864,10 @@ var ChannelList = function ChannelList(_ref) {
23656
23864
  avatarBorderRadius: avatarBorderRadius,
23657
23865
  channel: channel,
23658
23866
  key: channel.id,
23659
- contactsMap: contactsMap
23867
+ contactsMap: contactsMap,
23868
+ setSelectedChannel: setSelectedChannel,
23869
+ getCustomLatestMessage: getCustomLatestMessage,
23870
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23660
23871
  }));
23661
23872
  }))) : channelsLoading === LOADING_STATE.LOADED && searchValue ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, searchedChannels !== null && searchedChannels !== void 0 && (_searchedChannels$cha = searchedChannels.chats_groups) !== null && _searchedChannels$cha !== void 0 && _searchedChannels$cha.length || searchedChannels !== null && searchedChannels !== void 0 && (_searchedChannels$cha2 = searchedChannels.channels) !== null && _searchedChannels$cha2 !== void 0 && _searchedChannels$cha2.length || searchedChannels !== null && searchedChannels !== void 0 && (_searchedChannels$con = searchedChannels.contacts) !== null && _searchedChannels$con !== void 0 && _searchedChannels$con.length ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, !!(searchedChannels.chats_groups && searchedChannels.chats_groups.length) && (/*#__PURE__*/React__default.createElement(DirectChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23662
23873
  color: textSecondary,
@@ -23664,7 +23875,7 @@ var ChannelList = function ChannelList(_ref) {
23664
23875
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23665
23876
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23666
23877
  channel: channel,
23667
- setSelectedChannel: handleChangeActiveChannel,
23878
+ setSelectedChannel: setSelectedChannel,
23668
23879
  key: channel.id
23669
23880
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23670
23881
  theme: theme,
@@ -23690,7 +23901,10 @@ var ChannelList = function ChannelList(_ref) {
23690
23901
  avatarBorderRadius: avatarBorderRadius,
23691
23902
  channel: channel,
23692
23903
  key: channel.id,
23693
- contactsMap: contactsMap
23904
+ contactsMap: contactsMap,
23905
+ setSelectedChannel: setSelectedChannel,
23906
+ getCustomLatestMessage: getCustomLatestMessage,
23907
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23694
23908
  }));
23695
23909
  }))), !!(searchedChannels.contacts && searchedChannels.contacts.length) && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23696
23910
  color: textSecondary,
@@ -23699,7 +23913,7 @@ var ChannelList = function ChannelList(_ref) {
23699
23913
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23700
23914
  contact: contact,
23701
23915
  createChatWithContact: handleCrateChatWithContact,
23702
- setSelectedChannel: handleChangeActiveChannel,
23916
+ setSelectedChannel: setSelectedChannel,
23703
23917
  key: contact.id
23704
23918
  })) : (/*#__PURE__*/React__default.createElement(ContactItem, {
23705
23919
  theme: theme,
@@ -23730,7 +23944,7 @@ var ChannelList = function ChannelList(_ref) {
23730
23944
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23731
23945
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23732
23946
  channel: channel,
23733
- setSelectedChannel: handleChangeActiveChannel,
23947
+ setSelectedChannel: setSelectedChannel,
23734
23948
  key: channel.id
23735
23949
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23736
23950
  theme: theme,
@@ -23756,7 +23970,10 @@ var ChannelList = function ChannelList(_ref) {
23756
23970
  avatarBorderRadius: avatarBorderRadius,
23757
23971
  channel: channel,
23758
23972
  key: channel.id,
23759
- contactsMap: contactsMap
23973
+ contactsMap: contactsMap,
23974
+ setSelectedChannel: setSelectedChannel,
23975
+ getCustomLatestMessage: getCustomLatestMessage,
23976
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23760
23977
  }));
23761
23978
  }))))) : (/*#__PURE__*/React__default.createElement(NoData, {
23762
23979
  color: textSecondary,
@@ -23777,7 +23994,7 @@ var ChannelList = function ChannelList(_ref) {
23777
23994
  }, channels.map(function (channel) {
23778
23995
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23779
23996
  channel: channel,
23780
- setSelectedChannel: handleChangeActiveChannel,
23997
+ setSelectedChannel: setSelectedChannel,
23781
23998
  key: channel.id
23782
23999
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23783
24000
  theme: theme,
@@ -23803,7 +24020,10 @@ var ChannelList = function ChannelList(_ref) {
23803
24020
  avatarBorderRadius: avatarBorderRadius,
23804
24021
  channel: channel,
23805
24022
  key: channel.id,
23806
- contactsMap: contactsMap
24023
+ contactsMap: contactsMap,
24024
+ setSelectedChannel: setSelectedChannel,
24025
+ getCustomLatestMessage: getCustomLatestMessage,
24026
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23807
24027
  }));
23808
24028
  }))), !!searchValue && (channelsLoading === LOADING_STATE.LOADED ? !((_searchedChannels$cha4 = searchedChannels.chats_groups) !== null && _searchedChannels$cha4 !== void 0 && _searchedChannels$cha4.length) && !((_searchedChannels$cha5 = searchedChannels.chats_groups) !== null && _searchedChannels$cha5 !== void 0 && _searchedChannels$cha5.length) && !((_searchedChannels$cha6 = searchedChannels.channels) !== null && _searchedChannels$cha6 !== void 0 && _searchedChannels$cha6.length) ? (/*#__PURE__*/React__default.createElement(NoData, {
23809
24029
  color: textSecondary,
@@ -23814,7 +24034,7 @@ var ChannelList = function ChannelList(_ref) {
23814
24034
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23815
24035
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23816
24036
  channel: channel,
23817
- setSelectedChannel: handleChangeActiveChannel,
24037
+ setSelectedChannel: setSelectedChannel,
23818
24038
  key: channel.id
23819
24039
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23820
24040
  theme: theme,
@@ -23840,7 +24060,10 @@ var ChannelList = function ChannelList(_ref) {
23840
24060
  avatarBorderRadius: avatarBorderRadius,
23841
24061
  channel: channel,
23842
24062
  contactsMap: contactsMap,
23843
- key: channel.id
24063
+ key: channel.id,
24064
+ setSelectedChannel: setSelectedChannel,
24065
+ getCustomLatestMessage: getCustomLatestMessage,
24066
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23844
24067
  }));
23845
24068
  }))), !!searchedChannels.channels.length && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23846
24069
  color: textSecondary,
@@ -23848,7 +24071,7 @@ var ChannelList = function ChannelList(_ref) {
23848
24071
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23849
24072
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23850
24073
  channel: channel,
23851
- setSelectedChannel: handleChangeActiveChannel,
24074
+ setSelectedChannel: setSelectedChannel,
23852
24075
  key: channel.id
23853
24076
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23854
24077
  theme: theme,
@@ -23874,7 +24097,10 @@ var ChannelList = function ChannelList(_ref) {
23874
24097
  avatarBorderRadius: avatarBorderRadius,
23875
24098
  channel: channel,
23876
24099
  key: channel.id,
23877
- contactsMap: contactsMap
24100
+ contactsMap: contactsMap,
24101
+ setSelectedChannel: setSelectedChannel,
24102
+ getCustomLatestMessage: getCustomLatestMessage,
24103
+ doNotShowMessageDeliveryTypes: doNotShowMessageDeliveryTypes
23878
24104
  }));
23879
24105
  }))))) : (/*#__PURE__*/React__default.createElement(LoadingWrapper, null, /*#__PURE__*/React__default.createElement(UploadingIcon, {
23880
24106
  color: textFootnote
@@ -23913,7 +24139,7 @@ var NoData = styled.div(_templateObject8$4 || (_templateObject8$4 = _taggedTempl
23913
24139
  return props.color;
23914
24140
  });
23915
24141
  var LoadingWrapper = styled.div(_templateObject9$4 || (_templateObject9$4 = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: calc(50% - 20px);\n top: calc(50% - 20px);\n"])));
23916
- var ChannelListHeader = styled.div(_templateObject0$3 || (_templateObject0$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: row;\n justify-content: space-between;\n max-width: ", ";\n padding: ", ";\n padding-left: 22px;\n box-sizing: border-box;\n padding-left: ", ";\n border-right: ", ";\n"])), function (props) {
24142
+ var ChannelListHeader = styled.div(_templateObject0$3 || (_templateObject0$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n flex-direction: row;\n justify-content: space-between;\n max-width: ", ";\n padding: ", ";\n box-sizing: border-box;\n padding-left: ", ";\n border-right: ", ";\n"])), function (props) {
23917
24143
  return props.maxWidth ? props.maxWidth + "px" : 'inherit';
23918
24144
  }, function (props) {
23919
24145
  return props.padding || '12px';
@@ -24078,7 +24304,6 @@ function SvgInfo(props) {
24078
24304
 
24079
24305
  var _templateObject$i, _templateObject2$g, _templateObject3$c, _templateObject4$a, _templateObject5$8, _templateObject6$6, _templateObject7$5, _templateObject8$5, _templateObject9$5, _templateObject0$4;
24080
24306
  function ChatHeader(_ref) {
24081
- var _activeChannel$metada;
24082
24307
  var infoIcon = _ref.infoIcon,
24083
24308
  backgroundColor = _ref.backgroundColor,
24084
24309
  titleColor = _ref.titleColor,
@@ -24117,7 +24342,7 @@ function ChatHeader(_ref) {
24117
24342
  var channelListHidden = useSelector(channelListHiddenSelector);
24118
24343
  var channelDetailsIsOpen = useSelector(channelInfoIsOpenSelector, shallowEqual);
24119
24344
  var isDirectChannel = activeChannel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
24120
- var isSelfChannel = isDirectChannel && ((_activeChannel$metada = activeChannel.metadata) === null || _activeChannel$metada === void 0 ? void 0 : _activeChannel$metada.s);
24345
+ var isSelfChannel = isDirectChannel && activeChannel.memberCount === 1 && activeChannel.members.length > 0 && activeChannel.members[0].id === user.id;
24121
24346
  var directChannelUser = isDirectChannel && activeChannel.members.find(function (member) {
24122
24347
  return member.id !== user.id;
24123
24348
  });
@@ -24528,50 +24753,6 @@ function SvgDeleteChannel(props) {
24528
24753
  })));
24529
24754
  }
24530
24755
 
24531
- var ATTACHMENTS_CACHE = 'attachments-cache';
24532
- var isBrowser = typeof window !== 'undefined';
24533
- var cacheAvailable;
24534
- if (isBrowser) {
24535
- cacheAvailable = 'caches' in window;
24536
- } else {
24537
- cacheAvailable = 'caches' in global;
24538
- }
24539
- var setAttachmentToCache = function setAttachmentToCache(attachmentUrl, attachmentResponse) {
24540
- if (cacheAvailable) {
24541
- caches.open(ATTACHMENTS_CACHE).then(function (cache) {
24542
- try {
24543
- cache.put(attachmentUrl, attachmentResponse).then(function () {
24544
- log.info('Cache success');
24545
- })["catch"](function (e) {
24546
- log.info('Error on cache attachment ... ', e);
24547
- caches["delete"](attachmentUrl);
24548
- });
24549
- return Promise.resolve();
24550
- } catch (e) {
24551
- return Promise.reject(e);
24552
- }
24553
- });
24554
- }
24555
- };
24556
- var getAttachmentUrlFromCache = function getAttachmentUrlFromCache(attachmentUrl) {
24557
- try {
24558
- if (!cacheAvailable) {
24559
- log.error('Cache is not available');
24560
- return Promise.reject(new Error('Cache not available'));
24561
- }
24562
- return Promise.resolve(caches.match(attachmentUrl)).then(function (response) {
24563
- if (response) {
24564
- return Promise.resolve(response.blob()).then(URL.createObjectURL);
24565
- } else {
24566
- log.info('The image or video is not cached', attachmentUrl);
24567
- return false;
24568
- }
24569
- });
24570
- } catch (e) {
24571
- return Promise.reject(e);
24572
- }
24573
- };
24574
-
24575
24756
  var _path$A;
24576
24757
  function _extends$B() {
24577
24758
  return _extends$B = Object.assign ? Object.assign.bind() : function (n) {
@@ -25003,10 +25184,9 @@ function ForwardMessagePopup(_ref) {
25003
25184
  setSearchValue('');
25004
25185
  };
25005
25186
  var handleChannelSelect = function handleChannelSelect(isSelected, channel) {
25006
- var _channel$metadata;
25007
25187
  var newSelectedChannels = [].concat(selectedChannels);
25008
25188
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
25009
- var isSelfChannel = isDirectChannel && ((_channel$metadata = channel.metadata) === null || _channel$metadata === void 0 ? void 0 : _channel$metadata.s);
25189
+ var isSelfChannel = isDirectChannel && channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === user.id;
25010
25190
  var directChannelUser = isDirectChannel && channel.members.find(function (member) {
25011
25191
  return member.id !== user.id;
25012
25192
  });
@@ -25119,12 +25299,11 @@ function ForwardMessagePopup(_ref) {
25119
25299
  color: textSecondary,
25120
25300
  margin: '0 0 12px'
25121
25301
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
25122
- var _channel$metadata2;
25123
25302
  var isSelected = selectedChannels.findIndex(function (chan) {
25124
25303
  return chan.id === channel.id;
25125
25304
  }) >= 0;
25126
25305
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
25127
- var isSelfChannel = isDirectChannel && ((_channel$metadata2 = channel.metadata) === null || _channel$metadata2 === void 0 ? void 0 : _channel$metadata2.s);
25306
+ var isSelfChannel = isDirectChannel && channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === user.id;
25128
25307
  var directChannelUser = isDirectChannel && isSelfChannel ? user : channel.members.find(function (member) {
25129
25308
  return member.id !== user.id;
25130
25309
  });
@@ -25195,9 +25374,8 @@ function ForwardMessagePopup(_ref) {
25195
25374
  }))), !searchedChannels.chats_groups.length && !searchedChannels.channels.length && (/*#__PURE__*/React__default.createElement(NoResults, {
25196
25375
  color: textSecondary
25197
25376
  }, "No channels found")))) : channels.map(function (channel) {
25198
- var _channel$metadata3;
25199
25377
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
25200
- var isSelfChannel = isDirectChannel && ((_channel$metadata3 = channel.metadata) === null || _channel$metadata3 === void 0 ? void 0 : _channel$metadata3.s);
25378
+ var isSelfChannel = isDirectChannel && channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === user.id;
25201
25379
  var directChannelUser = isDirectChannel && isSelfChannel ? user : channel.members.find(function (member) {
25202
25380
  return member.id !== user.id;
25203
25381
  });
@@ -26038,6 +26216,7 @@ var Message = function Message(_ref) {
26038
26216
  var _useColor = useColors(),
26039
26217
  textOnPrimary = _useColor[THEME_COLORS.TEXT_ON_PRIMARY],
26040
26218
  overlayBackground = _useColor[THEME_COLORS.OVERLAY_BACKGROUND];
26219
+ var scrollToNewMessage = useSelector(scrollToNewMessageSelector);
26041
26220
  var dispatch = useDispatch();
26042
26221
  var ChatClient = getClient();
26043
26222
  var user = ChatClient.user;
@@ -26056,7 +26235,19 @@ var Message = function Message(_ref) {
26056
26235
  };
26057
26236
  useEffect(function () {
26058
26237
  if (isVisible) {
26238
+ var _channel$lastMessage;
26059
26239
  handleSendReadMarker();
26240
+ if (!channel.isLinkedChannel) {
26241
+ setMessageToVisibleMessagesMap(message);
26242
+ }
26243
+ if (scrollToNewMessage.scrollToBottom && ((message === null || message === void 0 ? void 0 : message.id) === ((_channel$lastMessage = channel.lastMessage) === null || _channel$lastMessage === void 0 ? void 0 : _channel$lastMessage.id) || !(message !== null && message !== void 0 && message.id))) {
26244
+ dispatch(scrollToNewMessageAC(false, false, false));
26245
+ dispatch(setMessagesLoadingStateAC(LOADING_STATE.LOADED));
26246
+ }
26247
+ } else {
26248
+ if (!channel.isLinkedChannel) {
26249
+ removeMessageFromVisibleMessagesMap(message);
26250
+ }
26060
26251
  }
26061
26252
  }, [isVisible]);
26062
26253
  useDidUpdate(function () {
@@ -27125,7 +27316,7 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
27125
27316
  preload: 'auto',
27126
27317
  id: 'video',
27127
27318
  src: file.attachmentUrl || videoUrl
27128
- }), videoCurrentTime && (/*#__PURE__*/React__default.createElement(VideoControls, null, !isPreview && !!videoCurrentTime && !isRepliedMessage && !uploading && !isDetailsView && (
27319
+ }), videoCurrentTime && !isRepliedMessage && (/*#__PURE__*/React__default.createElement(VideoControls, null, !isPreview && !!videoCurrentTime && !isRepliedMessage && !uploading && !isDetailsView && (
27129
27320
  /*#__PURE__*/
27130
27321
  React__default.createElement(VideoPlayButton, null, /*#__PURE__*/React__default.createElement(SvgPlayVideo, null))), /*#__PURE__*/React__default.createElement(VideoTime, {
27131
27322
  isDetailsView: isDetailsView,
@@ -31172,7 +31363,7 @@ var validateUrl = function validateUrl(url) {
31172
31363
  }
31173
31364
  };
31174
31365
  var OGMetadata = function OGMetadata(_ref) {
31175
- 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;
31366
+ var _metadata$og6, _metadata$og6$image, _metadata$og6$image$, _metadata$og7, _metadata$og7$image, _metadata$og7$image$, _metadata$og8, _metadata$og8$image, _metadata$og8$image$, _metadata$og9, _metadata$og0, _metadata$og0$favicon, _metadata$og1, _metadata$og1$favicon, _metadata$og10, _metadata$og11, _metadata$og12;
31176
31367
  var attachments = _ref.attachments,
31177
31368
  state = _ref.state;
31178
31369
  var _useState = useState(null),
@@ -31181,6 +31372,18 @@ var OGMetadata = function OGMetadata(_ref) {
31181
31372
  var _useState2 = useState(true),
31182
31373
  imageLoadError = _useState2[0],
31183
31374
  setImageLoadError = _useState2[1];
31375
+ var _useState3 = useState(true),
31376
+ faviconLoadError = _useState3[0],
31377
+ setFaviconLoadError = _useState3[1];
31378
+ var _useState4 = useState(false),
31379
+ imageLoaded = _useState4[0],
31380
+ setImageLoaded = _useState4[1];
31381
+ var _useState5 = useState(0),
31382
+ imageWidth = _useState5[0],
31383
+ setImageWidth = _useState5[1];
31384
+ var _useState6 = useState(0),
31385
+ imageHeight = _useState6[0],
31386
+ setImageHeight = _useState6[1];
31184
31387
  var attachment = useMemo(function () {
31185
31388
  return attachments.find(function (attachment) {
31186
31389
  return attachment.type === attachmentTypes.link;
@@ -31195,7 +31398,7 @@ var OGMetadata = function OGMetadata(_ref) {
31195
31398
  var queryBuilder = new client.MessageLinkOGQueryBuilder(url);
31196
31399
  return Promise.resolve(queryBuilder.build()).then(function (query) {
31197
31400
  return Promise.resolve(query.loadOGData()).then(function (metadata) {
31198
- return Promise.resolve(storeMetadata(url.replace('https://', '').replace('http://', ''), metadata)).then(function () {
31401
+ return Promise.resolve(storeMetadata(url, metadata)).then(function () {
31199
31402
  setMetadata(metadata);
31200
31403
  });
31201
31404
  });
@@ -31218,7 +31421,7 @@ var OGMetadata = function OGMetadata(_ref) {
31218
31421
  if (attachment !== null && attachment !== void 0 && attachment.id && attachment !== null && attachment !== void 0 && attachment.url) {
31219
31422
  var url = attachment === null || attachment === void 0 ? void 0 : attachment.url;
31220
31423
  if (url) {
31221
- getMetadata(url.replace('https://', '').replace('http://', '')).then(function (cachedMetadata) {
31424
+ getMetadata(url).then(function (cachedMetadata) {
31222
31425
  try {
31223
31426
  if (cachedMetadata) {
31224
31427
  setMetadata(cachedMetadata);
@@ -31247,6 +31450,29 @@ var OGMetadata = function OGMetadata(_ref) {
31247
31450
  var _metadata$og, _metadata$og2, _metadata$og2$image, _metadata$og2$image$, _metadata$og3;
31248
31451
  return state !== 'deleted' && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og = metadata.og) === null || _metadata$og === void 0 ? void 0 : _metadata$og.title) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og2 = metadata.og) === null || _metadata$og2 === void 0 ? void 0 : (_metadata$og2$image = _metadata$og2.image) === null || _metadata$og2$image === void 0 ? void 0 : (_metadata$og2$image$ = _metadata$og2$image[0]) === null || _metadata$og2$image$ === void 0 ? void 0 : _metadata$og2$image$.url) && (metadata === null || metadata === void 0 ? void 0 : (_metadata$og3 = metadata.og) === null || _metadata$og3 === void 0 ? void 0 : _metadata$og3.description) && metadata;
31249
31452
  }, [state, metadata]);
31453
+ useEffect(function () {
31454
+ var _metadata$og4, _metadata$og4$image, _metadata$og4$image$;
31455
+ if (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) {
31456
+ var _metadata$og5, _metadata$og5$image, _metadata$og5$image$;
31457
+ var image = new Image();
31458
+ image.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;
31459
+ image.onload = function () {
31460
+ var imageWidth = image.width;
31461
+ var imageHeight = image.height;
31462
+ setImageWidth(imageWidth);
31463
+ setImageHeight(imageHeight);
31464
+ setImageLoadError(false);
31465
+ setImageLoaded(true);
31466
+ };
31467
+ image.onerror = function () {
31468
+ setImageLoadError(true);
31469
+ setImageLoaded(true);
31470
+ };
31471
+ }
31472
+ }, [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]);
31473
+ var calculatedImageHeight = useMemo(function () {
31474
+ return imageHeight / (imageWidth / 400);
31475
+ }, [imageWidth, imageHeight]);
31250
31476
  return /*#__PURE__*/React__default.createElement(OGMetadataContainer, {
31251
31477
  showOGMetadata: !!showOGMetadata
31252
31478
  }, /*#__PURE__*/React__default.createElement("div", {
@@ -31254,37 +31480,69 @@ var OGMetadata = function OGMetadata(_ref) {
31254
31480
  window.open(attachment === null || attachment === void 0 ? void 0 : attachment.url, '_blank');
31255
31481
  }
31256
31482
  }, /*#__PURE__*/React__default.createElement(ImageContainer, {
31257
- showOGMetadata: !!showOGMetadata && !imageLoadError
31258
- }, 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 ? (/*#__PURE__*/React__default.createElement(Img, {
31259
- 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,
31483
+ showOGMetadata: !!showOGMetadata && !imageLoadError && imageLoaded,
31484
+ width: 400,
31485
+ height: calculatedImageHeight
31486
+ }, metadata !== null && metadata !== void 0 && (_metadata$og7 = metadata.og) !== null && _metadata$og7 !== void 0 && (_metadata$og7$image = _metadata$og7.image) !== null && _metadata$og7$image !== void 0 && (_metadata$og7$image$ = _metadata$og7$image[0]) !== null && _metadata$og7$image$ !== void 0 && _metadata$og7$image$.url && !imageLoadError ? (/*#__PURE__*/React__default.createElement(Img, {
31487
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og8 = metadata.og) === null || _metadata$og8 === void 0 ? void 0 : (_metadata$og8$image = _metadata$og8.image) === null || _metadata$og8$image === void 0 ? void 0 : (_metadata$og8$image$ = _metadata$og8$image[0]) === null || _metadata$og8$image$ === void 0 ? void 0 : _metadata$og8$image$.url,
31260
31488
  alt: 'OG metadata image',
31489
+ width: 400,
31490
+ height: calculatedImageHeight
31491
+ })) : null), showOGMetadata && imageLoaded ? (/*#__PURE__*/React__default.createElement(OGText, null, /*#__PURE__*/React__default.createElement(Url, {
31492
+ maxWidth: 400
31493
+ }, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og9 = metadata.og) !== null && _metadata$og9 !== void 0 && _metadata$og9.title ? (/*#__PURE__*/React__default.createElement(Title, {
31494
+ maxWidth: 400
31495
+ }, metadata !== null && metadata !== void 0 && (_metadata$og0 = metadata.og) !== null && _metadata$og0 !== void 0 && (_metadata$og0$favicon = _metadata$og0.favicon) !== null && _metadata$og0$favicon !== void 0 && _metadata$og0$favicon.url && !faviconLoadError ? (/*#__PURE__*/React__default.createElement(Favicon, {
31496
+ src: metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : (_metadata$og1$favicon = _metadata$og1.favicon) === null || _metadata$og1$favicon === void 0 ? void 0 : _metadata$og1$favicon.url,
31261
31497
  onLoad: function onLoad() {
31262
- return setImageLoadError(false);
31498
+ return setFaviconLoadError(false);
31263
31499
  },
31264
31500
  onError: function onError() {
31265
- return setImageLoadError(true);
31501
+ return setFaviconLoadError(true);
31266
31502
  }
31267
- })) : null), showOGMetadata ? (/*#__PURE__*/React__default.createElement(OGText, null, /*#__PURE__*/React__default.createElement(Url, null, ogUrl), metadata !== null && metadata !== void 0 && (_metadata$og6 = metadata.og) !== null && _metadata$og6 !== void 0 && _metadata$og6.title ? (/*#__PURE__*/React__default.createElement(Title, null, 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 ? /*#__PURE__*/React__default.createElement(Favicon, {
31268
- 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
31269
- }) : 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, null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og1 = metadata.og) === null || _metadata$og1 === void 0 ? void 0 : _metadata$og1.description) : null)) : null));
31503
+ })) : null, /*#__PURE__*/React__default.createElement("span", null, metadata === null || metadata === void 0 ? void 0 : (_metadata$og10 = metadata.og) === null || _metadata$og10 === void 0 ? void 0 : _metadata$og10.title))) : null, metadata !== null && metadata !== void 0 && (_metadata$og11 = metadata.og) !== null && _metadata$og11 !== void 0 && _metadata$og11.description ? /*#__PURE__*/React__default.createElement(Desc, {
31504
+ maxWidth: 400
31505
+ }, metadata === null || metadata === void 0 ? void 0 : (_metadata$og12 = metadata.og) === null || _metadata$og12 === void 0 ? void 0 : _metadata$og12.description) : null)) : null));
31270
31506
  };
31271
31507
  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) {
31272
31508
  var showOGMetadata = _ref2.showOGMetadata;
31273
31509
  return showOGMetadata ? '0.8rem' : '0';
31274
31510
  });
31275
- var ImageContainer = styled.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n max-height: 200px;\n width: 100%;\n margin: 0 auto;\n padding: ", ";\n height: ", ";\n transition: height 0.2s ease;\n"])), function (_ref3) {
31276
- var showOGMetadata = _ref3.showOGMetadata;
31277
- return showOGMetadata ? '0.3rem' : '0';
31511
+ var ImageContainer = styled.div(_templateObject2$v || (_templateObject2$v = _taggedTemplateLiteralLoose(["\n ", "\n\n ", "\n\n opacity: ", ";\n overflow: hidden;\n margin: 0 auto;\n padding: ", ";\n transition: height 0.2s ease;\n"])), function (_ref3) {
31512
+ var width = _ref3.width;
31513
+ return width ? "\n max-width: " + (width + "px") + ";\n " : "\n max-width: 100%;\n width: 100%;\n ";
31278
31514
  }, function (_ref4) {
31279
- var showOGMetadata = _ref4.showOGMetadata;
31280
- return showOGMetadata ? '200px' : '0';
31515
+ var height = _ref4.height,
31516
+ showOGMetadata = _ref4.showOGMetadata;
31517
+ return height ? "\n max-height: " + (height + "px") + ";\n height: " + (showOGMetadata ? height + "px" : '0') + ";\n " : "\n max-height: 200px;\n height: " + (showOGMetadata ? '200px' : '0') + ";\n ";
31518
+ }, function (_ref5) {
31519
+ var showOGMetadata = _ref5.showOGMetadata;
31520
+ return showOGMetadata ? 1 : 0;
31521
+ }, function (_ref6) {
31522
+ var showOGMetadata = _ref6.showOGMetadata;
31523
+ return showOGMetadata ? '0.3rem' : '0';
31281
31524
  });
31282
- var OGText = styled.div(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose(["\n width: 80%;\n padding: 0.5rem;\n margin: 0;\n"])));
31283
- var Url = styled.p(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n font-weight: normal;\n font-size: 13px;\n padding: 0;\n margin: 0 0 12px 0;\n color: gray;\n"])));
31284
- var Title = styled.p(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteralLoose(["\n font-weight: bold;\n font-size: 13px;\n padding: 0;\n display: flex;\n align-items: center;\n"])));
31285
- var Desc = styled.p(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteralLoose(["\n font-weight: normal;\n font-size: 13px;\n padding: 0;\n"])));
31286
- var Img = styled.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n max-width: 100%;\n max-height: 100%;\n width: 100%;\n height: 200px;\n object-fit: cover;\n transition: height 0.2s ease;\n"])));
31287
- var Favicon = styled.img(_templateObject8$c || (_templateObject8$c = _taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n object-fit: contain;\n margin-right: 4px;\n"])));
31525
+ var OGText = styled.div(_templateObject3$p || (_templateObject3$p = _taggedTemplateLiteralLoose(["\n padding: 0.5rem;\n margin: 0;\n transition: all 0.2s ease;\n"])));
31526
+ var Url = styled.p(_templateObject4$l || (_templateObject4$l = _taggedTemplateLiteralLoose(["\n font-weight: normal;\n font-size: 13px;\n padding: 0;\n margin: 0 0 12px 0;\n color: gray;\n ", "\n transition: all 0.2s ease;\n"])), function (_ref7) {
31527
+ var maxWidth = _ref7.maxWidth;
31528
+ return maxWidth && "\n max-width: " + (maxWidth + "px") + ";\n ";
31529
+ });
31530
+ var Title = styled.p(_templateObject5$h || (_templateObject5$h = _taggedTemplateLiteralLoose(["\n font-weight: bold;\n font-size: 13px;\n padding: 0;\n display: flex;\n align-items: center;\n ", "\n transition: all 0.2s ease;\n"])), function (_ref8) {
31531
+ var maxWidth = _ref8.maxWidth;
31532
+ return maxWidth && "\n max-width: " + (maxWidth + "px") + ";\n ";
31533
+ });
31534
+ var Desc = styled.p(_templateObject6$f || (_templateObject6$f = _taggedTemplateLiteralLoose(["\n font-weight: normal;\n font-size: 13px;\n padding: 0;\n ", "\n transition: all 0.2s ease;\n"])), function (_ref9) {
31535
+ var maxWidth = _ref9.maxWidth;
31536
+ return maxWidth && "\n max-width: " + (maxWidth + "px") + ";\n ";
31537
+ });
31538
+ var Img = styled.img(_templateObject7$d || (_templateObject7$d = _taggedTemplateLiteralLoose(["\n ", "\n ", "\n object-fit: cover;\n transition: height 0.2s ease;\n"])), function (_ref0) {
31539
+ var width = _ref0.width;
31540
+ return width && "\n max-width: " + (width + "px") + ";\n min-width: " + (width + "px") + ";\n width: " + (width + "px") + ";\n ";
31541
+ }, function (_ref1) {
31542
+ var height = _ref1.height;
31543
+ return height && "\n max-height: " + (height + "px") + ";\n min-height: " + (height + "px") + ";\n height: " + (height + "px") + ";\n ";
31544
+ });
31545
+ var Favicon = styled.img(_templateObject8$c || (_templateObject8$c = _taggedTemplateLiteralLoose(["\n transition: all 0.2s ease;\n width: 24px;\n height: 24px;\n object-fit: contain;\n margin-right: 4px;\n"])));
31288
31546
 
31289
31547
  var _templateObject$B, _templateObject2$w, _templateObject3$q, _templateObject4$m, _templateObject5$i;
31290
31548
  var MessageBody = function MessageBody(_ref) {
@@ -32624,14 +32882,6 @@ var HiddenMessageProperty;
32624
32882
  })(HiddenMessageProperty || (HiddenMessageProperty = {}));
32625
32883
 
32626
32884
  var _templateObject$D, _templateObject2$y, _templateObject3$s, _templateObject4$o, _templateObject5$k, _templateObject6$h, _templateObject7$f, _templateObject8$e, _templateObject9$c, _templateObject0$b, _templateObject1$8;
32627
- var loadFromServer = false;
32628
- var loadDirection = '';
32629
- var nextDisable = false;
32630
- var prevDisable = false;
32631
- var scrollToBottom = false;
32632
- var shouldLoadMessages;
32633
- var loading = false;
32634
- var messagesIndexMap = {};
32635
32885
  var CreateMessageDateDivider = function CreateMessageDateDivider(_ref) {
32636
32886
  var lastIndex = _ref.lastIndex,
32637
32887
  currentMessageDate = _ref.currentMessageDate,
@@ -32841,6 +33091,7 @@ var MessageList = function MessageList(_ref2) {
32841
33091
  var scrollToMentionedMessage = useSelector(scrollToMentionedMessageSelector, shallowEqual);
32842
33092
  var scrollToRepliedMessage = useSelector(scrollToMessageSelector, shallowEqual);
32843
33093
  var scrollToMessageHighlight = useSelector(scrollToMessageHighlightSelector, shallowEqual);
33094
+ var scrollToMessageBehavior = useSelector(scrollToMessageBehaviorSelector, shallowEqual);
32844
33095
  var browserTabIsActive = useSelector(browserTabIsActiveSelector, shallowEqual);
32845
33096
  var hasNextMessages = useSelector(messagesHasNextSelector, shallowEqual);
32846
33097
  var hasPrevMessages = useSelector(messagesHasPrevSelector, shallowEqual);
@@ -32881,35 +33132,40 @@ var MessageList = function MessageList(_ref2) {
32881
33132
  setShouldPreserveScroll = _useState0[1];
32882
33133
  var messageForReply = {};
32883
33134
  var attachmentsSelected = false;
32884
- var messageTopDateRef = useRef(null);
33135
+ var _useState1 = useState(''),
33136
+ topDateLabel = _useState1[0],
33137
+ setTopDateLabel = _useState1[1];
32885
33138
  var scrollRef = useRef(null);
33139
+ var loadFromServerRef = useRef(false);
33140
+ var loadDirectionRef = useRef('');
33141
+ var nextDisableRef = useRef(false);
33142
+ var prevDisableRef = useRef(false);
33143
+ var scrollToBottomRef = useRef(false);
33144
+ var shouldLoadMessagesRef = useRef('');
33145
+ var loadingRef = useRef(false);
33146
+ var messagesIndexMapRef = useRef({});
33147
+ var scrollRafRef = useRef(null);
33148
+ var loadingMessagesTimeoutRef = useRef(null);
32886
33149
  var renderTopDate = function renderTopDate() {
32887
- var dateLabels = document.querySelectorAll('.divider');
32888
- var messageTopDate = messageTopDateRef.current;
33150
+ var container = scrollRef.current;
33151
+ if (!container) return;
33152
+ var dateLabels = container.querySelectorAll('.divider');
32889
33153
  var text = '';
32890
33154
  for (var i = dateLabels.length - 1; i >= 0; i--) {
32891
- var _dateLabel$firstChild;
32892
33155
  var dateLabel = dateLabels[i];
32893
- var span = dateLabel === null || dateLabel === void 0 ? void 0 : (_dateLabel$firstChild = dateLabel.firstChild) === null || _dateLabel$firstChild === void 0 ? void 0 : _dateLabel$firstChild.firstChild;
32894
- if (!text && scrollRef.current.scrollTop > dateLabel.offsetTop) {
32895
- text = span && span.innerText;
32896
- span.style.display = 'none';
32897
- } else {
32898
- span.style.display = 'block';
33156
+ if (!text && container.scrollTop > dateLabel.offsetTop) {
33157
+ var span = (dateLabel === null || dateLabel === void 0 ? void 0 : dateLabel.firstChild) && dateLabel.firstChild.firstChild;
33158
+ text = span ? span.innerText || '' : '';
32899
33159
  }
32900
33160
  }
32901
- if (text) {
32902
- messageTopDate.innerText = text;
32903
- messageTopDate.style.display = 'inline';
32904
- } else {
32905
- messageTopDate.style.display = 'none';
32906
- }
33161
+ setTopDateLabel(text);
32907
33162
  };
32908
- var handleMessagesListScroll = useCallback(function (event) {
33163
+ var handleMessagesListScroll = useCallback(function () {
32909
33164
  try {
33165
+ var target = scrollRef.current;
33166
+ if (!target) return Promise.resolve();
32910
33167
  if (scrollToMentionedMessage) {
32911
- var _target = event.target;
32912
- if (_target.scrollTop <= -50 || channel.lastMessage.id !== messages[messages.length - 1].id) {
33168
+ if (target.scrollTop <= -50 || channel.lastMessage.id !== messages[messages.length - 1].id) {
32913
33169
  dispatch(showScrollToNewMessageButtonAC(true));
32914
33170
  } else {
32915
33171
  dispatch(showScrollToNewMessageButtonAC(false));
@@ -32922,7 +33178,6 @@ var MessageList = function MessageList(_ref2) {
32922
33178
  setShowTopDate(false);
32923
33179
  }, 1000);
32924
33180
  renderTopDate();
32925
- var target = event.target;
32926
33181
  var forceLoadPrevMessages = false;
32927
33182
  if (-target.scrollTop + target.offsetHeight + 30 > target.scrollHeight) {
32928
33183
  forceLoadPrevMessages = true;
@@ -32937,51 +33192,68 @@ var MessageList = function MessageList(_ref2) {
32937
33192
  }
32938
33193
  if (scrollToReply) {
32939
33194
  target.scrollTop = scrollToReply;
32940
- } else {
32941
- if (messagesIndexMap[lastVisibleMessageId] < 15 || forceLoadPrevMessages) {
32942
- if (connectionStatus === CONNECTION_STATUS.CONNECTED && !scrollToNewMessage.scrollToBottom && hasPrevMessages) {
32943
- if (loading || messagesLoading === LOADING_STATE.LOADING || prevDisable) {
32944
- shouldLoadMessages = 'prev';
32945
- } else {
32946
- if (shouldLoadMessages === 'prev') {
32947
- shouldLoadMessages = '';
32948
- }
32949
- loadDirection = 'prev';
32950
- handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
32951
- if (!getHasPrevCached()) {
32952
- loadFromServer = true;
32953
- }
32954
- nextDisable = true;
33195
+ return Promise.resolve();
33196
+ }
33197
+ var currentIndex = messagesIndexMapRef.current[lastVisibleMessageId];
33198
+ var hasIndex = typeof currentIndex === 'number';
33199
+ if (hasIndex && currentIndex < 15 || forceLoadPrevMessages) {
33200
+ if (connectionStatus === CONNECTION_STATUS.CONNECTED && !scrollToNewMessage.scrollToBottom && hasPrevMessages) {
33201
+ if (loadingRef.current || messagesLoading === LOADING_STATE.LOADING || prevDisableRef.current) {
33202
+ shouldLoadMessagesRef.current = 'prev';
33203
+ } else {
33204
+ if (shouldLoadMessagesRef.current === 'prev') {
33205
+ shouldLoadMessagesRef.current = '';
33206
+ }
33207
+ loadDirectionRef.current = 'prev';
33208
+ handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
33209
+ if (!getHasPrevCached()) {
33210
+ loadFromServerRef.current = true;
32955
33211
  }
33212
+ nextDisableRef.current = true;
32956
33213
  }
32957
33214
  }
32958
- if (messagesIndexMap[lastVisibleMessageId] >= messages.length - 15 || target.scrollTop === 0) {
32959
- if (connectionStatus === CONNECTION_STATUS.CONNECTED && !scrollToNewMessage.scrollToBottom && (hasNextMessages || getHasNextCached())) {
32960
- if (loading || messagesLoading === LOADING_STATE.LOADING || nextDisable) {
32961
- shouldLoadMessages = 'next';
32962
- } else {
32963
- if (shouldLoadMessages === 'next') {
32964
- shouldLoadMessages = '';
32965
- }
32966
- loadDirection = 'next';
32967
- prevDisable = true;
32968
- handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
33215
+ }
33216
+ if (hasIndex && currentIndex >= messages.length - 15 || target.scrollTop === 0) {
33217
+ if (connectionStatus === CONNECTION_STATUS.CONNECTED && !scrollToNewMessage.scrollToBottom && (hasNextMessages || getHasNextCached())) {
33218
+ if (loadingRef.current || messagesLoading === LOADING_STATE.LOADING || nextDisableRef.current) {
33219
+ shouldLoadMessagesRef.current = 'next';
33220
+ } else {
33221
+ if (shouldLoadMessagesRef.current === 'next') {
33222
+ shouldLoadMessagesRef.current = '';
32969
33223
  }
33224
+ loadDirectionRef.current = 'next';
33225
+ prevDisableRef.current = true;
33226
+ handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
32970
33227
  }
32971
33228
  }
32972
- if (messagesIndexMap[lastVisibleMessageId] > messages.length - 10) {
32973
- nextDisable = false;
32974
- }
33229
+ }
33230
+ if (hasIndex && currentIndex > messages.length - 10) {
33231
+ nextDisableRef.current = false;
32975
33232
  }
32976
33233
  return Promise.resolve();
32977
33234
  } catch (e) {
32978
33235
  return Promise.reject(e);
32979
33236
  }
32980
- }, [channel === null || channel === void 0 ? void 0 : (_channel$lastMessage = channel.lastMessage) === null || _channel$lastMessage === void 0 ? void 0 : _channel$lastMessage.id, messages, scrollToMentionedMessage, scrollToNewMessage, messagesLoading, hasPrevMessages, hasNextMessages, messagesIndexMap, lastVisibleMessageId, connectionStatus, shouldLoadMessages, loadDirection, getHasPrevCached, getHasNextCached, scrollToReply, loading, prevDisable, nextDisable]);
33237
+ }, [channel === null || channel === void 0 ? void 0 : (_channel$lastMessage = channel.lastMessage) === null || _channel$lastMessage === void 0 ? void 0 : _channel$lastMessage.id, messages, scrollToMentionedMessage, scrollToNewMessage, messagesLoading, hasPrevMessages, hasNextMessages, lastVisibleMessageId, connectionStatus, getHasPrevCached, getHasNextCached, scrollToReply]);
33238
+ var onScroll = useCallback(function () {
33239
+ if (scrollRafRef.current !== null) return;
33240
+ scrollRafRef.current = window.requestAnimationFrame(function () {
33241
+ scrollRafRef.current = null;
33242
+ handleMessagesListScroll();
33243
+ });
33244
+ }, [handleMessagesListScroll]);
33245
+ useEffect(function () {
33246
+ return function () {
33247
+ if (scrollRafRef.current !== null) {
33248
+ cancelAnimationFrame(scrollRafRef.current);
33249
+ scrollRafRef.current = null;
33250
+ }
33251
+ };
33252
+ }, []);
32981
33253
  var handleScrollToRepliedMessage = function handleScrollToRepliedMessage(messageId) {
32982
33254
  try {
32983
- prevDisable = true;
32984
- nextDisable = true;
33255
+ prevDisableRef.current = true;
33256
+ nextDisableRef.current = true;
32985
33257
  if (messages.findIndex(function (msg) {
32986
33258
  return msg.id === messageId;
32987
33259
  }) >= 10) {
@@ -32995,8 +33267,8 @@ var MessageList = function MessageList(_ref2) {
32995
33267
  var positiveValue = repliedMessage.offsetTop - scrollRef.current.offsetHeight / 2 < 0 ? repliedMessage.offsetTop - scrollRef.current.offsetHeight * -1 : repliedMessage.offsetTop - scrollRef.current.offsetHeight / 2;
32996
33268
  setTimeout(function () {
32997
33269
  repliedMessage.classList.remove('highlight');
32998
- prevDisable = false;
32999
- nextDisable = false;
33270
+ prevDisableRef.current = false;
33271
+ nextDisableRef.current = false;
33000
33272
  }, 1000 + positiveValue * 0.1);
33001
33273
  }
33002
33274
  } else {
@@ -33017,10 +33289,10 @@ var MessageList = function MessageList(_ref2) {
33017
33289
  var hasNextCached = getHasNextCached();
33018
33290
  if (messagesLoading === LOADING_STATE.LOADED && connectionStatus === CONNECTION_STATUS.CONNECTED) {
33019
33291
  if (direction === MESSAGE_LOAD_DIRECTION.PREV && firstMessageId && (hasPrevMessages || hasPrevCached)) {
33020
- loading = true;
33292
+ loadingRef.current = true;
33021
33293
  dispatch(loadMoreMessagesAC(channel.id, limit, direction, firstMessageId, hasPrevMessages));
33022
33294
  } else if (direction === MESSAGE_LOAD_DIRECTION.NEXT && lastMessageId && (hasNextMessages || hasNextCached)) {
33023
- loading = true;
33295
+ loadingRef.current = true;
33024
33296
  dispatch(loadMoreMessagesAC(channel.id, limit, direction, lastMessageId, hasNextMessages));
33025
33297
  }
33026
33298
  }
@@ -33051,39 +33323,42 @@ var MessageList = function MessageList(_ref2) {
33051
33323
  setIsDragging(false);
33052
33324
  }
33053
33325
  };
33326
+ var readDroppedFiles = function readDroppedFiles(e) {
33327
+ return new Promise(function (resolve) {
33328
+ var fileList = Object.values(e.dataTransfer.files);
33329
+ var attachmentsFiles = [];
33330
+ var readFiles = 0;
33331
+ var errorCount = 0;
33332
+ fileList.forEach(function (attachment) {
33333
+ var fileReader = new FileReader();
33334
+ fileReader.onload = function (event) {
33335
+ var file = event.target.result;
33336
+ attachmentsFiles.push({
33337
+ name: attachment.name,
33338
+ data: file,
33339
+ type: attachment.type
33340
+ });
33341
+ readFiles++;
33342
+ if (readFiles + errorCount === fileList.length) {
33343
+ resolve(attachmentsFiles);
33344
+ }
33345
+ };
33346
+ fileReader.onerror = function () {
33347
+ errorCount++;
33348
+ if (readFiles + errorCount === fileList.length) {
33349
+ resolve(attachmentsFiles);
33350
+ }
33351
+ };
33352
+ fileReader.readAsDataURL(attachment);
33353
+ });
33354
+ });
33355
+ };
33054
33356
  var handleDropFile = function handleDropFile(e) {
33055
33357
  e.preventDefault();
33056
33358
  e.stopPropagation();
33057
33359
  setIsDragging(false);
33058
33360
  if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
33059
- var fileList = Object.values(e.dataTransfer.files);
33060
- new Promise(function (resolve) {
33061
- var attachmentsFiles = [];
33062
- var readFiles = 0;
33063
- var errorCount = 0;
33064
- fileList.forEach(function (attachment) {
33065
- var fileReader = new FileReader();
33066
- fileReader.onload = function (event) {
33067
- var file = event.target.result;
33068
- attachmentsFiles.push({
33069
- name: attachment.name,
33070
- data: file,
33071
- type: attachment.type
33072
- });
33073
- readFiles++;
33074
- if (readFiles + errorCount === fileList.length) {
33075
- resolve(attachmentsFiles);
33076
- }
33077
- };
33078
- fileReader.onerror = function () {
33079
- errorCount++;
33080
- if (readFiles + errorCount === fileList.length) {
33081
- resolve(attachmentsFiles);
33082
- }
33083
- };
33084
- fileReader.readAsDataURL(attachment);
33085
- });
33086
- }).then(function (result) {
33361
+ readDroppedFiles(e).then(function (result) {
33087
33362
  dispatch(setDraggedAttachmentsAC(result, 'file'));
33088
33363
  })["catch"](function (error) {
33089
33364
  console.error('Error in handleDropFile:', error);
@@ -33096,34 +33371,7 @@ var MessageList = function MessageList(_ref2) {
33096
33371
  e.stopPropagation();
33097
33372
  setIsDragging(false);
33098
33373
  if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
33099
- var fileList = Object.values(e.dataTransfer.files);
33100
- new Promise(function (resolve) {
33101
- var attachmentsFiles = [];
33102
- var readFiles = 0;
33103
- var errorCount = 0;
33104
- fileList.forEach(function (attachment) {
33105
- var fileReader = new FileReader();
33106
- fileReader.onload = function (event) {
33107
- var file = event.target.result;
33108
- attachmentsFiles.push({
33109
- name: attachment.name,
33110
- data: file,
33111
- type: attachment.type
33112
- });
33113
- readFiles++;
33114
- if (readFiles + errorCount === fileList.length) {
33115
- resolve(attachmentsFiles);
33116
- }
33117
- };
33118
- fileReader.onerror = function () {
33119
- errorCount++;
33120
- if (readFiles + errorCount === fileList.length) {
33121
- resolve(attachmentsFiles);
33122
- }
33123
- };
33124
- fileReader.readAsDataURL(attachment);
33125
- });
33126
- }).then(function (result) {
33374
+ readDroppedFiles(e).then(function (result) {
33127
33375
  dispatch(setDraggedAttachmentsAC(result, 'media'));
33128
33376
  })["catch"](function (error) {
33129
33377
  console.error('Error in handleDropMedia:', error);
@@ -33135,21 +33383,21 @@ var MessageList = function MessageList(_ref2) {
33135
33383
  var _messages, _channel$lastMessage2;
33136
33384
  if (messages.length > 0 && ((_messages = messages[messages.length - 1]) === null || _messages === void 0 ? void 0 : _messages.id) === ((_channel$lastMessage2 = channel.lastMessage) === null || _channel$lastMessage2 === void 0 ? void 0 : _channel$lastMessage2.id) && scrollRef.current && scrollRef.current.scrollTop > -50 && !showScrollToNewMessageButton) {
33137
33385
  dispatch(showScrollToNewMessageButtonAC(false));
33138
- prevDisable = false;
33386
+ prevDisableRef.current = false;
33139
33387
  }
33140
33388
  }, [messages, channel === null || channel === void 0 ? void 0 : (_channel$lastMessage3 = channel.lastMessage) === null || _channel$lastMessage3 === void 0 ? void 0 : _channel$lastMessage3.id, scrollRef === null || scrollRef === void 0 ? void 0 : (_scrollRef$current = scrollRef.current) === null || _scrollRef$current === void 0 ? void 0 : _scrollRef$current.scrollTop, showScrollToNewMessageButton]);
33141
33389
  useEffect(function () {
33142
33390
  if (scrollToRepliedMessage) {
33143
- loading = false;
33391
+ loadingRef.current = false;
33144
33392
  scrollRef.current.style.scrollBehavior = 'inherit';
33145
33393
  var repliedMessage = document.getElementById(scrollToRepliedMessage);
33146
33394
  if (repliedMessage) {
33147
33395
  setScrollToReply(repliedMessage && repliedMessage.offsetTop - (channel.backToLinkedChannel ? 0 : 200));
33148
33396
  scrollRef.current.scrollTo({
33149
33397
  top: repliedMessage && repliedMessage.offsetTop - (channel.backToLinkedChannel ? 0 : 200),
33150
- behavior: 'smooth'
33398
+ behavior: scrollToMessageBehavior
33151
33399
  });
33152
- scrollRef.current.style.scrollBehavior = 'smooth';
33400
+ scrollRef.current.style.scrollBehavior = scrollToMessageBehavior;
33153
33401
  if (!channel.backToLinkedChannel && scrollToMessageHighlight) {
33154
33402
  repliedMessage && repliedMessage.classList.add('highlight');
33155
33403
  }
@@ -33159,9 +33407,9 @@ var MessageList = function MessageList(_ref2) {
33159
33407
  var _repliedMessage = document.getElementById(scrollToRepliedMessage);
33160
33408
  _repliedMessage && _repliedMessage.classList.remove('highlight');
33161
33409
  }
33162
- prevDisable = false;
33410
+ prevDisableRef.current = false;
33163
33411
  setScrollToReply(null);
33164
- scrollRef.current.style.scrollBehavior = 'smooth';
33412
+ scrollRef.current.style.scrollBehavior = 'instant';
33165
33413
  }, 1000 + positiveValue * 0.1);
33166
33414
  }
33167
33415
  dispatch(setScrollToMessagesAC(null));
@@ -33177,15 +33425,15 @@ var MessageList = function MessageList(_ref2) {
33177
33425
  });
33178
33426
  }
33179
33427
  } else {
33180
- nextDisable = true;
33181
- prevDisable = true;
33428
+ nextDisableRef.current = true;
33429
+ prevDisableRef.current = true;
33182
33430
  scrollRef.current.scrollTo({
33183
33431
  top: 0,
33184
33432
  behavior: 'smooth'
33185
33433
  });
33186
33434
  dispatch(showScrollToNewMessageButtonAC(false));
33187
33435
  setTimeout(function () {
33188
- prevDisable = false;
33436
+ prevDisableRef.current = false;
33189
33437
  }, 800);
33190
33438
  }
33191
33439
  }
@@ -33203,11 +33451,18 @@ var MessageList = function MessageList(_ref2) {
33203
33451
  useEffect(function () {
33204
33452
  setHasNextCached(false);
33205
33453
  setHasPrevCached(false);
33454
+ messagesIndexMapRef.current = {};
33455
+ loadFromServerRef.current = false;
33456
+ loadDirectionRef.current = '';
33457
+ nextDisableRef.current = false;
33458
+ prevDisableRef.current = false;
33459
+ shouldLoadMessagesRef.current = '';
33460
+ loadingRef.current = false;
33206
33461
  if (channel.backToLinkedChannel) {
33207
33462
  var visibleMessages = getVisibleMessagesMap();
33208
33463
  var visibleMessagesIds = Object.keys(visibleMessages);
33209
33464
  var messageId = visibleMessagesIds[visibleMessagesIds.length - 1];
33210
- dispatch(getMessagesAC(channel, undefined, messageId));
33465
+ dispatch(getMessagesAC(channel, undefined, messageId, undefined, undefined, undefined, 'instant'));
33211
33466
  setUnreadMessageId(messageId);
33212
33467
  } else {
33213
33468
  if (!channel.isLinkedChannel) {
@@ -33230,9 +33485,9 @@ var MessageList = function MessageList(_ref2) {
33230
33485
  }
33231
33486
  setPreviousScrollTop(0);
33232
33487
  setShouldPreserveScroll(false);
33233
- nextDisable = false;
33234
- prevDisable = false;
33235
- scrollToBottom = true;
33488
+ nextDisableRef.current = false;
33489
+ prevDisableRef.current = false;
33490
+ scrollToBottomRef.current = true;
33236
33491
  setAllowEditDeleteIncomingMessage(allowEditDeleteIncomingMessage);
33237
33492
  }, [channel.id]);
33238
33493
  useEffect(function () {
@@ -33247,7 +33502,7 @@ var MessageList = function MessageList(_ref2) {
33247
33502
  setUnreadMessageId('');
33248
33503
  }
33249
33504
  }
33250
- }, [messages]);
33505
+ }, [messages, hiddenMessagesProperties, user === null || user === void 0 ? void 0 : user.id]);
33251
33506
  useEffect(function () {
33252
33507
  if (scrollRef.current) {
33253
33508
  var isAtBottom = scrollRef.current.scrollTop > -50;
@@ -33256,35 +33511,40 @@ var MessageList = function MessageList(_ref2) {
33256
33511
  setShouldPreserveScroll(true);
33257
33512
  }
33258
33513
  }
33259
- if (loading) {
33260
- if (loadDirection !== 'next') {
33514
+ if (loadingRef.current) {
33515
+ if (loadDirectionRef.current !== 'next') {
33261
33516
  var lastVisibleMessage = document.getElementById(lastVisibleMessageId);
33262
33517
  if (lastVisibleMessage) {
33263
33518
  scrollRef.current.style.scrollBehavior = 'inherit';
33264
33519
  scrollRef.current.scrollTop = lastVisibleMessage.offsetTop;
33265
33520
  scrollRef.current.style.scrollBehavior = 'smooth';
33266
33521
  }
33267
- if (loadFromServer) {
33268
- setTimeout(function () {
33269
- loading = false;
33270
- loadFromServer = false;
33271
- nextDisable = false;
33272
- if (shouldLoadMessages === 'prev' && messagesIndexMap[lastVisibleMessageId] < 15) {
33522
+ if (loadFromServerRef.current) {
33523
+ var timeout = setTimeout(function () {
33524
+ loadingRef.current = false;
33525
+ loadFromServerRef.current = false;
33526
+ nextDisableRef.current = false;
33527
+ var currentIndex = messagesIndexMapRef.current[lastVisibleMessageId];
33528
+ if (shouldLoadMessagesRef.current === 'prev' && typeof currentIndex === 'number' && currentIndex < 15) {
33273
33529
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
33274
33530
  }
33275
- if (shouldLoadMessages === 'next' && messagesIndexMap[lastVisibleMessageId] > messages.length - 15) {
33531
+ if (shouldLoadMessagesRef.current === 'next' && typeof currentIndex === 'number' && currentIndex > messages.length - 15) {
33276
33532
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
33277
33533
  }
33278
33534
  }, 50);
33535
+ if (loadingMessagesTimeoutRef.current) {
33536
+ clearTimeout(loadingMessagesTimeoutRef.current);
33537
+ }
33538
+ loadingMessagesTimeoutRef.current = timeout;
33279
33539
  } else {
33280
- loading = false;
33281
- if (shouldLoadMessages === 'prev') {
33540
+ loadingRef.current = false;
33541
+ if (shouldLoadMessagesRef.current === 'prev') {
33282
33542
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
33283
- shouldLoadMessages = '';
33543
+ shouldLoadMessagesRef.current = '';
33284
33544
  }
33285
- if (shouldLoadMessages === 'next') {
33545
+ if (shouldLoadMessagesRef.current === 'next') {
33286
33546
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
33287
- shouldLoadMessages = '';
33547
+ shouldLoadMessagesRef.current = '';
33288
33548
  }
33289
33549
  }
33290
33550
  } else {
@@ -33294,22 +33554,26 @@ var MessageList = function MessageList(_ref2) {
33294
33554
  scrollRef.current.scrollTop = _lastVisibleMessage.offsetTop - scrollRef.current.offsetHeight + _lastVisibleMessage.offsetHeight;
33295
33555
  scrollRef.current.style.scrollBehavior = 'smooth';
33296
33556
  }
33297
- loading = false;
33298
- prevDisable = false;
33299
- if (shouldLoadMessages === 'prev') {
33557
+ loadingRef.current = false;
33558
+ prevDisableRef.current = false;
33559
+ if (shouldLoadMessagesRef.current === 'prev') {
33300
33560
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
33301
- shouldLoadMessages = '';
33561
+ shouldLoadMessagesRef.current = '';
33302
33562
  }
33303
- if (shouldLoadMessages === 'next') {
33563
+ if (shouldLoadMessagesRef.current === 'next') {
33304
33564
  handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
33305
- shouldLoadMessages = '';
33565
+ shouldLoadMessagesRef.current = '';
33306
33566
  }
33307
33567
  }
33308
33568
  }
33309
33569
  renderTopDate();
33310
- if (scrollToBottom) {
33311
- dispatch(scrollToNewMessageAC(true));
33312
- scrollToBottom = false;
33570
+ if (scrollToBottomRef.current) {
33571
+ if (channel.backToLinkedChannel) {
33572
+ dispatch(scrollToNewMessageAC(false));
33573
+ } else {
33574
+ dispatch(scrollToNewMessageAC(true));
33575
+ }
33576
+ scrollToBottomRef.current = false;
33313
33577
  }
33314
33578
  if (shouldPreserveScroll && scrollRef.current && previousScrollTop > 0) {
33315
33579
  requestAnimationFrame(function () {
@@ -33322,13 +33586,43 @@ var MessageList = function MessageList(_ref2) {
33322
33586
  setPreviousScrollTop(0);
33323
33587
  });
33324
33588
  }
33589
+ return function () {
33590
+ if (loadingMessagesTimeoutRef.current) {
33591
+ clearTimeout(loadingMessagesTimeoutRef.current);
33592
+ }
33593
+ };
33325
33594
  }, [messages]);
33595
+ useEffect(function () {
33596
+ if (messagesLoading === LOADING_STATE.LOADED) {
33597
+ var timeout = setTimeout(function () {
33598
+ loadingRef.current = false;
33599
+ loadFromServerRef.current = false;
33600
+ nextDisableRef.current = false;
33601
+ var currentIndex = messagesIndexMapRef.current[lastVisibleMessageId];
33602
+ if (shouldLoadMessagesRef.current === 'prev' && typeof currentIndex === 'number' && currentIndex < 15) {
33603
+ handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.PREV, LOAD_MAX_MESSAGE_COUNT);
33604
+ }
33605
+ if (shouldLoadMessagesRef.current === 'next' && typeof currentIndex === 'number' && currentIndex > messages.length - 15) {
33606
+ handleLoadMoreMessages(MESSAGE_LOAD_DIRECTION.NEXT, LOAD_MAX_MESSAGE_COUNT);
33607
+ }
33608
+ }, 50);
33609
+ if (loadingMessagesTimeoutRef.current) {
33610
+ clearTimeout(loadingMessagesTimeoutRef.current);
33611
+ }
33612
+ loadingMessagesTimeoutRef.current = timeout;
33613
+ }
33614
+ return function () {
33615
+ if (loadingMessagesTimeoutRef.current) {
33616
+ clearTimeout(loadingMessagesTimeoutRef.current);
33617
+ }
33618
+ };
33619
+ }, [messagesLoading, messages, lastVisibleMessageId]);
33326
33620
  useEffect(function () {
33327
33621
  log.info('connection status is changed.. .... ', connectionStatus, 'channel ... ', channel);
33328
33622
  if (connectionStatus === CONNECTION_STATUS.CONNECTED) {
33329
- loading = false;
33330
- prevDisable = false;
33331
- nextDisable = false;
33623
+ loadingRef.current = false;
33624
+ prevDisableRef.current = false;
33625
+ nextDisableRef.current = false;
33332
33626
  clearMessagesMap();
33333
33627
  removeAllMessages();
33334
33628
  if (channel.id) {
@@ -33337,7 +33631,8 @@ var MessageList = function MessageList(_ref2) {
33337
33631
  }
33338
33632
  }, [connectionStatus]);
33339
33633
  useEffect(function () {
33340
- if (channel.newMessageCount && channel.newMessageCount > 0 && getUnreadScrollTo()) {
33634
+ var unreadScrollTo = getUnreadScrollTo();
33635
+ if (channel.newMessageCount && channel.newMessageCount > 0 && unreadScrollTo) {
33341
33636
  if (scrollRef.current) {
33342
33637
  scrollRef.current.style.scrollBehavior = 'inherit';
33343
33638
  }
@@ -33350,7 +33645,14 @@ var MessageList = function MessageList(_ref2) {
33350
33645
  setUnreadScrollTo(false);
33351
33646
  }
33352
33647
  }
33353
- });
33648
+ }, [channel.id, channel.newMessageCount, channel.lastDisplayedMessageId]);
33649
+ useEffect(function () {
33650
+ return function () {
33651
+ if (hideTopDateTimeout.current) {
33652
+ clearTimeout(hideTopDateTimeout.current);
33653
+ }
33654
+ };
33655
+ }, []);
33354
33656
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, isDragging && !(attachmentsPreview !== null && attachmentsPreview !== void 0 && attachmentsPreview.show && mediaFile) && (/*#__PURE__*/React__default.createElement(DragAndDropContainer, {
33355
33657
  id: 'draggingContainer',
33356
33658
  draggable: true,
@@ -33393,14 +33695,12 @@ var MessageList = function MessageList(_ref2) {
33393
33695
  dateDividerBackgroundColor: dateDividerBackgroundColor || overlayBackground,
33394
33696
  dateDividerBorderRadius: dateDividerBorderRadius,
33395
33697
  topOffset: scrollRef && scrollRef.current && scrollRef.current.offsetTop
33396
- }, /*#__PURE__*/React__default.createElement("span", {
33397
- ref: messageTopDateRef
33398
- }))), /*#__PURE__*/React__default.createElement(Container$h, {
33698
+ }, /*#__PURE__*/React__default.createElement("span", null, topDateLabel))), /*#__PURE__*/React__default.createElement(Container$h, {
33399
33699
  id: 'scrollableDiv',
33400
33700
  className: isScrolling ? 'show-scrollbar' : '',
33401
33701
  ref: scrollRef,
33402
33702
  stopScrolling: stopScrolling,
33403
- onScroll: handleMessagesListScroll,
33703
+ onScroll: onScroll,
33404
33704
  onMouseEnter: function onMouseEnter() {
33405
33705
  return setIsScrolling(true);
33406
33706
  },
@@ -33419,8 +33719,10 @@ var MessageList = function MessageList(_ref2) {
33419
33719
  var prevMessage = messages[index - 1];
33420
33720
  var nextMessage = messages[index + 1];
33421
33721
  var isUnreadMessage = !!(unreadMessageId && unreadMessageId === message.id && nextMessage) && !channel.backToLinkedChannel;
33422
- messagesIndexMap[message.id] = index;
33423
- return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(CreateMessageDateDivider, {
33722
+ messagesIndexMapRef.current[message.id] = index;
33723
+ return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
33724
+ key: message.id || message.tid
33725
+ }, /*#__PURE__*/React__default.createElement(CreateMessageDateDivider, {
33424
33726
  noMargin: !isUnreadMessage && prevMessage && prevMessage.type === 'system' && message.type !== 'system',
33425
33727
  theme: theme,
33426
33728
  lastIndex: false,
@@ -36114,8 +36416,12 @@ var AudioRecord = function AudioRecord(_ref) {
36114
36416
  }
36115
36417
  }, [currentRecordedFile]);
36116
36418
  useEffect(function () {
36419
+ if (!showRecording) {
36420
+ setCurrentTime(0);
36421
+ }
36117
36422
  return function () {
36118
36423
  handleStopRecording();
36424
+ setCurrentTime(0);
36119
36425
  };
36120
36426
  }, [showRecording]);
36121
36427
  useEffect(function () {
@@ -37355,7 +37661,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
37355
37661
  if (attachments.length) {
37356
37662
  var videoAttachment = false;
37357
37663
  attachments.forEach(function (att) {
37358
- if (att.type === 'video' || att.data.type.split('/')[0] === 'video') {
37664
+ if ((att.type === 'video' || att.data.type.split('/')[0] === 'video') && att.type !== 'file') {
37359
37665
  videoAttachment = true;
37360
37666
  if (!readyVideoAttachments[att.tid]) {
37361
37667
  setSendMessageIsActive(false);
@@ -38199,7 +38505,6 @@ function SvgUnpin(props) {
38199
38505
 
38200
38506
  var _templateObject$K, _templateObject2$F, _templateObject3$y, _templateObject4$t, _templateObject5$p, _templateObject6$l, _templateObject7$j, _templateObject8$h, _templateObject9$e, _templateObject0$d, _templateObject1$a, _templateObject10$6, _templateObject11$6, _templateObject12$5, _templateObject13$4, _templateObject14$3, _templateObject15$3, _templateObject16$3;
38201
38507
  var Actions = function Actions(_ref) {
38202
- var _channel$metadata;
38203
38508
  var setActionsHeight = _ref.setActionsHeight,
38204
38509
  channel = _ref.channel,
38205
38510
  actionMenuOpen = _ref.actionMenuOpen,
@@ -38317,7 +38622,7 @@ var Actions = function Actions(_ref) {
38317
38622
  var twoHours = oneHour * 2;
38318
38623
  var oneDay = oneHour * 24;
38319
38624
  var isDirectChannel = channel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
38320
- var isSelfChannel = isDirectChannel && ((_channel$metadata = channel.metadata) === null || _channel$metadata === void 0 ? void 0 : _channel$metadata.s);
38625
+ var isSelfChannel = isDirectChannel && channel.memberCount === 1 && channel.members.length > 0 && channel.members[0].id === user.id;
38321
38626
  var directChannelUser = isDirectChannel && channel.members.find(function (member) {
38322
38627
  return member.id !== user.id;
38323
38628
  });
@@ -40224,7 +40529,7 @@ var EditChannel = function EditChannel(_ref) {
40224
40529
 
40225
40530
  var _templateObject$V, _templateObject2$O, _templateObject3$F, _templateObject4$z, _templateObject5$u, _templateObject6$p, _templateObject7$n, _templateObject8$l, _templateObject9$g, _templateObject0$e, _templateObject1$b, _templateObject10$7;
40226
40531
  var Details = function Details(_ref) {
40227
- var _activeChannel$metada, _activeChannel$member;
40532
+ var _activeChannel$member;
40228
40533
  var detailsTitleText = _ref.detailsTitleText,
40229
40534
  editDetailsTitleText = _ref.editDetailsTitleText,
40230
40535
  detailsTitleFontSize = _ref.detailsTitleFontSize,
@@ -40379,7 +40684,7 @@ var Details = function Details(_ref) {
40379
40684
  var detailsHeaderRef = useRef(null);
40380
40685
  var openTimeOut = useRef(null);
40381
40686
  var isDirectChannel = activeChannel && activeChannel.type === DEFAULT_CHANNEL_TYPE.DIRECT;
40382
- var isSelfChannel = isDirectChannel && ((_activeChannel$metada = activeChannel.metadata) === null || _activeChannel$metada === void 0 ? void 0 : _activeChannel$metada.s);
40687
+ var isSelfChannel = isDirectChannel && activeChannel.memberCount === 1 && activeChannel.members.length > 0 && activeChannel.members[0].id === user.id;
40383
40688
  var memberDisplayText = getChannelTypesMemberDisplayTextMap();
40384
40689
  var displayMemberText = memberDisplayText && (memberDisplayText[activeChannel.type] ? activeChannel.memberCount > 1 ? memberDisplayText[activeChannel.type] + "s" : memberDisplayText[activeChannel.type] : activeChannel.type === DEFAULT_CHANNEL_TYPE.BROADCAST || activeChannel.type === DEFAULT_CHANNEL_TYPE.PUBLIC ? activeChannel.memberCount > 1 ? 'subscribers' : 'subscriber' : activeChannel.memberCount > 1 ? 'members' : 'member');
40385
40690
  var directChannelUser = isDirectChannel && (activeChannel.members.find(function (member) {
@@ -40493,7 +40798,7 @@ var Details = function Details(_ref) {
40493
40798
  color: textSecondary,
40494
40799
  fontSize: channelMembersFontSize,
40495
40800
  lineHeight: channelMembersLineHeight
40496
- }, showPhoneNumber ? "+" + (directChannelUser === null || directChannelUser === void 0 ? void 0 : directChannelUser.id) : hideUserPresence && directChannelUser && hideUserPresence(directChannelUser) ? '' : directChannelUser && directChannelUser.presence && (directChannelUser.presence.state === USER_PRESENCE_STATUS.ONLINE ? 'Online' : directChannelUser.presence.lastActiveAt && userLastActiveDateFormat(directChannelUser.presence.lastActiveAt)))) : (/*#__PURE__*/React__default.createElement(SubTitle, {
40801
+ }, showPhoneNumber && directChannelUser !== null && directChannelUser !== void 0 && directChannelUser.id ? "+" + (directChannelUser === null || directChannelUser === void 0 ? void 0 : directChannelUser.id) : hideUserPresence && directChannelUser && hideUserPresence(directChannelUser) ? '' : directChannelUser && directChannelUser.presence && (directChannelUser.presence.state === USER_PRESENCE_STATUS.ONLINE ? 'Online' : directChannelUser.presence.lastActiveAt && userLastActiveDateFormat(directChannelUser.presence.lastActiveAt)))) : (/*#__PURE__*/React__default.createElement(SubTitle, {
40497
40802
  color: textSecondary,
40498
40803
  fontSize: channelMembersFontSize,
40499
40804
  lineHeight: channelMembersLineHeight
@@ -40947,10 +41252,10 @@ var MessagesScrollToBottomButton = function MessagesScrollToBottomButton(_ref) {
40947
41252
  };
40948
41253
  var handleScrollToLastMessage = function handleScrollToLastMessage(messageId) {
40949
41254
  try {
40950
- dispatch(scrollToNewMessageAC(true, false, false));
40951
41255
  if (messages.findIndex(function (msg) {
40952
41256
  return msg.id === messageId;
40953
41257
  }) >= 10) {
41258
+ dispatch(scrollToNewMessageAC(true, false, false));
40954
41259
  dispatch(setMessagesLoadingStateAC(LOADING_STATE.LOADING));
40955
41260
  var repliedMessage = document.getElementById(messageId);
40956
41261
  if (repliedMessage) {