sceyt-chat-react-uikit 1.7.1-beta.10 → 1.7.1-beta.11

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.
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { IChannel, IContact } from '../../types';
2
+ import { IChannel, IContact, IMessage, IUser } from '../../types';
3
3
  interface IChannelProps {
4
4
  channel: IChannel;
5
5
  showAvatar?: boolean;
@@ -26,6 +26,26 @@ interface IChannelProps {
26
26
  channelLastMessageTimeFontSize?: string;
27
27
  channelAvatarSize?: number;
28
28
  channelAvatarTextSize?: number;
29
+ setSelectedChannel: (channel: IChannel) => void;
30
+ getCustomLatestMessage?: (args: {
31
+ lastMessage: IMessage;
32
+ typingOrRecording: any;
33
+ draftMessageText: any;
34
+ textSecondary: string;
35
+ channel: IChannel;
36
+ channelLastMessageFontSize: string;
37
+ channelLastMessageHeight: string;
38
+ isDirectChannel: boolean;
39
+ textPrimary: string;
40
+ messageAuthorRef: any;
41
+ contactsMap: {
42
+ [key: string]: IContact;
43
+ };
44
+ getFromContacts: boolean;
45
+ warningColor: string;
46
+ user: IUser;
47
+ MessageText: any;
48
+ }) => any;
29
49
  }
30
50
  declare const Channel: React.FC<IChannelProps>;
31
51
  export default Channel;
@@ -1,5 +1,5 @@
1
1
  import React, { FC } from 'react';
2
- import { IChannel, IContact } from '../../types';
2
+ import { IChannel, IContact, IMessage, IUser } from '../../types';
3
3
  interface IChannelListProps {
4
4
  List?: FC<{
5
5
  channels: IChannel[];
@@ -74,6 +74,9 @@ interface IChannelListProps {
74
74
  onChannelHidden?: (channelList: IChannel[], hiddenChannel: IChannel, setChannels: (updatedChannelList: IChannel[]) => void) => void;
75
75
  onChannelVisible?: (channelList: IChannel[], visibleChannel: IChannel, setChannels: (updatedChannelList: IChannel[]) => void) => void;
76
76
  onAddedToChannel?: (channelList: IChannel[], channel: IChannel, setChannels: (updatedChannelList: IChannel[]) => void) => void;
77
+ getCustomLatestMessage?: (lastMessage: IMessage, typingOrRecording: any, draftMessageText: any, textSecondary: string, channel: IChannel, channelLastMessageFontSize: string, channelLastMessageHeight: string, isDirectChannel: boolean, textPrimary: string, messageAuthorRef: any, contactsMap: {
78
+ [key: string]: IContact;
79
+ }, getFromContacts: boolean, warningColor: string, user: IUser, MessageText: any) => any;
77
80
  }
78
81
  declare const ChannelList: React.FC<IChannelListProps>;
79
82
  export default ChannelList;
package/index.js CHANGED
@@ -18855,16 +18855,23 @@ function getMessageQuery(action) {
18855
18855
  _context0.n = 4;
18856
18856
  return effects.put(setScrollToMessagesAC(messageId, false));
18857
18857
  case 4:
18858
- _context0.n = 6;
18859
- break;
18858
+ if (!(channel.lastMessage.id === messageId)) {
18859
+ _context0.n = 5;
18860
+ break;
18861
+ }
18862
+ _context0.n = 5;
18863
+ return effects.put(updateChannelLastMessageAC(messages[0], channel));
18860
18864
  case 5:
18861
- _context0.p = 5;
18865
+ _context0.n = 7;
18866
+ break;
18867
+ case 6:
18868
+ _context0.p = 6;
18862
18869
  _t0 = _context0.v;
18863
18870
  log.error('error in message query', _t0);
18864
- case 6:
18871
+ case 7:
18865
18872
  return _context0.a(2);
18866
18873
  }
18867
- }, _marked8$1, null, [[0, 5]]);
18874
+ }, _marked8$1, null, [[0, 6]]);
18868
18875
  }
