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.

207 lines (206 loc) 9.21 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 _uikitUtils = require("@sendbird/uikit-utils"); var _constants = require("../../constants"); var _useContext = require("./../../hooks/useContext"); var _ThreadParentMessage = _interopRequireDefault(require("./ThreadParentMessage.file")); var _ThreadParentMessageFile = _interopRequireDefault(require("./ThreadParentMessage.file.image")); var _ThreadParentMessageFile2 = _interopRequireDefault(require("./ThreadParentMessage.file.video")); var _ThreadParentMessageFile3 = _interopRequireDefault(require("./ThreadParentMessage.file.voice")); var _ThreadParentMessage2 = _interopRequireDefault(require("./ThreadParentMessage.user")); var _ThreadParentMessageUser = _interopRequireDefault(require("./ThreadParentMessage.user.og")); 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 ThreadParentMessageRenderer = props => { const handlers = (0, _useContext.useSBUHandlers)(); const playerUnsubscribes = (0, _react.useRef)([]); const { sbOptions, currentUser, mentionManager, voiceMessageStatusManager } = (0, _useContext.useSendbirdChat)(); const { palette } = (0, _uikitReactNativeFoundation.useUIKitTheme)(); const { mediaService, playerService } = (0, _useContext.usePlatformService)(); const parentMessage = props.parentMessage; const resetPlayer = async () => { playerUnsubscribes.current.forEach(unsubscribe => { try { unsubscribe(); } catch {} }); playerUnsubscribes.current.length = 0; await playerService.reset(); }; const messageProps = { onPressURL: url => handlers.onOpenURL(url), onToggleVoiceMessage: async (state, setState) => { if ((0, _uikitUtils.isVoiceMessage)(parentMessage) && parentMessage.sendingStatus === 'succeeded') { if (playerService.uri === parentMessage.url) { if (playerService.state === 'playing') { await playerService.pause(); } else { await playerService.play(parentMessage.url); } } else { if (playerService.state !== 'idle') { await resetPlayer(); } const shouldSeekToTime = state.duration > state.currentTime && state.currentTime > 0; let seekFinished = !shouldSeekToTime; const forPlayback = playerService.addPlaybackListener(({ stopped, currentTime, duration }) => { voiceMessageStatusManager.setCurrentTime(parentMessage.channelUrl, parentMessage.messageId, stopped ? 0 : currentTime); if (seekFinished) { setState(prevState => ({ ...prevState, currentTime: stopped ? 0 : currentTime, duration })); } }); const forState = playerService.addStateListener(state => { switch (state) { case 'preparing': setState(prevState => ({ ...prevState, status: 'preparing' })); break; case 'playing': setState(prevState => ({ ...prevState, status: 'playing' })); break; case 'idle': case 'paused': { setState(prevState => ({ ...prevState, status: 'paused' })); break; } case 'stopped': setState(prevState => ({ ...prevState, status: 'paused' })); break; } }); playerUnsubscribes.current.push(forPlayback, forState); await playerService.play(parentMessage.url); if (shouldSeekToTime) { await playerService.seek(state.currentTime); seekFinished = true; } } } }, ...props }; const userMessageProps = { renderRegexTextChildren: message => { if (mentionManager.shouldUseMentionedMessageTemplate(message, sbOptions.uikit.groupChannel.channel.enableMention)) { return message.mentionedMessageTemplate ?? ''; } else { return message.message; } }, regexTextPatterns: [{ regex: mentionManager.templateRegex, replacer({ match, groups, parentProps, index, keyPrefix }) { var _parentMessage$mentio; const user = (_parentMessage$mentio = parentMessage.mentionedUsers) === null || _parentMessage$mentio === void 0 ? void 0 : _parentMessage$mentio.find(it => it.userId === groups[2]); if (user) { const mentionColor = !(0, _uikitUtils.isMyMessage)(parentMessage, currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) && user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) ? palette.onBackgroundLight01 : parentProps === null || parentProps === void 0 ? void 0 : parentProps.color; return /*#__PURE__*/_react.default.createElement(_uikitReactNativeFoundation.Text, _extends({}, parentProps, { key: `${keyPrefix}-${index}`, color: mentionColor, onPress: () => { var _messageProps$onPress; return (_messageProps$onPress = messageProps.onPressMentionedUser) === null || _messageProps$onPress === void 0 ? void 0 : _messageProps$onPress.call(messageProps, user); }, onLongPress: messageProps.onLongPress, suppressHighlighting: true, style: [parentProps === null || parentProps === void 0 ? void 0 : parentProps.style, { fontWeight: '700' }, user.userId === (currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId) && { backgroundColor: palette.highlight }] }), `${mentionManager.asMentionedMessageText(user)}`); } return match; } }] }; switch ((0, _uikitUtils.getMessageType)(props.parentMessage)) { case 'user': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessage2.default, _extends({}, userMessageProps, messageProps)); } case 'user.opengraph': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessageUser.default, _extends({}, userMessageProps, messageProps)); } case 'file': case 'file.audio': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessage.default, messageProps); } case 'file.video': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessageFile2.default, _extends({ fetchThumbnailFromVideoSource: uri => mediaService.getVideoThumbnail({ url: uri, timeMills: 1000 }) }, messageProps)); } case 'file.image': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessageFile.default, messageProps); } case 'file.voice': { return /*#__PURE__*/_react.default.createElement(_ThreadParentMessageFile3.default, _extends({ durationMetaArrayKey: _constants.VOICE_MESSAGE_META_ARRAY_DURATION_KEY, initialCurrentTime: voiceMessageStatusManager.getCurrentTime(parentMessage.channelUrl, parentMessage.messageId), onUnmount: () => { if ((0, _uikitUtils.isVoiceMessage)(parentMessage) && playerService.uri === parentMessage.url) { resetPlayer().catch(_ => {}); } } }, messageProps)); } default: { return null; } } }; var _default = exports.default = /*#__PURE__*/_react.default.memo(ThreadParentMessageRenderer); //# sourceMappingURL=index.js.map