stream-chat-react 11.20.0 → 12.0.0-rc.1

package/dist/components/MessageInput/hooks/useCreateMessageInputContext.js

@@ -1,89 +1,84 @@
 import { useMemo } from 'react';
-export var useCreateMessageInputContext = function (value) {
-    var additionalTextareaProps = value.additionalTextareaProps, asyncMessagesMultiSendEnabled = value.asyncMessagesMultiSendEnabled, attachments = value.attachments, audioRecordingEnabled = value.audioRecordingEnabled, autocompleteTriggers = value.autocompleteTriggers, cancelURLEnrichment = value.cancelURLEnrichment, clearEditingState = value.clearEditingState, closeCommandsList = value.closeCommandsList, closeMentionsList = value.closeMentionsList, cooldownInterval = value.cooldownInterval, cooldownRemaining = value.cooldownRemaining, disabled = value.disabled, disableMentions = value.disableMentions, dismissLinkPreview = value.dismissLinkPreview, doFileUploadRequest = value.doFileUploadRequest, doImageUploadRequest = value.doImageUploadRequest, emojiSearchIndex = value.emojiSearchIndex, errorHandler = value.errorHandler, fileOrder = value.fileOrder, fileUploads = value.fileUploads, findAndEnqueueURLsToEnrich = value.findAndEnqueueURLsToEnrich, focus = value.focus, grow = value.grow, handleChange = value.handleChange, handleSubmit = value.handleSubmit, hideSendButton = value.hideSendButton, imageOrder = value.imageOrder, imageUploads = value.imageUploads, insertText = value.insertText, isUploadEnabled = value.isUploadEnabled, linkPreviews = value.linkPreviews, maxFilesLeft = value.maxFilesLeft, maxRows = value.maxRows, mentionAllAppUsers = value.mentionAllAppUsers, mentioned_users = value.mentioned_users, mentionQueryParams = value.mentionQueryParams, message = value.message, noFiles = value.noFiles, numberOfUploads = value.numberOfUploads, onPaste = value.onPaste, onSelectUser = value.onSelectUser, openCommandsList = value.openCommandsList, openMentionsList = value.openMentionsList, overrideSubmitHandler = value.overrideSubmitHandler, parent = value.parent, publishTypingEvent = value.publishTypingEvent, recordingController = value.recordingController, removeAttachments = value.removeAttachments, removeFile = value.removeFile, removeImage = value.removeImage, setCooldownRemaining = value.setCooldownRemaining, setText = value.setText, shouldSubmit = value.shouldSubmit, showCommandsList = value.showCommandsList, showMentionsList = value.showMentionsList, text = value.text, textareaRef = value.textareaRef, uploadAttachment = value.uploadAttachment, uploadFile = value.uploadFile, uploadImage = value.uploadImage, uploadNewFiles = value.uploadNewFiles, upsertAttachments = value.upsertAttachments, useMentionsTransliteration = value.useMentionsTransliteration;
-    var editing = message === null || message === void 0 ? void 0 : message.editing;
-    var fileUploadsValue = Object.entries(fileUploads)
+export const useCreateMessageInputContext = (value) => {
+    const { additionalTextareaProps, asyncMessagesMultiSendEnabled, attachments, audioRecordingEnabled, autocompleteTriggers, cancelURLEnrichment, clearEditingState, closeCommandsList, closeMentionsList, cooldownInterval, cooldownRemaining, disabled, disableMentions, dismissLinkPreview, doFileUploadRequest, doImageUploadRequest, emojiSearchIndex, errorHandler, fileOrder, fileUploads, findAndEnqueueURLsToEnrich, focus, grow, handleChange, handleSubmit, hideSendButton, imageOrder, imageUploads, insertText, isUploadEnabled, linkPreviews, maxFilesLeft, maxRows, mentionAllAppUsers, mentioned_users, mentionQueryParams, message, minRows, noFiles, numberOfUploads, onPaste, onSelectUser, openCommandsList, openMentionsList, overrideSubmitHandler, parent, publishTypingEvent, recordingController, removeAttachments, removeFile, removeImage, setCooldownRemaining, setText, shouldSubmit, showCommandsList, showMentionsList, text, textareaRef, uploadAttachment, uploadFile, uploadImage, uploadNewFiles, upsertAttachments, useMentionsTransliteration, } = value;
+    const editing = message?.editing;
+    const fileUploadsValue = Object.entries(fileUploads)
         // eslint-disable-next-line
-        .map(function (_a) {
-        var _ = _a[0], value = _a[1];
-        return value.state;
-    })
+        .map(([_, value]) => value.state)
         .join();
-    var imageUploadsValue = Object.entries(imageUploads)
+    const imageUploadsValue = Object.entries(imageUploads)
         // eslint-disable-next-line
-        .map(function (_a) {
-        var _ = _a[0], value = _a[1];
-        return value.state;
-    })
+        .map(([_, value]) => value.state)
         .join();
-    var linkPreviewsValue = Array.from(linkPreviews.values()).join();
-    var mentionedUsersLength = mentioned_users.length;
-    var parentId = parent === null || parent === void 0 ? void 0 : parent.id;
-    var messageInputContext = useMemo(function () { return ({
-        additionalTextareaProps: additionalTextareaProps,
-        asyncMessagesMultiSendEnabled: asyncMessagesMultiSendEnabled,
-        attachments: attachments,
-        audioRecordingEnabled: audioRecordingEnabled,
-        autocompleteTriggers: autocompleteTriggers,
-        cancelURLEnrichment: cancelURLEnrichment,
-        clearEditingState: clearEditingState,
-        closeCommandsList: closeCommandsList,
-        closeMentionsList: closeMentionsList,
-        cooldownInterval: cooldownInterval,
-        cooldownRemaining: cooldownRemaining,
-        disabled: disabled,
-        disableMentions: disableMentions,
-        dismissLinkPreview: dismissLinkPreview,
-        doFileUploadRequest: doFileUploadRequest,
-        doImageUploadRequest: doImageUploadRequest,
-        emojiSearchIndex: emojiSearchIndex,
-        errorHandler: errorHandler,
-        fileOrder: fileOrder,
-        fileUploads: fileUploads,
-        findAndEnqueueURLsToEnrich: findAndEnqueueURLsToEnrich,
-        focus: focus,
-        grow: grow,
-        handleChange: handleChange,
-        handleSubmit: handleSubmit,
-        hideSendButton: hideSendButton,
-        imageOrder: imageOrder,
-        imageUploads: imageUploads,
-        insertText: insertText,
-        isUploadEnabled: isUploadEnabled,
-        linkPreviews: linkPreviews,
-        maxFilesLeft: maxFilesLeft,
-        maxRows: maxRows,
-        mentionAllAppUsers: mentionAllAppUsers,
-        mentioned_users: mentioned_users,
-        mentionQueryParams: mentionQueryParams,
-        message: message,
-        noFiles: noFiles,
-        numberOfUploads: numberOfUploads,
-        onPaste: onPaste,
-        onSelectUser: onSelectUser,
-        openCommandsList: openCommandsList,
-        openMentionsList: openMentionsList,
-        overrideSubmitHandler: overrideSubmitHandler,
-        parent: parent,
-        publishTypingEvent: publishTypingEvent,
-        recordingController: recordingController,
-        removeAttachments: removeAttachments,
-        removeFile: removeFile,
-        removeImage: removeImage,
-        setCooldownRemaining: setCooldownRemaining,
-        setText: setText,
-        shouldSubmit: shouldSubmit,
-        showCommandsList: showCommandsList,
-        showMentionsList: showMentionsList,
-        text: text,
-        textareaRef: textareaRef,
-        uploadAttachment: uploadAttachment,
-        uploadFile: uploadFile,
-        uploadImage: uploadImage,
-        uploadNewFiles: uploadNewFiles,
-        upsertAttachments: upsertAttachments,
-        useMentionsTransliteration: useMentionsTransliteration,
-    }); }, 
+    const linkPreviewsValue = Array.from(linkPreviews.values()).join();
+    const mentionedUsersLength = mentioned_users.length;
+    const parentId = parent?.id;
+    const messageInputContext = useMemo(() => ({
+        additionalTextareaProps,
+        asyncMessagesMultiSendEnabled,
+        attachments,
+        audioRecordingEnabled,
+        autocompleteTriggers,
+        cancelURLEnrichment,
+        clearEditingState,
+        closeCommandsList,
+        closeMentionsList,
+        cooldownInterval,
+        cooldownRemaining,
+        disabled,
+        disableMentions,
+        dismissLinkPreview,
+        doFileUploadRequest,
+        doImageUploadRequest,
+        emojiSearchIndex,
+        errorHandler,
+        fileOrder,
+        fileUploads,
+        findAndEnqueueURLsToEnrich,
+        focus,
+        grow,
+        handleChange,
+        handleSubmit,
+        hideSendButton,
+        imageOrder,
+        imageUploads,
+        insertText,
+        isUploadEnabled,
+        linkPreviews,
+        maxFilesLeft,
+        maxRows,
+        mentionAllAppUsers,
+        mentioned_users,
+        mentionQueryParams,
+        message,
+        minRows,
+        noFiles,
+        numberOfUploads,
+        onPaste,
+        onSelectUser,
+        openCommandsList,
+        openMentionsList,
+        overrideSubmitHandler,
+        parent,
+        publishTypingEvent,
+        recordingController,
+        removeAttachments,
+        removeFile,
+        removeImage,
+        setCooldownRemaining,
+        setText,
+        shouldSubmit,
+        showCommandsList,
+        showMentionsList,
+        text,
+        textareaRef,
+        uploadAttachment,
+        uploadFile,
+        uploadImage,
+        uploadNewFiles,
+        upsertAttachments,
+        useMentionsTransliteration,
+    }), 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [
         asyncMessagesMultiSendEnabled,
@@ -102,6 +97,7 @@ export var useCreateMessageInputContext = function (value) {
         isUploadEnabled,
         linkPreviewsValue,
         mentionedUsersLength,
+        minRows,
         parentId,
         publishTypingEvent,
         recordingController,

package/dist/components/MessageInput/hooks/useEmojiTrigger.d.ts

@@ -1,4 +1,3 @@
 import type { EmojiTriggerSetting } from '../DefaultTriggerProvider';
 import type { EmojiSearchIndex } from '../MessageInput';
-export declare const useEmojiTrigger: <T extends EmojiSearchIndex<import("../../../types/types").UnknownType>>(emojiSearchIndex?: T | undefined) => EmojiTriggerSetting;
-//# sourceMappingURL=useEmojiTrigger.d.ts.map
+export declare const useEmojiTrigger: <T extends EmojiSearchIndex<import("../../../types/types").UnknownType>>(emojiSearchIndex?: T) => EmojiTriggerSetting;

package/dist/components/MessageInput/hooks/useEmojiTrigger.js

@@ -1,44 +1,29 @@
-import { __awaiter, __generator } from "tslib";
 import { EmoticonItem } from '../../EmoticonItem/EmoticonItem';
-import { useChatContext } from '../../../context/ChatContext';
-export var useEmojiTrigger = function (emojiSearchIndex) {
-    var themeVersion = useChatContext('useEmojiTrigger').themeVersion;
-    return {
-        component: EmoticonItem,
-        dataProvider: function (query, _, onReady) { return __awaiter(void 0, void 0, void 0, function () {
-            var emojis, result;
-            var _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
-                    case 0:
-                        if (query.length === 0 || query.charAt(0).match(/[^a-zA-Z0-9+-]/)) {
-                            return [2 /*return*/, onReady([], query)];
-                        }
-                        return [4 /*yield*/, (emojiSearchIndex === null || emojiSearchIndex === void 0 ? void 0 : emojiSearchIndex.search(query))];
-                    case 1:
-                        emojis = (_a = (_b.sent())) !== null && _a !== void 0 ? _a : [];
-                        result = emojis
-                            .filter(Boolean)
-                            .slice(0, themeVersion === '2' ? 7 : 10)
-                            .map(function (_a) {
-                            var id = _a.id, name = _a.name, native = _a.native, _b = _a.skins, skins = _b === void 0 ? [] : _b;
-                            var firstSkin = skins[0];
-                            return {
-                                id: id,
-                                name: name,
-                                native: native !== null && native !== void 0 ? native : firstSkin.native,
-                            };
-                        });
-                        if (onReady)
-                            onReady(result, query);
-                        return [2 /*return*/];
-                }
-            });
-        }); },
-        output: function (entity) { return ({
-            caretPosition: 'next',
-            key: entity.id,
-            text: "".concat('native' in entity ? entity.native : ''),
-        }); },
-    };
-};
+export const useEmojiTrigger = (emojiSearchIndex) => ({
+    component: EmoticonItem,
+    dataProvider: async (query, _, onReady) => {
+        if (query.length === 0 || query.charAt(0).match(/[^a-zA-Z0-9+-]/)) {
+            return onReady([], query);
+        }
+        const emojis = (await emojiSearchIndex?.search(query)) ?? [];
+        // emojiIndex.search sometimes returns undefined values, so filter those out first
+        const result = emojis
+            .filter(Boolean)
+            .slice(0, 7)
+            .map(({ id, name, native, skins = [] }) => {
+            const [firstSkin] = skins;
+            return {
+                id,
+                name,
+                native: native ?? firstSkin.native,
+            };
+        });
+        if (onReady)
+            onReady(result, query);
+    },
+    output: (entity) => ({
+        caretPosition: 'next',
+        key: entity.id,
+        text: `${'native' in entity ? entity.native : ''}`,
+    }),
+});

package/dist/components/MessageInput/hooks/useFileUploads.d.ts

@@ -1,8 +1,7 @@
 import type { MessageInputReducerAction, MessageInputState } from './useMessageInputState';
 import type { MessageInputProps } from '../MessageInput';
 import type { CustomTrigger, DefaultStreamChatGenerics } from '../../../types/types';
-export declare const useFileUploads: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: import("react").Dispatch<MessageInputReducerAction<StreamChatGenerics>>) => {
+export declare const useFileUploads: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: React.Dispatch<MessageInputReducerAction<StreamChatGenerics>>) => {
     removeFile: (id: string) => void;
     uploadFile: (id: string) => void;
 };
-//# sourceMappingURL=useFileUploads.d.ts.map

package/dist/components/MessageInput/hooks/useFileUploads.js

@@ -1,100 +1,85 @@
-import { __awaiter, __generator } from "tslib";
 import { useCallback, useEffect } from 'react';
 import { checkUploadPermissions } from './utils';
 import { useChannelActionContext } from '../../../context/ChannelActionContext';
 import { useChannelStateContext } from '../../../context/ChannelStateContext';
 import { useChatContext } from '../../../context/ChatContext';
 import { useTranslationContext } from '../../../context/TranslationContext';
-export var useFileUploads = function (props, state, dispatch) {
-    var doFileUploadRequest = props.doFileUploadRequest, errorHandler = props.errorHandler;
-    var fileUploads = state.fileUploads;
-    var channel = useChannelStateContext('useFileUploads').channel;
-    var addNotification = useChannelActionContext('useFileUploads').addNotification;
-    var getAppSettings = useChatContext('useFileUploads').getAppSettings;
-    var t = useTranslationContext('useFileUploads').t;
-    var uploadFile = useCallback(function (id) {
-        dispatch({ id: id, state: 'uploading', type: 'setFileUpload' });
+export const useFileUploads = (props, state, dispatch) => {
+    const { doFileUploadRequest, errorHandler } = props;
+    const { fileUploads } = state;
+    const { channel } = useChannelStateContext('useFileUploads');
+    const { addNotification } = useChannelActionContext('useFileUploads');
+    const { getAppSettings } = useChatContext('useFileUploads');
+    const { t } = useTranslationContext('useFileUploads');
+    const uploadFile = useCallback((id) => {
+        dispatch({ id, state: 'uploading', type: 'setFileUpload' });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    var removeFile = useCallback(function (id) {
+    const removeFile = useCallback((id) => {
         // TODO: cancel upload if still uploading
-        dispatch({ id: id, type: 'removeFileUpload' });
+        dispatch({ id, type: 'removeFileUpload' });
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    useEffect(function () {
-        (function () { return __awaiter(void 0, void 0, void 0, function () {
-            var upload, file, id, canUpload, response, error_1, errorMessage, alreadyRemoved;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
-                    case 0:
-                        upload = Object.values(fileUploads).find(function (fileUpload) { return fileUpload.state === 'uploading' && fileUpload.file; });
-                        if (!upload)
-                            return [2 /*return*/];
-                        file = upload.file, id = upload.id;
-                        return [4 /*yield*/, checkUploadPermissions({
-                                addNotification: addNotification,
-                                file: file,
-                                getAppSettings: getAppSettings,
-                                t: t,
-                                uploadType: 'file',
-                            })];
-                    case 1:
-                        canUpload = _a.sent();
-                        if (!canUpload)
-                            return [2 /*return*/, removeFile(id)];
-                        _a.label = 2;
-                    case 2:
-                        _a.trys.push([2, 7, , 8]);
-                        if (!doFileUploadRequest) return [3 /*break*/, 4];
-                        return [4 /*yield*/, doFileUploadRequest(file, channel)];
-                    case 3:
-                        response = _a.sent();
-                        return [3 /*break*/, 6];
-                    case 4: return [4 /*yield*/, channel.sendFile(file)];
-                    case 5:
-                        response = _a.sent();
-                        _a.label = 6;
-                    case 6: return [3 /*break*/, 8];
-                    case 7:
-                        error_1 = _a.sent();
-                        errorMessage = typeof error_1.message === 'string'
-                            ? error_1.message
-                            : t('Error uploading file');
-                        addNotification(errorMessage, 'error');
-                        alreadyRemoved = false;
-                        if (!fileUploads[id]) {
-                            alreadyRemoved = true;
-                        }
-                        else {
-                            dispatch({ id: id, state: 'failed', type: 'setFileUpload' });
-                        }
-                        if (!alreadyRemoved && errorHandler) {
-                            // TODO: verify if the parameters passed to the error handler actually make sense
-                            errorHandler(error_1, 'upload-file', file);
-                        }
-                        return [2 /*return*/];
-                    case 8:
-                        // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
-                        // This is for the case if someone wants to handle failure on app level.
-                        if (!response) {
-                            removeFile(id);
-                            return [2 /*return*/];
-                        }
-                        dispatch({
-                            id: id,
-                            state: 'finished',
-                            thumb_url: response.thumb_url,
-                            type: 'setFileUpload',
-                            url: response.file,
-                        });
-                        return [2 /*return*/];
+    useEffect(() => {
+        (async () => {
+            const upload = Object.values(fileUploads).find((fileUpload) => fileUpload.state === 'uploading' && fileUpload.file);
+            if (!upload)
+                return;
+            const { file, id } = upload;
+            const canUpload = await checkUploadPermissions({
+                addNotification,
+                file,
+                getAppSettings,
+                t,
+                uploadType: 'file',
+            });
+            if (!canUpload)
+                return removeFile(id);
+            let response;
+            try {
+                if (doFileUploadRequest) {
+                    response = await doFileUploadRequest(file, channel);
+                }
+                else {
+                    response = await channel.sendFile(file);
+                }
+            }
+            catch (error) {
+                const errorMessage = typeof error.message === 'string'
+                    ? error.message
+                    : t('Error uploading file');
+                addNotification(errorMessage, 'error');
+                let alreadyRemoved = false;
+                if (!fileUploads[id]) {
+                    alreadyRemoved = true;
+                }
+                else {
+                    dispatch({ id, state: 'failed', type: 'setFileUpload' });
+                }
+                if (!alreadyRemoved && errorHandler) {
+                    // TODO: verify if the parameters passed to the error handler actually make sense
+                    errorHandler(error, 'upload-file', file);
                 }
+                return;
+            }
+            // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
+            // This is for the case if someone wants to handle failure on app level.
+            if (!response) {
+                removeFile(id);
+                return;
+            }
+            dispatch({
+                id,
+                state: 'finished',
+                thumb_url: response.thumb_url,
+                type: 'setFileUpload',
+                url: response.file,
             });
-        }); })();
+        })();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [fileUploads, channel, doFileUploadRequest, errorHandler, removeFile]);
     return {
-        removeFile: removeFile,
-        uploadFile: uploadFile,
+        removeFile,
+        uploadFile,
     };
 };

package/dist/components/MessageInput/hooks/useImageUploads.d.ts

@@ -6,4 +6,3 @@ export declare const useImageUploads: <StreamChatGenerics extends DefaultStreamC
     removeImage: (id: string) => void;
     uploadImage: (id: string) => Promise<void>;
 };
-//# sourceMappingURL=useImageUploads.d.ts.map

package/dist/components/MessageInput/hooks/useImageUploads.js

@@ -1,107 +1,94 @@
-import { __assign, __awaiter, __generator } from "tslib";
 import { useCallback, useEffect } from 'react';
 import { checkUploadPermissions } from './utils';
 import { useChannelActionContext } from '../../../context/ChannelActionContext';
 import { useChannelStateContext } from '../../../context/ChannelStateContext';
 import { useChatContext } from '../../../context/ChatContext';
 import { useTranslationContext } from '../../../context/TranslationContext';
-export var useImageUploads = function (props, state, dispatch) {
-    var doImageUploadRequest = props.doImageUploadRequest, errorHandler = props.errorHandler;
-    var imageUploads = state.imageUploads;
-    var channel = useChannelStateContext('useImageUploads').channel;
-    var getAppSettings = useChatContext('useImageUploads').getAppSettings;
-    var addNotification = useChannelActionContext('useImageUploads').addNotification;
-    var t = useTranslationContext('useImageUploads').t;
-    var removeImage = useCallback(function (id) {
-        dispatch({ id: id, type: 'removeImageUpload' });
+export const useImageUploads = (props, state, dispatch) => {
+    const { doImageUploadRequest, errorHandler } = props;
+    const { imageUploads } = state;
+    const { channel } = useChannelStateContext('useImageUploads');
+    const { getAppSettings } = useChatContext('useImageUploads');
+    const { addNotification } = useChannelActionContext('useImageUploads');
+    const { t } = useTranslationContext('useImageUploads');
+    const removeImage = useCallback((id) => {
+        dispatch({ id, type: 'removeImageUpload' });
         // TODO: cancel upload if still uploading
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
-    var uploadImage = useCallback(function (id) { return __awaiter(void 0, void 0, void 0, function () {
-        var img, file, canUpload, response, error_1, errorMessage, alreadyRemoved;
-        var _a;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
-                case 0:
-                    img = imageUploads[id];
-                    if (!img)
-                        return [2 /*return*/];
-                    file = img.file;
-                    if (img.state !== 'uploading') {
-                        dispatch({ id: id, state: 'uploading', type: 'setImageUpload' });
-                    }
-                    return [4 /*yield*/, checkUploadPermissions({
-                            addNotification: addNotification,
-                            file: file,
-                            getAppSettings: getAppSettings,
-                            t: t,
-                            uploadType: 'image',
-                        })];
-                case 1:
-                    canUpload = _b.sent();
-                    if (!canUpload)
-                        return [2 /*return*/, removeImage(id)];
-                    _b.label = 2;
-                case 2:
-                    _b.trys.push([2, 7, , 8]);
-                    if (!doImageUploadRequest) return [3 /*break*/, 4];
-                    return [4 /*yield*/, doImageUploadRequest(file, channel)];
-                case 3:
-                    response = _b.sent();
-                    return [3 /*break*/, 6];
-                case 4: return [4 /*yield*/, channel.sendImage(file)];
-                case 5:
-                    response = _b.sent();
-                    _b.label = 6;
-                case 6: return [3 /*break*/, 8];
-                case 7:
-                    error_1 = _b.sent();
-                    errorMessage = typeof error_1.message === 'string'
-                        ? error_1.message
-                        : t('Error uploading image');
-                    addNotification(errorMessage, 'error');
-                    alreadyRemoved = false;
-                    if (!imageUploads[id]) {
-                        alreadyRemoved = true;
-                    }
-                    else {
-                        dispatch({ id: id, state: 'failed', type: 'setImageUpload' });
-                    }
-                    if (!alreadyRemoved && errorHandler) {
-                        // TODO: verify if the parameters passed to the error handler actually make sense
-                        errorHandler(error_1, 'upload-image', __assign(__assign({}, file), { id: id }));
-                    }
-                    return [2 /*return*/];
-                case 8:
-                    // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
-                    // This is for the case if someone wants to handle failure on app level.
-                    if (!response) {
-                        removeImage(id);
-                        return [2 /*return*/];
-                    }
-                    if (img.previewUri)
-                        (_a = URL.revokeObjectURL) === null || _a === void 0 ? void 0 : _a.call(URL, img.previewUri);
-                    dispatch({
-                        id: id,
-                        previewUri: undefined,
-                        state: 'finished',
-                        type: 'setImageUpload',
-                        url: response.file,
-                    });
-                    return [2 /*return*/];
+    const uploadImage = useCallback(async (id) => {
+        const img = imageUploads[id];
+        if (!img)
+            return;
+        const { file } = img;
+        if (img.state !== 'uploading') {
+            dispatch({ id, state: 'uploading', type: 'setImageUpload' });
+        }
+        const canUpload = await checkUploadPermissions({
+            addNotification,
+            file,
+            getAppSettings,
+            t,
+            uploadType: 'image',
+        });
+        if (!canUpload)
+            return removeImage(id);
+        let response;
+        try {
+            if (doImageUploadRequest) {
+                response = await doImageUploadRequest(file, channel);
+            }
+            else {
+                response = await channel.sendImage(file);
+            }
+        }
+        catch (error) {
+            const errorMessage = typeof error.message === 'string'
+                ? error.message
+                : t('Error uploading image');
+            addNotification(errorMessage, 'error');
+            let alreadyRemoved = false;
+            if (!imageUploads[id]) {
+                alreadyRemoved = true;
             }
+            else {
+                dispatch({ id, state: 'failed', type: 'setImageUpload' });
+            }
+            if (!alreadyRemoved && errorHandler) {
+                // TODO: verify if the parameters passed to the error handler actually make sense
+                errorHandler(error, 'upload-image', {
+                    ...file,
+                    id,
+                });
+            }
+            return;
+        }
+        // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
+        // This is for the case if someone wants to handle failure on app level.
+        if (!response) {
+            removeImage(id);
+            return;
+        }
+        if (img.previewUri)
+            URL.revokeObjectURL?.(img.previewUri);
+        dispatch({
+            id,
+            previewUri: undefined,
+            state: 'finished',
+            type: 'setImageUpload',
+            url: response.file,
         });
-    }); }, 
+    }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [imageUploads, channel, doImageUploadRequest, errorHandler, removeImage]);
-    useEffect(function () {
-        var upload = Object.values(imageUploads).find(function (imageUpload) { return imageUpload.state === 'uploading' && imageUpload.file; });
+    useEffect(() => {
+        const upload = Object.values(imageUploads).find((imageUpload) => imageUpload.state === 'uploading' && imageUpload.file);
         if (!upload)
             return;
         uploadImage(upload.id);
     }, [imageUploads, uploadImage]);
     return {
-        removeImage: removeImage,
-        uploadImage: uploadImage,
+        removeImage,
+        uploadImage,
     };
 };

package/dist/components/MessageInput/hooks/useLinkPreviews.d.ts

@@ -28,4 +28,3 @@ export type EnrichURLsController = {
 };
 export declare const useLinkPreviews: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics>({ debounceURLEnrichmentMs: debounceURLEnrichmentMsInputContext, dispatch, enrichURLForPreview, findURLFn: findURLFnInputContext, linkPreviews, onLinkPreviewDismissed: onLinkPreviewDismissedInputContext, }: UseEnrichURLsParams<StreamChatGenerics>) => EnrichURLsController;
 export {};
-//# sourceMappingURL=useLinkPreviews.d.ts.map