18869
18876
  function loadMoreMessages(action) {
18870
18877
  var payload, limit, direction, channelId, messageId, hasNext, SceytChatClient, messageQueryBuilder, messageQuery, result, _t1;
@@ -21164,7 +21171,9 @@ var Channel = function Channel(_ref3) {
21164
21171
  channelLastMessageTimeFontSize = _ref3.channelLastMessageTimeFontSize,
21165
21172
  channelLastMessageHeight = _ref3.channelLastMessageHeight,
21166
21173
  channelAvatarSize = _ref3.channelAvatarSize,
21167
- channelAvatarTextSize = _ref3.channelAvatarTextSize;
21174
+ channelAvatarTextSize = _ref3.channelAvatarTextSize,
21175
+ setSelectedChannel = _ref3.setSelectedChannel,
21176
+ getCustomLatestMessage = _ref3.getCustomLatestMessage;
21168
21177
  var _useColor = useColors(),
21169
21178
  accentColor = _useColor[THEME_COLORS.ACCENT],
21170
21179
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -21202,13 +21211,6 @@ var Channel = function Channel(_ref3) {
21202
21211
  statusWidth = _useState3[0],
21203
21212
  setStatusWidth = _useState3[1];
21204
21213
  var avatarName = channel.subject || (isDirectChannel && directChannelUser ? directChannelUser.firstName || directChannelUser.id : isSelfChannel ? 'Me' : '');
21205
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
21206
- if (activeChannel.id !== chan.id) {
21207
- dispatch(sendTypingAC(false));
21208
- dispatch(clearMessagesAC());
21209
- dispatch(switchChannelActionAC(chan));
21210
- }
21211
- };
21212
21214
  var messageAuthorRef = React.useRef(null);
21213
21215
  var messageTimeAndStatusRef = React.useRef(null);
21214
21216
  useUpdatePresence(channel, true);
@@ -21293,6 +21295,40 @@ var Channel = function Channel(_ref3) {
21293
21295
  isDirectChannel: isDirectChannel
21294
21296
  });
21295
21297
  }, [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]);
