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.

206 lines (205 loc) 9.04 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 _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); } 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