UNPKG

@sendbird/uikit-react-native

Version:

Sendbird UIKit for React Native: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.

178 lines (177 loc) 7.65 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _react = _interopRequireWildcard(require("react")); var _uikitReactNativeFoundation = require("@sendbird/uikit-react-native-foundation"); var _uikitTools = require("@sendbird/uikit-tools"); var _uikitUtils = require("@sendbird/uikit-utils"); var _ChannelMessageList = _interopRequireDefault(require("../../../components/ChannelMessageList")); var _constants = require("../../../constants"); var _useContext = require("../../../hooks/useContext"); var _moduleContext = require("../module/moduleContext"); function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } const GroupChannelMessageList = props => { const toast = (0, _uikitReactNativeFoundation.useToast)(); const { STRINGS } = (0, _useContext.useLocalization)(); const { sdk, sbOptions, groupChannelFragmentOptions } = (0, _useContext.useSendbirdChat)(); const { setMessageToEdit, setMessageToReply } = (0, _react.useContext)(_moduleContext.GroupChannelContexts.Fragment); const { subscribe } = (0, _react.useContext)(_moduleContext.GroupChannelContexts.PubSub); const { flatListRef, lazyScrollToBottom, lazyScrollToIndex, onPressReplyMessageInThread } = (0, _react.useContext)(_moduleContext.GroupChannelContexts.MessageList); const isFirstMount = (0, _uikitUtils.useIsFirstMount)(); const scrollToMessageWithCreatedAt = (0, _uikitUtils.useFreshCallback)((createdAt, focusAnimated, timeout) => { const foundMessageIndex = props.messages.findIndex(it => it.createdAt === createdAt); const isIncludedInList = foundMessageIndex > -1; if (isIncludedInList) { if (focusAnimated) { setTimeout(() => props.onUpdateSearchItem({ startingPoint: createdAt }), _constants.MESSAGE_FOCUS_ANIMATION_DELAY); } lazyScrollToIndex({ index: foundMessageIndex, animated: true, timeout }); } else { if (props.channel.messageOffsetTimestamp <= createdAt) { if (focusAnimated) { props.onUpdateSearchItem({ startingPoint: createdAt }); } props.onResetMessageListWithStartingPoint(createdAt).catch(_ => {}); } else { return false; } } return true; }); const scrollToBottom = (0, _uikitUtils.useFreshCallback)(async (animated = false) => { if (props.hasNext()) { props.onUpdateSearchItem(undefined); props.onScrolledAwayFromBottom(false); await props.onResetMessageList().catch(_ => {}); props.onScrolledAwayFromBottom(false); lazyScrollToBottom({ animated }); } else { lazyScrollToBottom({ animated }); } }); (0, _uikitTools.useGroupChannelHandler)(sdk, { onReactionUpdated(channel, event) { if ((0, _uikitUtils.isDifferentChannel)(channel, props.channel)) return; const recentMessage = props.messages[0]; const isRecentMessage = recentMessage && recentMessage.messageId === event.messageId; const scrollReachedBottomAndCanScroll = !props.scrolledAwayFromBottom && !props.hasNext(); if (isRecentMessage && scrollReachedBottomAndCanScroll) { lazyScrollToBottom({ animated: true, timeout: 250 }); } } }); (0, _react.useEffect)(() => { return subscribe(({ type, data }) => { switch (type) { case 'TYPING_BUBBLE_RENDERED': case 'MESSAGES_RECEIVED': { if (!props.scrolledAwayFromBottom) { scrollToBottom(true); } break; } case 'MESSAGES_UPDATED': { const lastMessage = props.channel.lastMessage; const [updatedMessage] = data.messages; const lastMessageUpdated = updatedMessage && lastMessage && lastMessage.messageId === updatedMessage.messageId; const isMaybeStreaming = props.channel.hasAiBot && lastMessageUpdated; if (isMaybeStreaming) { scrollToBottom(false); } else if (!props.scrolledAwayFromBottom && lastMessageUpdated) { scrollToBottom(true); } break; } case 'MESSAGE_SENT_SUCCESS': case 'MESSAGE_SENT_PENDING': { scrollToBottom(false); break; } } }); }, [props.scrolledAwayFromBottom]); (0, _react.useEffect)(() => { return groupChannelFragmentOptions.pubsub.subscribe(payload => { switch (payload.type) { case 'OVERRIDE_SEARCH_ITEM_STARTING_POINT': { scrollToMessageWithCreatedAt(payload.data.startingPoint, false, _constants.MESSAGE_SEARCH_SAFE_SCROLL_DELAY); break; } } }); }, []); (0, _react.useEffect)(() => { // Only trigger once when message list mount with initial props.searchItem // - Search screen + searchItem > mount message list // - Reset message list + searchItem > re-mount message list if (isFirstMount && props.searchItem) { scrollToMessageWithCreatedAt(props.searchItem.startingPoint, false, _constants.MESSAGE_SEARCH_SAFE_SCROLL_DELAY); } }, [isFirstMount]); const onPressParentMessage = (0, _uikitUtils.useFreshCallback)((parentMessage, childMessage) => { if (onPressReplyMessageInThread && sbOptions.uikit.groupChannel.channel.replyType === 'thread' && sbOptions.uikit.groupChannel.channel.threadReplySelectType === 'thread') { if (parentMessage.createdAt >= props.channel.messageOffsetTimestamp) { onPressReplyMessageInThread(parentMessage, childMessage.createdAt); } else { toast.show(STRINGS.TOAST.FIND_PARENT_MSG_ERROR, 'error'); } } else { const canScrollToParent = scrollToMessageWithCreatedAt(parentMessage.createdAt, true, 0); if (!canScrollToParent) toast.show(STRINGS.TOAST.FIND_PARENT_MSG_ERROR, 'error'); } }); return /*#__PURE__*/_react.default.createElement(_ChannelMessageList.default, _extends({}, props, { ref: flatListRef, onReplyMessage: setMessageToReply, onReplyInThreadMessage: setMessageToReply, onEditMessage: setMessageToEdit, onPressParentMessage: onPressParentMessage, onPressNewMessagesButton: scrollToBottom, onPressScrollToBottomButton: scrollToBottom })); }; var _default = exports.default = /*#__PURE__*/_react.default.memo(GroupChannelMessageList); //# sourceMappingURL=GroupChannelMessageList.js.map