21298
+ var getCustomLatestMessageComponent = React.useCallback(function (_ref4) {
21299
+ var lastMessage = _ref4.lastMessage,
21300
+ typingOrRecording = _ref4.typingOrRecording,
21301
+ draftMessageText = _ref4.draftMessageText,
21302
+ textSecondary = _ref4.textSecondary,
21303
+ channel = _ref4.channel,
21304
+ channelLastMessageFontSize = _ref4.channelLastMessageFontSize,
21305
+ channelLastMessageHeight = _ref4.channelLastMessageHeight,
21306
+ isDirectChannel = _ref4.isDirectChannel,
21307
+ textPrimary = _ref4.textPrimary,
21308
+ messageAuthorRef = _ref4.messageAuthorRef,
21309
+ contactsMap = _ref4.contactsMap,
21310
+ getFromContacts = _ref4.getFromContacts,
21311
+ warningColor = _ref4.warningColor,
21312
+ user = _ref4.user,
21313
+ MessageText = _ref4.MessageText;
21314
+ return getCustomLatestMessage && getCustomLatestMessage({
21315
+ lastMessage: lastMessage,
21316
+ typingOrRecording: typingOrRecording,
21317
+ draftMessageText: draftMessageText,
21318
+ textSecondary: textSecondary,
21319
+ channel: channel,
21320
+ channelLastMessageFontSize: channelLastMessageFontSize,
21321
+ channelLastMessageHeight: channelLastMessageHeight,
21322
+ isDirectChannel: isDirectChannel,
21323
+ textPrimary: textPrimary,
21324
+ messageAuthorRef: messageAuthorRef,
21325
+ contactsMap: contactsMap,
21326
+ getFromContacts: getFromContacts,
21327
+ warningColor: warningColor,
21328
+ user: user,
21329
+ MessageText: MessageText
21330
+ });
21331
+ }, [getCustomLatestMessage, lastMessage, typingOrRecording, draftMessageText, textSecondary, channel, channelLastMessageFontSize, channelLastMessageHeight, isDirectChannel, textPrimary, messageAuthorRef, contactsMap, getFromContacts, warningColor, user, MessageText]);
21296
21332
  return /*#__PURE__*/React__default.createElement(Container$2, {
21297
21333
  theme: theme,
21298
21334
  selectedChannel: channel.id === activeChannel.id,
@@ -21303,7 +21339,7 @@ var Channel = function Channel(_ref3) {
21303
21339
  selectedChannelBorderRadius: selectedChannelBorderRadius,
21304
21340
  channelsMargin: channelsMargin,
21305
21341
  onClick: function onClick() {
21306
- return handleChangeActiveChannel(channel);
21342
+ return setSelectedChannel(channel);
21307
21343
  },
21308
21344
  hoverBackground: channelHoverBackground || backgroundHovered
21309
21345
  }, showAvatar && (/*#__PURE__*/React__default.createElement(AvatarWrapper, null, /*#__PURE__*/React__default.createElement(Avatar, {
@@ -21329,7 +21365,23 @@ var Channel = function Channel(_ref3) {
21329
21365
  avatarSize: channelAvatarSize
21330
21366
  }, /*#__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, {
21331
21367
  color: notificationsIsMutedIconColor || iconInactive
21332
- }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21368
+ }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), getCustomLatestMessage ? getCustomLatestMessageComponent({
21369
+ lastMessage: lastMessage,
21370
+ typingOrRecording: typingOrRecording,
21371
+ draftMessageText: draftMessageText,
21372
+ textSecondary: textSecondary,
21373
+ channel: channel,
21374
+ channelLastMessageFontSize: channelLastMessageFontSize || '14px',
21375
+ channelLastMessageHeight: channelLastMessageHeight || '20px',
21376
+ isDirectChannel: isDirectChannel,
21377
+ textPrimary: textPrimary,
21378
+ messageAuthorRef: messageAuthorRef,
21379
+ contactsMap: contactsMap || {},
21380
+ getFromContacts: getFromContacts,
21381
+ warningColor: warningColor,
21382
+ user: user,
21383
+ MessageText: MessageText
21384
+ }) : (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21333
21385
  color: textSecondary,
21334
21386
  markedAsUnread: !!(channel.unread || channel.newMessageCount && channel.newMessageCount > 0),
21335
21387
  unreadMentions: !!(channel.newMentionCount && channel.newMentionCount > 0),
@@ -21432,9 +21484,9 @@ var Container$2 = styled__default.div(_templateObject6$1 || (_templateObject6$1
21432
21484
  return props.channelsMargin || '0 8px';
21433
21485
  }, function (props) {
21434
21486
  return props.selectedChannelBorderRadius || '12px';
21435
- }, function (_ref4) {
21436
- var selectedChannel = _ref4.selectedChannel,
21437
- hoverBackground = _ref4.hoverBackground;
21487
+ }, function (_ref5) {
21488
+ var selectedChannel = _ref5.selectedChannel,
21489
+ hoverBackground = _ref5.hoverBackground;
21438
21490
  return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
21439
21491
  }, UserStatus, function (props) {
21440
21492
  return props.selectedChannel ? props.selectedBackgroundColor : props.hoverBackground;
@@ -21449,9 +21501,9 @@ var DraftMessageText = styled__default.span(_templateObject8$1 || (_templateObje
21449
21501
  });
21450
21502
  var LastMessageAuthor = styled__default.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) {
21451
21503
  return props.color;
21452
- }, function (_ref5) {
21453
- var typing = _ref5.typing,
21454
- recording = _ref5.recording;
21504
+ }, function (_ref6) {
21505
+ var typing = _ref6.typing,
21506
+ recording = _ref6.recording;
21455
21507
  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 ";
21456
21508
  });
21457
21509
  var Points = styled__default.span(_templateObject0$1 || (_templateObject0$1 = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n color: ", ";\n font-style: normal;\n"])), function (props) {
@@ -23369,7 +23421,8 @@ var ChannelList = function ChannelList(_ref) {
23369
23421
  channelAvatarTextSize = _ref.channelAvatarTextSize,
23370
23422
  searchChannelInputFontSize = _ref.searchChannelInputFontSize,
23371
23423
  searchedChannelsTitleFontSize = _ref.searchedChannelsTitleFontSize,
23372
- searchChannelsPadding = _ref.searchChannelsPadding;
23424
+ searchChannelsPadding = _ref.searchChannelsPadding,
23425
+ getCustomLatestMessage = _ref.getCustomLatestMessage;
23373
23426
  var _useColor = useColors(),
23374
23427
  background = _useColor[THEME_COLORS.BACKGROUND],
23375
23428
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -23437,11 +23490,6 @@ var ChannelList = function ChannelList(_ref) {
23437
23490
  handleLoadMoreChannels();
23438
23491
  }
23439
23492
  };
23440
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
23441
- if (activeChannel.id !== chan.id) {
23442
- dispatch(switchChannelActionAC(chan));
23443
- }
23444
- };
23445
23493
  var handleCrateChatWithContact = function handleCrateChatWithContact(contact) {
23446
23494
  if (contact) {
23447
23495
  var channelData = {
@@ -23597,6 +23645,13 @@ var ChannelList = function ChannelList(_ref) {
23597
23645
  setListWidthIsSet(false);
23598
23646
  }
23599
23647
  }, [channels]);
23648
+ var setSelectedChannel = function setSelectedChannel(channel) {
23649
+ if (activeChannel.id !== channel.id) {
23650
+ dispatch(sendTypingAC(false));
23651
+ dispatch(clearMessagesAC());
23652
+ dispatch(switchChannelActionAC(channel));
23653
+ }
23654
+ };
23600
23655
  return /*#__PURE__*/React__default.createElement(Container$7, {
23601
23656
  className: className,
23602
23657
  withCustomList: !!List,
@@ -23641,13 +23696,13 @@ var ChannelList = function ChannelList(_ref) {
23641
23696
  channels: channels,
23642
23697
  searchedChannels: searchedChannels,
23643
23698
  selectedChannel: activeChannel,
23644
- setSelectedChannel: handleChangeActiveChannel,
23699
+ setSelectedChannel: setSelectedChannel,
23645
23700
  loadMoreChannels: handleLoadMoreChannels,
23646
23701
  searchValue: searchValue
23647
23702
  }, !searchValue ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, channels.map(function (channel) {
23648
23703
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23649
23704
  channel: channel,
23650
- setSelectedChannel: handleChangeActiveChannel,
23705
+ setSelectedChannel: setSelectedChannel,
23651
23706
  key: channel.id
23652
23707
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23653
23708
  theme: theme,
@@ -23673,7 +23728,9 @@ var ChannelList = function ChannelList(_ref) {
23673
23728
  avatarBorderRadius: avatarBorderRadius,
23674
23729
  channel: channel,
23675
23730
  key: channel.id,
23676
- contactsMap: contactsMap
23731
+ contactsMap: contactsMap,
23732
+ setSelectedChannel: setSelectedChannel,
23733
+ getCustomLatestMessage: getCustomLatestMessage
23677
23734
  }));
23678
23735
  }))) : 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, {
23679
23736
  color: textSecondary,
@@ -23681,7 +23738,7 @@ var ChannelList = function ChannelList(_ref) {
23681
23738
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23682
23739
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23683
23740
  channel: channel,
23684
- setSelectedChannel: handleChangeActiveChannel,
23741
+ setSelectedChannel: setSelectedChannel,
23685
23742
  key: channel.id
23686
23743
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23687
23744
  theme: theme,
@@ -23707,7 +23764,9 @@ var ChannelList = function ChannelList(_ref) {
23707
23764
  avatarBorderRadius: avatarBorderRadius,
23708
23765
  channel: channel,
23709
23766
  key: channel.id,
23710
- contactsMap: contactsMap
23767
+ contactsMap: contactsMap,
23768
+ setSelectedChannel: setSelectedChannel,
23769
+ getCustomLatestMessage: getCustomLatestMessage
23711
23770
  }));
23712
23771
  }))), !!(searchedChannels.contacts && searchedChannels.contacts.length) && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23713
