stream-chat-react-native-core
Version:
The official React Native and Expo components for Stream Chat, a service for building chat applications
363 lines • 16.4 kB
JavaScript
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useMessageInputContext = exports.MessageInputProvider = exports.MessageInputContext = void 0;
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = _interopRequireWildcard(require("react"));
var _reactNative = require("react-native");
var _mimeTypes = require("mime-types");
var _streamChat = require("stream-chat");
var _useCreateMessageInputContext = require("./hooks/useCreateMessageInputContext");
var _useMessageComposer = require("./hooks/useMessageComposer");
var _KeyboardCompatibleView = require("../../components/KeyboardCompatibleView/KeyboardCompatibleView");
var _parseLinks = require("../../components/Message/MessageItemView/utils/parseLinks");
var _useAudioRecorder2 = require("../../components/MessageInput/hooks/useAudioRecorder");
var _Notifications = require("../../components/Notifications");
var _useStableCallback = require("../../hooks/useStableCallback");
var _attachments = require("../../middlewares/attachments");
var _native = require("../../native");
var _audioRecorderManager = require("../../state-store/audio-recorder-manager");
var _compressImage = require("../../utils/compressImage");
var _AttachmentPickerContext = require("../attachmentPickerContext/AttachmentPickerContext");
var _ChannelContext = require("../channelContext/ChannelContext");
var _ChatContext = require("../chatContext/ChatContext");
var _MessageComposerAPIContext = require("../messageComposerContext/MessageComposerAPIContext");
var _OwnCapabilitiesContext = require("../ownCapabilitiesContext/OwnCapabilitiesContext");
var _ThreadContext = require("../threadContext/ThreadContext");
var _TranslationContext = require("../translationContext/TranslationContext");
var _defaultBaseContextValue = require("../utils/defaultBaseContextValue");
var _isTestEnvironment = require("../utils/isTestEnvironment");
var _jsxRuntime = require("react/jsx-runtime");
var _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/contexts/messageInputContext/MessageInputContext.tsx";
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 (var _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); }
var MessageInputContext = exports.MessageInputContext = _react.default.createContext(_defaultBaseContextValue.DEFAULT_BASE_CONTEXT_VALUE);
var MessageInputProvider = ({
children,
value
}) => {
var _useAttachmentPickerC = (0, _AttachmentPickerContext.useAttachmentPickerContext)(),
closePicker = _useAttachmentPickerC.closePicker,
openPicker = _useAttachmentPickerC.openPicker,
attachmentPickerStore = _useAttachmentPickerC.attachmentPickerStore,
disableAttachmentPicker = _useAttachmentPickerC.disableAttachmentPicker;
var _useChatContext = (0, _ChatContext.useChatContext)(),
client = _useChatContext.client;
var channelCapabilities = (0, _OwnCapabilitiesContext.useOwnCapabilitiesContext)();
var _useState = (0, _react.useState)(new _audioRecorderManager.AudioRecorderManager()),
_useState2 = (0, _slicedToArray2.default)(_useState, 1),
audioRecorderManager = _useState2[0];
var _useChannelContext = (0, _ChannelContext.useChannelContext)(),
uploadAbortControllerRef = _useChannelContext.uploadAbortControllerRef;
var _useMessageComposerAP = (0, _MessageComposerAPIContext.useMessageComposerAPIContext)(),
clearEditingState = _useMessageComposerAP.clearEditingState;
var _useThreadContext = (0, _ThreadContext.useThreadContext)(),
thread = _useThreadContext.thread;
var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
t = _useTranslationContex.t;
var _useNotificationApi = (0, _Notifications.useNotificationApi)(),
addNotification = _useNotificationApi.addNotification;
var inputBoxRef = (0, _react.useRef)(null);
var _useState3 = (0, _react.useState)(false),
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
showPollCreationDialog = _useState4[0],
setShowPollCreationDialog = _useState4[1];
var defaultOpenPollCreationDialog = (0, _react.useCallback)(() => setShowPollCreationDialog(true), []);
var closePollCreationDialog = (0, _react.useCallback)(() => setShowPollCreationDialog(false), []);
var openPollCreationDialogFromContext = value.openPollCreationDialog,
allowSendBeforeAttachmentsUpload = value.allowSendBeforeAttachmentsUpload;
var messageComposer = (0, _useMessageComposer.useMessageComposer)();
var attachmentManager = messageComposer.attachmentManager,
editedMessage = messageComposer.editedMessage;
(0, _react.useEffect)(() => {
if (value.doFileUploadRequest) {
attachmentManager.setCustomUploadFn(value.doFileUploadRequest);
}
(0, _attachments.setupVideoAttachmentPreviewMiddleware)(messageComposer);
if (allowSendBeforeAttachmentsUpload) {
messageComposer.compositionMiddlewareExecutor.replace([(0, _attachments.createAttachmentsCompositionMiddleware)(messageComposer)]);
messageComposer.draftCompositionMiddlewareExecutor.replace([(0, _attachments.createDraftAttachmentsCompositionMiddleware)(messageComposer)]);
}
}, [value.doFileUploadRequest, allowSendBeforeAttachmentsUpload, messageComposer, attachmentManager]);
var takeAndUploadImage = (0, _useStableCallback.useStableCallback)(function () {
var _ref = (0, _asyncToGenerator2.default)(function* (mediaType) {
if (!attachmentManager.availableUploadSlots) {
_reactNative.Alert.alert(t('Maximum number of files reached'));
return;
}
var file = yield _native.NativeHandlers.takePhoto({
compressImageQuality: value.compressImageQuality,
mediaType
});
if (file.askToOpenSettings && disableAttachmentPicker) {
_reactNative.Alert.alert(t('Allow camera access in device settings'), t('Device camera is used to take photos or videos.'), [{
style: 'cancel',
text: t('Cancel')
}, {
onPress: () => _reactNative.Linking.openSettings(),
style: 'default',
text: t('Open Settings')
}]);
}
if (file.askToOpenSettings || file.cancelled) {
return file;
}
yield uploadNewFile(file);
return file;
});
return function (_x) {
return _ref.apply(this, arguments);
};
}());
var pickAndUploadImageFromNativePicker = (0, _useStableCallback.useStableCallback)((0, _asyncToGenerator2.default)(function* () {
if (!attachmentManager.availableUploadSlots) {
_reactNative.Alert.alert(t('Maximum number of files reached'));
return;
}
var result = yield _native.NativeHandlers.pickImage({
maxNumberOfFiles: attachmentManager.availableUploadSlots
});
if (result.askToOpenSettings) {
_reactNative.Alert.alert(t('Allow access to your Gallery'), t('Device gallery permissions is used to take photos or videos.'), [{
style: 'cancel',
text: t('Cancel')
}, {
onPress: () => _reactNative.Linking.openSettings(),
style: 'default',
text: t('Open Settings')
}]);
}
if (result.cancelled || !result.assets?.length) {
return;
}
result.assets.forEach(function () {
var _ref3 = (0, _asyncToGenerator2.default)(function* (asset) {
yield uploadNewFile(asset);
});
return function (_x2) {
return _ref3.apply(this, arguments);
};
}());
}));
var pickFile = (0, _useStableCallback.useStableCallback)((0, _asyncToGenerator2.default)(function* () {
if (!(0, _native.isDocumentPickerAvailable)()) {
console.log('The file picker is not installed. Check our Getting Started documentation to install it.');
return;
}
if (!attachmentManager.availableUploadSlots) {
_reactNative.Alert.alert(t('Maximum number of files reached'));
return;
}
var result = yield _native.NativeHandlers.pickDocument({
maxNumberOfFiles: attachmentManager.availableUploadSlots
});
if (result.cancelled || !result.assets?.length) {
return;
}
result.assets.forEach(function () {
var _ref5 = (0, _asyncToGenerator2.default)(function* (asset) {
yield uploadNewFile(asset);
});
return function (_x3) {
return _ref5.apply(this, arguments);
};
}());
}));
var openAttachmentPicker = (0, _react.useCallback)(() => {
(0, _KeyboardCompatibleView.dismissKeyboard)();
attachmentPickerStore.setSelectedPicker('images');
openPicker();
}, [attachmentPickerStore, openPicker]);
var closeAttachmentPicker = (0, _react.useCallback)(() => {
attachmentPickerStore.setSelectedPicker(undefined);
closePicker();
}, [closePicker, attachmentPickerStore]);
var sendMessage = (0, _useStableCallback.useStableCallback)((0, _asyncToGenerator2.default)(function* () {
var textToRestore = messageComposer.textComposer.text;
var compositionAccepted = false;
inputBoxRef.current?.clearState();
try {
var composition = yield messageComposer.compose();
if (!composition || !composition.message) {
inputBoxRef.current?.restoreState(textToRestore);
return;
}
var localMessage = composition.localMessage,
message = composition.message,
sendOptions = composition.sendOptions;
var linkInfos = (0, _parseLinks.parseLinksFromText)(localMessage.text);
if (!channelCapabilities.sendLinks && linkInfos.length > 0) {
_reactNative.Alert.alert(t('Links are disabled'), t('Sending links is not allowed in this conversation'));
inputBoxRef.current?.restoreState(textToRestore);
return;
}
compositionAccepted = true;
if (editedMessage && editedMessage.type !== 'error') {
try {
clearEditingState();
yield value.editMessage({
localMessage,
options: sendOptions
});
} catch (error) {
addNotification({
message: t('Edit message request failed'),
options: {
...(error instanceof Error ? {
originalError: error
} : {}),
severity: 'error'
},
origin: {
emitter: 'MessageComposer'
}
}, {
incident: {
domain: 'api',
entity: 'message',
operation: 'edit'
}
});
throw new Error('Error while editing message');
}
} else {
try {
if (localMessage.poll_id) {
messageComposer.state.partialNext({
id: _streamChat.MessageComposer.generateId(),
pollId: null
});
} else {
messageComposer.clear();
}
if (editedMessage) {
clearEditingState();
}
yield value.sendMessage({
localMessage,
message,
options: sendOptions
});
} catch (error) {
addNotification({
message: t('Send message request failed'),
options: {
...(error instanceof Error ? {
originalError: error
} : {}),
severity: 'error'
},
origin: {
emitter: 'MessageComposer'
}
}, {
incident: {
domain: 'api',
entity: 'message',
operation: 'send'
}
});
throw new Error('Error while sending message');
}
}
} catch (error) {
if (!compositionAccepted) {
inputBoxRef.current?.restoreState(textToRestore);
}
console.error('Error while sending message:', error);
}
}));
var setInputBoxRef = (0, _useStableCallback.useStableCallback)(ref => {
inputBoxRef.current = ref;
if (value.setInputRef) {
value.setInputRef(ref);
}
});
var uploadNewFile = (0, _useStableCallback.useStableCallback)(function () {
var _ref7 = (0, _asyncToGenerator2.default)(function* (file) {
try {
if (!file?.uri) {
return;
}
var fallbackMimeType = (0, _mimeTypes.lookup)(file.name || file.uri || '') || (file.duration ? 'video/*' : file.height && file.width ? 'image/*' : undefined);
var normalizedFile = {
...file,
type: file.type || (typeof fallbackMimeType === 'string' ? fallbackMimeType : 'application/octet-stream')
};
uploadAbortControllerRef.current.set(file.name, client.createAbortControllerForNextRequest());
var fileURI = normalizedFile.type.includes('image') ? yield (0, _compressImage.compressedImageURI)(normalizedFile, value.compressImageQuality) : normalizedFile.uri;
var updatedFile = {
...normalizedFile,
uri: fileURI
};
var uploadedFiles = yield attachmentManager.uploadFiles([updatedFile]);
var blockedAttachmentIds = (uploadedFiles ?? []).filter(attachment => attachment?.localMetadata?.uploadState === 'blocked').map(attachment => attachment?.localMetadata.id).filter(id => typeof id === 'string');
if (blockedAttachmentIds.length) {
attachmentManager.removeAttachments(blockedAttachmentIds);
}
uploadAbortControllerRef.current.delete(normalizedFile.name);
} catch (error) {
if (error instanceof Error && (error.name === 'AbortError' || error.name === 'CanceledError')) {
uploadAbortControllerRef.current.delete(file.name);
return;
}
}
});
return function (_x4) {
return _ref7.apply(this, arguments);
};
}());
var openPollCreationDialog = (0, _useStableCallback.useStableCallback)(() => {
if (openPollCreationDialogFromContext) {
openPollCreationDialogFromContext({
sendMessage
});
return;
}
defaultOpenPollCreationDialog();
});
var _useAudioRecorder = (0, _useAudioRecorder2.useAudioRecorder)({
audioRecorderManager,
sendMessage
}),
deleteVoiceRecording = _useAudioRecorder.deleteVoiceRecording,
startVoiceRecording = _useAudioRecorder.startVoiceRecording,
stopVoiceRecording = _useAudioRecorder.stopVoiceRecording,
uploadVoiceRecording = _useAudioRecorder.uploadVoiceRecording;
var messageInputContext = (0, _useCreateMessageInputContext.useCreateMessageInputContext)({
closeAttachmentPicker,
inputBoxRef,
openAttachmentPicker,
pickAndUploadImageFromNativePicker,
pickFile,
setInputBoxRef,
takeAndUploadImage,
thread,
uploadNewFile,
...value,
closePollCreationDialog,
openPollCreationDialog,
sendMessage,
showPollCreationDialog,
audioRecorderManager,
startVoiceRecording,
deleteVoiceRecording,
uploadVoiceRecording,
stopVoiceRecording
});
return (0, _jsxRuntime.jsx)(MessageInputContext.Provider, {
value: messageInputContext,
children: children
});
};
exports.MessageInputProvider = MessageInputProvider;
var useMessageInputContext = () => {
var contextValue = (0, _react.useContext)(MessageInputContext);
if (contextValue === _defaultBaseContextValue.DEFAULT_BASE_CONTEXT_VALUE && !(0, _isTestEnvironment.isTestEnvironment)()) {
throw new Error('The useMessageInputContext hook was called outside of the MessageInputContext provider. Make sure you have configured Channel component correctly - https://getstream.io/chat/docs/sdk/reactnative/basics/hello_stream_chat/#channel');
}
return contextValue;
};
exports.useMessageInputContext = useMessageInputContext;
//# sourceMappingURL=MessageInputContext.js.map