23772
  color: textSecondary,
@@ -23716,7 +23775,7 @@ var ChannelList = function ChannelList(_ref) {
23716
23775
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23717
23776
  contact: contact,
23718
23777
  createChatWithContact: handleCrateChatWithContact,
23719
- setSelectedChannel: handleChangeActiveChannel,
23778
+ setSelectedChannel: setSelectedChannel,
23720
23779
  key: contact.id
23721
23780
  })) : (/*#__PURE__*/React__default.createElement(ContactItem, {
23722
23781
  theme: theme,
@@ -23747,7 +23806,7 @@ var ChannelList = function ChannelList(_ref) {
23747
23806
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23748
23807
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23749
23808
  channel: channel,
23750
- setSelectedChannel: handleChangeActiveChannel,
23809
+ setSelectedChannel: setSelectedChannel,
23751
23810
  key: channel.id
23752
23811
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23753
23812
  theme: theme,
@@ -23773,7 +23832,9 @@ var ChannelList = function ChannelList(_ref) {
23773
23832
  avatarBorderRadius: avatarBorderRadius,
23774
23833
  channel: channel,
23775
23834
  key: channel.id,
23776
- contactsMap: contactsMap
23835
+ contactsMap: contactsMap,
23836
+ setSelectedChannel: setSelectedChannel,
23837
+ getCustomLatestMessage: getCustomLatestMessage
23777
23838
  }));
23778
23839
  }))))) : (/*#__PURE__*/React__default.createElement(NoData, {
23779
23840
  color: textSecondary,
@@ -23794,7 +23855,7 @@ var ChannelList = function ChannelList(_ref) {
23794
23855
  }, channels.map(function (channel) {
23795
23856
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23796
23857
  channel: channel,
23797
- setSelectedChannel: handleChangeActiveChannel,
23858
+ setSelectedChannel: setSelectedChannel,
23798
23859
  key: channel.id
23799
23860
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23800
23861
  theme: theme,
@@ -23820,7 +23881,9 @@ var ChannelList = function ChannelList(_ref) {
23820
23881
  avatarBorderRadius: avatarBorderRadius,
23821
23882
  channel: channel,
23822
23883
  key: channel.id,
23823
- contactsMap: contactsMap
23884
+ contactsMap: contactsMap,
23885
+ setSelectedChannel: setSelectedChannel,
23886
+ getCustomLatestMessage: getCustomLatestMessage
23824
23887
  }));
23825
23888
  }))), !!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, {
23826
23889
  color: textSecondary,
@@ -23831,7 +23894,7 @@ var ChannelList = function ChannelList(_ref) {
23831
23894
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23832
23895
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23833
23896
  channel: channel,
23834
- setSelectedChannel: handleChangeActiveChannel,
23897
+ setSelectedChannel: setSelectedChannel,
23835
23898
  key: channel.id
23836
23899
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23837
23900
  theme: theme,
@@ -23857,7 +23920,9 @@ var ChannelList = function ChannelList(_ref) {
23857
23920
  avatarBorderRadius: avatarBorderRadius,
23858
23921
  channel: channel,
23859
23922
  contactsMap: contactsMap,
23860
- key: channel.id
23923
+ key: channel.id,
23924
+ setSelectedChannel: setSelectedChannel,
23925
+ getCustomLatestMessage: getCustomLatestMessage
23861
23926
  }));
23862
23927
  }))), !!searchedChannels.channels.length && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23863
23928
  color: textSecondary,
@@ -23865,7 +23930,7 @@ var ChannelList = function ChannelList(_ref) {
23865
23930
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23866
23931
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23867
23932
  channel: channel,
23868
- setSelectedChannel: handleChangeActiveChannel,
23933
+ setSelectedChannel: setSelectedChannel,
23869
23934
  key: channel.id
23870
23935
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23871
23936
  theme: theme,
@@ -23891,7 +23956,9 @@ var ChannelList = function ChannelList(_ref) {
23891
23956
  avatarBorderRadius: avatarBorderRadius,
23892
23957
  channel: channel,
23893
23958
  key: channel.id,
23894
- contactsMap: contactsMap
23959
+ contactsMap: contactsMap,
23960
+ setSelectedChannel: setSelectedChannel,
23961
+ getCustomLatestMessage: getCustomLatestMessage
23895
23962
  }));
23896
23963
  }))))) : (/*#__PURE__*/React__default.createElement(LoadingWrapper, null, /*#__PURE__*/React__default.createElement(UploadingIcon, {
23897
23964
  color: textFootnote
package/index.modern.js CHANGED
@@ -18834,16 +18834,23 @@ function getMessageQuery(action) {
18834
18834
  _context0.n = 4;
18835
18835
  return put(setScrollToMessagesAC(messageId, false));
18836
18836
  case 4:
18837
- _context0.n = 6;
18838
- break;
18837
+ if (!(channel.lastMessage.id === messageId)) {
18838
+ _context0.n = 5;
18839
+ break;
18840
+ }
18841
+ _context0.n = 5;
18842
+ return put(updateChannelLastMessageAC(messages[0], channel));
18839
18843
  case 5:
18840
- _context0.p = 5;
18844
+ _context0.n = 7;
18845
+ break;
18846
+ case 6:
18847
+ _context0.p = 6;
18841
18848
  _t0 = _context0.v;
18842
18849
  log.error('error in message query', _t0);
18843
- case 6:
18850
+ case 7:
18844
18851
  return _context0.a(2);
18845
18852
  }
18846
- }, _marked8$1, null, [[0, 5]]);
18853
+ }, _marked8$1, null, [[0, 6]]);
18847
18854
  }
18848
18855
  function loadMoreMessages(action) {
18849
18856
  var payload, limit, direction, channelId, messageId, hasNext, SceytChatClient, messageQueryBuilder, messageQuery, result, _t1;
@@ -21143,7 +21150,9 @@ var Channel = function Channel(_ref3) {
21143
21150
  channelLastMessageTimeFontSize = _ref3.channelLastMessageTimeFontSize,
21144
21151
  channelLastMessageHeight = _ref3.channelLastMessageHeight,
21145
21152
  channelAvatarSize = _ref3.channelAvatarSize,
21146
- channelAvatarTextSize = _ref3.channelAvatarTextSize;
21153
+ channelAvatarTextSize = _ref3.channelAvatarTextSize,
21154
+ setSelectedChannel = _ref3.setSelectedChannel,
21155
+ getCustomLatestMessage = _ref3.getCustomLatestMessage;
21147
21156
  var _useColor = useColors(),
21148
21157
  accentColor = _useColor[THEME_COLORS.ACCENT],
21149
21158
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -21181,13 +21190,6 @@ var Channel = function Channel(_ref3) {
21181
21190
  statusWidth = _useState3[0],
21182
21191
  setStatusWidth = _useState3[1];
21183
21192
  var avatarName = channel.subject || (isDirectChannel && directChannelUser ? directChannelUser.firstName || directChannelUser.id : isSelfChannel ? 'Me' : '');
21184
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
21185
- if (activeChannel.id !== chan.id) {
21186
- dispatch(sendTypingAC(false));
21187
- dispatch(clearMessagesAC());
21188
- dispatch(switchChannelActionAC(chan));
21189
- }
21190
- };
21191
21193
  var messageAuthorRef = useRef(null);
21192
21194
  var messageTimeAndStatusRef = useRef(null);
21193
21195
  useUpdatePresence(channel, true);
@@ -21272,6 +21274,40 @@ var Channel = function Channel(_ref3) {
21272
21274
  isDirectChannel: isDirectChannel
21273
21275
  });
21274
21276
  }, [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]);
21277
+ var getCustomLatestMessageComponent = useCallback(function (_ref4) {
21278
+ var lastMessage = _ref4.lastMessage,
21279
+ typingOrRecording = _ref4.typingOrRecording,
21280
+ draftMessageText = _ref4.draftMessageText,
21281
+ textSecondary = _ref4.textSecondary,
21282
+ channel = _ref4.channel,
21283
+ channelLastMessageFontSize = _ref4.channelLastMessageFontSize,
21284
+ channelLastMessageHeight = _ref4.channelLastMessageHeight,
21285
+ isDirectChannel = _ref4.isDirectChannel,
21286
+ textPrimary = _ref4.textPrimary,
21287
+ messageAuthorRef = _ref4.messageAuthorRef,
21288
+ contactsMap = _ref4.contactsMap,
21289
+ getFromContacts = _ref4.getFromContacts,
21290
+ warningColor = _ref4.warningColor,
21291
+ user = _ref4.user,
21292
+ MessageText = _ref4.MessageText;
21293
+ return getCustomLatestMessage && getCustomLatestMessage({
21294
+ lastMessage: lastMessage,
21295
+ typingOrRecording: typingOrRecording,
21296
+ draftMessageText: draftMessageText,
21297
+ textSecondary: textSecondary,
21298
+ channel: channel,
21299
+ channelLastMessageFontSize: channelLastMessageFontSize,
21300
+ channelLastMessageHeight: channelLastMessageHeight,
21301
+ isDirectChannel: isDirectChannel,
21302
+ textPrimary: textPrimary,
21303
+ messageAuthorRef: messageAuthorRef,
21304
+ contactsMap: contactsMap,
21305
+ getFromContacts: getFromContacts,
21306
+ warningColor: warningColor,
21307
+ user: user,
21308
+ MessageText: MessageText
21309
+ });
21310
+ }, [getCustomLatestMessage, lastMessage, typingOrRecording, draftMessageText, textSecondary, channel, channelLastMessageFontSize, channelLastMessageHeight, isDirectChannel, textPrimary, messageAuthorRef, contactsMap, getFromContacts, warningColor, user, MessageText]);
21275
21311
  return /*#__PURE__*/React__default.createElement(Container$2, {
21276
21312
  theme: theme,
21277
21313
  selectedChannel: channel.id === activeChannel.id,
@@ -21282,7 +21318,7 @@ var Channel = function Channel(_ref3) {
21282
21318
  selectedChannelBorderRadius: selectedChannelBorderRadius,
21283
21319
  channelsMargin: channelsMargin,
21284
21320
  onClick: function onClick() {
21285
- return handleChangeActiveChannel(channel);
21321
+ return setSelectedChannel(channel);
21286
21322
  },
21287
21323
  hoverBackground: channelHoverBackground || backgroundHovered
21288
21324
  }, showAvatar && (/*#__PURE__*/React__default.createElement(AvatarWrapper, null, /*#__PURE__*/React__default.createElement(Avatar, {
@@ -21308,7 +21344,23 @@ var Channel = function Channel(_ref3) {
21308
21344
  avatarSize: channelAvatarSize
21309
21345
  }, /*#__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, {
21310
21346
  color: notificationsIsMutedIconColor || iconInactive
21311
- }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21347
+ }, notificationsIsMutedIcon || /*#__PURE__*/React__default.createElement(SvgUnmuteNotifications, null))), getCustomLatestMessage ? getCustomLatestMessageComponent({
21348
+ lastMessage: lastMessage,
21349
+ typingOrRecording: typingOrRecording,
21350
+ draftMessageText: draftMessageText,
21351
+ textSecondary: textSecondary,
21352
+ channel: channel,
21353
+ channelLastMessageFontSize: channelLastMessageFontSize || '14px',
21354
+ channelLastMessageHeight: channelLastMessageHeight || '20px',
21355
+ isDirectChannel: isDirectChannel,
21356
+ textPrimary: textPrimary,
21357
+ messageAuthorRef: messageAuthorRef,
21358
+ contactsMap: contactsMap || {},
21359
+ getFromContacts: getFromContacts,
21360
+ warningColor: warningColor,
21361
+ user: user,
21362
+ MessageText: MessageText
21363
+ }) : (lastMessage || typingOrRecording.items.length > 0 || draftMessageText) && (/*#__PURE__*/React__default.createElement(LastMessage, {
21312
21364
  color: textSecondary,
21313
21365
  markedAsUnread: !!(channel.unread || channel.newMessageCount && channel.newMessageCount > 0),
21314
21366
  unreadMentions: !!(channel.newMentionCount && channel.newMentionCount > 0),
@@ -21411,9 +21463,9 @@ var Container$2 = styled.div(_templateObject6$1 || (_templateObject6$1 = _tagged
21411
21463
  return props.channelsMargin || '0 8px';
21412
21464
  }, function (props) {
21413
21465
  return props.selectedChannelBorderRadius || '12px';
21414
- }, function (_ref4) {
21415
- var selectedChannel = _ref4.selectedChannel,
21416
- hoverBackground = _ref4.hoverBackground;
21466
+ }, function (_ref5) {
21467
+ var selectedChannel = _ref5.selectedChannel,
21468
+ hoverBackground = _ref5.hoverBackground;
21417
21469
  return !selectedChannel && "\n background-color: " + hoverBackground + ";\n ";
21418
21470
  }, UserStatus, function (props) {
21419
21471
  return props.selectedChannel ? props.selectedBackgroundColor : props.hoverBackground;
@@ -21428,9 +21480,9 @@ var DraftMessageText = styled.span(_templateObject8$1 || (_templateObject8$1 = _
21428
21480
  });
21429
21481
  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) {
21430
21482
  return props.color;
21431
- }, function (_ref5) {
21432
- var typing = _ref5.typing,
21433
- recording = _ref5.recording;
21483
+ }, function (_ref6) {
21484
+ var typing = _ref6.typing,
21485
+ recording = _ref6.recording;
21434
21486
  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 ";
21435
21487
  });
21436
21488
  var Points = styled.span(_templateObject0$1 || (_templateObject0$1 = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n color: ", ";\n font-style: normal;\n"])), function (props) {
@@ -23348,7 +23400,8 @@ var ChannelList = function ChannelList(_ref) {
23348
23400
  channelAvatarTextSize = _ref.channelAvatarTextSize,
23349
23401
  searchChannelInputFontSize = _ref.searchChannelInputFontSize,
23350
23402
  searchedChannelsTitleFontSize = _ref.searchedChannelsTitleFontSize,
23351
- searchChannelsPadding = _ref.searchChannelsPadding;
23403
+ searchChannelsPadding = _ref.searchChannelsPadding,
23404
+ getCustomLatestMessage = _ref.getCustomLatestMessage;
23352
23405
  var _useColor = useColors(),
23353
23406
  background = _useColor[THEME_COLORS.BACKGROUND],
23354
23407
  textPrimary = _useColor[THEME_COLORS.TEXT_PRIMARY],
@@ -23416,11 +23469,6 @@ var ChannelList = function ChannelList(_ref) {
23416
23469
  handleLoadMoreChannels();
23417
23470
  }
23418
23471
  };
23419
- var handleChangeActiveChannel = function handleChangeActiveChannel(chan) {
23420
- if (activeChannel.id !== chan.id) {
23421
- dispatch(switchChannelActionAC(chan));
23422
- }
23423
- };
23424
23472
  var handleCrateChatWithContact = function handleCrateChatWithContact(contact) {
23425
23473
  if (contact) {
23426
23474
  var channelData = {
@@ -23576,6 +23624,13 @@ var ChannelList = function ChannelList(_ref) {
23576
23624
  setListWidthIsSet(false);
23577
23625
  }
23578
23626
  }, [channels]);
23627
+ var setSelectedChannel = function setSelectedChannel(channel) {
23628
+ if (activeChannel.id !== channel.id) {
23629
+ dispatch(sendTypingAC(false));
23630
+ dispatch(clearMessagesAC());
23631
+ dispatch(switchChannelActionAC(channel));
23632
+ }
23633
+ };
23579
23634
  return /*#__PURE__*/React__default.createElement(Container$7, {
23580
23635
  className: className,
23581
23636
  withCustomList: !!List,
@@ -23620,13 +23675,13 @@ var ChannelList = function ChannelList(_ref) {
23620
23675
  channels: channels,
23621
23676
  searchedChannels: searchedChannels,
23622
23677
  selectedChannel: activeChannel,
23623
- setSelectedChannel: handleChangeActiveChannel,
23678
+ setSelectedChannel: setSelectedChannel,
23624
23679
  loadMoreChannels: handleLoadMoreChannels,
23625
23680
  searchValue: searchValue
23626
23681
  }, !searchValue ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, channels.map(function (channel) {
23627
23682
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23628
23683
  channel: channel,
23629
- setSelectedChannel: handleChangeActiveChannel,
23684
+ setSelectedChannel: setSelectedChannel,
23630
23685
  key: channel.id
23631
23686
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23632
23687
  theme: theme,
@@ -23652,7 +23707,9 @@ var ChannelList = function ChannelList(_ref) {
23652
23707
  avatarBorderRadius: avatarBorderRadius,
23653
23708
  channel: channel,
23654
23709
  key: channel.id,
23655
- contactsMap: contactsMap
23710
+ contactsMap: contactsMap,
23711
+ setSelectedChannel: setSelectedChannel,
23712
+ getCustomLatestMessage: getCustomLatestMessage
23656
23713
  }));
23657
23714
  }))) : 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, {
23658
23715
  color: textSecondary,
@@ -23660,7 +23717,7 @@ var ChannelList = function ChannelList(_ref) {
23660
23717
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23661
23718
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23662
23719
  channel: channel,
23663
- setSelectedChannel: handleChangeActiveChannel,
23720
+ setSelectedChannel: setSelectedChannel,
23664
23721
  key: channel.id
23665
23722
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23666
23723
  theme: theme,
@@ -23686,7 +23743,9 @@ var ChannelList = function ChannelList(_ref) {
23686
23743
  avatarBorderRadius: avatarBorderRadius,
23687
23744
  channel: channel,
23688
23745
  key: channel.id,
23689
- contactsMap: contactsMap
23746
+ contactsMap: contactsMap,
23747
+ setSelectedChannel: setSelectedChannel,
23748
+ getCustomLatestMessage: getCustomLatestMessage
23690
23749
  }));
23691
23750
  }))), !!(searchedChannels.contacts && searchedChannels.contacts.length) && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23692
23751
  color: textSecondary,
@@ -23695,7 +23754,7 @@ var ChannelList = function ChannelList(_ref) {
23695
23754
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23696
23755
  contact: contact,
23697
23756
  createChatWithContact: handleCrateChatWithContact,
23698
- setSelectedChannel: handleChangeActiveChannel,
23757
+ setSelectedChannel: setSelectedChannel,
23699
23758
  key: contact.id
23700
23759
  })) : (/*#__PURE__*/React__default.createElement(ContactItem, {
23701
23760
  theme: theme,
@@ -23726,7 +23785,7 @@ var ChannelList = function ChannelList(_ref) {
23726
23785
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23727
23786
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23728
23787
  channel: channel,
23729
- setSelectedChannel: handleChangeActiveChannel,
23788
+ setSelectedChannel: setSelectedChannel,
23730
23789
  key: channel.id
23731
23790
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23732
23791
  theme: theme,
@@ -23752,7 +23811,9 @@ var ChannelList = function ChannelList(_ref) {
23752
23811
  avatarBorderRadius: avatarBorderRadius,
23753
23812
  channel: channel,
23754
23813
  key: channel.id,
23755
- contactsMap: contactsMap
23814
+ contactsMap: contactsMap,
23815
+ setSelectedChannel: setSelectedChannel,
23816
+ getCustomLatestMessage: getCustomLatestMessage
23756
23817
  }));
23757
23818
  }))))) : (/*#__PURE__*/React__default.createElement(NoData, {
23758
23819
  color: textSecondary,
@@ -23773,7 +23834,7 @@ var ChannelList = function ChannelList(_ref) {
23773
23834
  }, channels.map(function (channel) {
23774
23835
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23775
23836
  channel: channel,
23776
- setSelectedChannel: handleChangeActiveChannel,
23837
+ setSelectedChannel: setSelectedChannel,
23777
23838
  key: channel.id
23778
23839
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23779
23840
  theme: theme,
@@ -23799,7 +23860,9 @@ var ChannelList = function ChannelList(_ref) {
23799
23860
  avatarBorderRadius: avatarBorderRadius,
23800
23861
  channel: channel,
23801
23862
  key: channel.id,
23802
- contactsMap: contactsMap
23863
+ contactsMap: contactsMap,
23864
+ setSelectedChannel: setSelectedChannel,
23865
+ getCustomLatestMessage: getCustomLatestMessage
23803
23866
  }));
23804
23867
  }))), !!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, {
23805
23868
  color: textSecondary,
@@ -23810,7 +23873,7 @@ var ChannelList = function ChannelList(_ref) {
23810
23873
  }, "Chats & Groups"), searchedChannels.chats_groups.map(function (channel) {
23811
23874
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23812
23875
  channel: channel,
23813
- setSelectedChannel: handleChangeActiveChannel,
23876
+ setSelectedChannel: setSelectedChannel,
23814
23877
  key: channel.id
23815
23878
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23816
23879
  theme: theme,
@@ -23836,7 +23899,9 @@ var ChannelList = function ChannelList(_ref) {
23836
23899
  avatarBorderRadius: avatarBorderRadius,
23837
23900
  channel: channel,
23838
23901
  contactsMap: contactsMap,
23839
- key: channel.id
23902
+ key: channel.id,
23903
+ setSelectedChannel: setSelectedChannel,
23904
+ getCustomLatestMessage: getCustomLatestMessage
23840
23905
  }));
23841
23906
  }))), !!searchedChannels.channels.length && (/*#__PURE__*/React__default.createElement(GroupChannels, null, /*#__PURE__*/React__default.createElement(SearchedChannelsHeader, {
23842
23907
  color: textSecondary,
@@ -23844,7 +23909,7 @@ var ChannelList = function ChannelList(_ref) {
23844
23909
  }, "Channels"), searchedChannels.channels.map(function (channel) {
23845
23910
  return ListItem ? (/*#__PURE__*/React__default.createElement(ListItem, {
23846
23911
  channel: channel,
23847
- setSelectedChannel: handleChangeActiveChannel,
23912
+ setSelectedChannel: setSelectedChannel,
23848
23913
  key: channel.id
23849
23914
  })) : (/*#__PURE__*/React__default.createElement(Channel, {
23850
23915
  theme: theme,
@@ -23870,7 +23935,9 @@ var ChannelList = function ChannelList(_ref) {
23870
23935
  avatarBorderRadius: avatarBorderRadius,
23871
23936
  channel: channel,
23872
23937
  key: channel.id,
23873
- contactsMap: contactsMap
23938
+ contactsMap: contactsMap,
23939
+ setSelectedChannel: setSelectedChannel,
23940
+ getCustomLatestMessage: getCustomLatestMessage
23874
23941
  }));
23875
23942
  }))))) : (/*#__PURE__*/React__default.createElement(LoadingWrapper, null, /*#__PURE__*/React__default.createElement(UploadingIcon, {
23876
23943
  color: textFootnote
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.7.1-beta.10",
3
+ "version": "1.7.1-beta.11",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",