stream-chat-react 13.0.0 → 13.0.1

package/dist/components/Chat/hooks/useChat.js

@@ -24,7 +24,7 @@ export const useChat = ({ client, defaultLanguage = 'en', i18nInstance, initialN
     useEffect(() => {
         if (!client)
             return;
-        const version = "13.0.0";
+        const version = "13.0.1";
         const userAgent = client.getUserAgent();
         if (!userAgent.includes('stream-chat-react')) {
             // result looks like: 'stream-chat-react-2.3.2-stream-chat-javascript-client-browser-2.2.2'

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

@@ -1,7 +1,24 @@
 import { useCallback } from 'react';
+import { MessageComposer } from 'stream-chat';
 import { useMessageComposer } from './useMessageComposer';
 import { useChannelActionContext } from '../../../context/ChannelActionContext';
 import { useTranslationContext } from '../../../context/TranslationContext';
+const takeStateSnapshot = (messageComposer) => {
+    const textComposerState = messageComposer.textComposer.state.getLatestValue();
+    const attachmentManagerState = messageComposer.attachmentManager.state.getLatestValue();
+    const linkPreviewsManagerState = messageComposer.linkPreviewsManager.state.getLatestValue();
+    const pollComposerState = messageComposer.pollComposer.state.getLatestValue();
+    const customDataManagerState = messageComposer.customDataManager.state.getLatestValue();
+    const state = messageComposer.state.getLatestValue();
+    return () => {
+        messageComposer.state.next(state);
+        messageComposer.textComposer.state.next(textComposerState);
+        messageComposer.attachmentManager.state.next(attachmentManagerState);
+        messageComposer.linkPreviewsManager.state.next(linkPreviewsManagerState);
+        messageComposer.pollComposer.state.next(pollComposerState);
+        messageComposer.customDataManager.state.next(customDataManagerState);
+    };
+};
 export const useSubmitHandler = (props) => {
     const { clearEditingState, overrideSubmitHandler } = props;
     const { addNotification, editMessage, sendMessage } = useChannelActionContext('useSubmitHandler');
@@ -23,7 +40,20 @@ export const useSubmitHandler = (props) => {
             }
         }
         else {
+            const restoreComposerStateSnapshot = takeStateSnapshot(messageComposer);
             try {
+                // FIXME: once MessageComposer has sendMessage method, then the following condition should be encapsulated by it
+                // keep attachments, text, quoted message (treat them as draft) ... if sending a poll
+                const sentPollMessage = !!message.poll_id;
+                if (sentPollMessage) {
+                    messageComposer.state.partialNext({
+                        id: MessageComposer.generateId(),
+                        pollId: null,
+                    });
+                }
+                else {
+                    messageComposer.clear();
+                }
                 // todo: get rid of overrideSubmitHandler once MessageComposer supports submission flow
                 if (overrideSubmitHandler) {
                     await overrideSubmitHandler({
@@ -36,11 +66,11 @@ export const useSubmitHandler = (props) => {
                 else {
                     await sendMessage({ localMessage, message, options: sendOptions });
                 }
-                messageComposer.clear();
                 if (messageComposer.config.text.publishTypingEvents)
                     await messageComposer.channel.stopTyping();
             }
             catch (err) {
+                restoreComposerStateSnapshot();
                 addNotification(t('Send message request failed'), 'error');
             }
         }

package/dist/components/Poll/PollActions/PollResults/PollResults.js

@@ -7,7 +7,7 @@ import { useStateStore } from '../../../../store';
 import { usePollContext, useTranslationContext } from '../../../../context';
 const pollStateSelector = (nextValue) => ({
     name: nextValue.name,
-    options: nextValue.options,
+    options: [...nextValue.options],
     vote_counts_by_option: nextValue.vote_counts_by_option,
 });
 export const PollResults = ({ close }) => {

package/dist/components/Poll/PollCreationDialog/MultipleAnswersField.js

@@ -28,8 +28,15 @@ export const MultipleAnswersField = () => {
                 React.createElement("input", { id: 'max_votes_allowed', onBlur: () => {
                         pollComposer.handleFieldBlur('max_votes_allowed');
                     }, onChange: (e) => {
+                        const nativeFieldValidation = !e.target.validity.valid
+                            ? {
+                                max_votes_allowed: t('Only numbers are allowed'),
+                            }
+                            : undefined;
                         pollComposer.updateFields({
-                            max_votes_allowed: e.target.value,
-                        });
+                            max_votes_allowed: !nativeFieldValidation
+                                ? e.target.value
+                                : pollComposer.max_votes_allowed,
+                        }, nativeFieldValidation);
                     }, placeholder: t('Maximum number of votes (from 2 to 10)'), type: 'number', value: max_votes_allowed }))))));
 };

package/dist/components/TextareaComposer/TextareaComposer.js

@@ -26,11 +26,11 @@ const configStateSelector = (state) => ({
  * In the long term, the fix should happen by handling keypress, but changing this has unknown implications.
  */
 const defaultShouldSubmit = (event) => event.key === 'Enter' && !event.shiftKey && !event.nativeEvent.isComposing;
-export const TextareaComposer = ({ className, closeSuggestionsOnClickOutside, containerClassName, listClassName, maxRows: maxRowsProp = 1, minRows: minRowsProp, onBlur, onChange, onKeyDown, onScroll, onSelect, placeholder: placeholderProp, shouldSubmit: shouldSubmitProp, ...restTextareaProps }) => {
+export const TextareaComposer = ({ className, closeSuggestionsOnClickOutside, containerClassName, listClassName, maxRows: maxRowsProp, minRows: minRowsProp, onBlur, onChange, onKeyDown, onScroll, onSelect, placeholder: placeholderProp, shouldSubmit: shouldSubmitProp, ...restTextareaProps }) => {
     const { t } = useTranslationContext();
     const { AutocompleteSuggestionList = DefaultSuggestionList } = useComponentContext();
     const { additionalTextareaProps, cooldownRemaining, handleSubmit, maxRows: maxRowsContext, minRows: minRowsContext, onPaste, shouldSubmit: shouldSubmitContext, textareaRef, } = useMessageInputContext();
-    const maxRows = maxRowsProp ?? maxRowsContext;
+    const maxRows = maxRowsProp ?? maxRowsContext ?? 1;
     const minRows = minRowsProp ?? minRowsContext;
     const placeholder = placeholderProp ?? additionalTextareaProps?.placeholder;
     const shouldSubmit = shouldSubmitProp ?? shouldSubmitContext ?? defaultShouldSubmit;
@@ -68,16 +68,13 @@ export const TextareaComposer = ({ className, closeSuggestionsOnClickOutside, co
             onKeyDown(event);
             return;
         }
-        if (event.key === 'Enter') {
-            // allow next line only on Shift + Enter. Enter is reserved for submission.
-            event.preventDefault();
-        }
         if (textComposer.suggestions &&
             textComposer.suggestions.searchSource.items?.length) {
             if (event.key === 'Escape')
                 return textComposer.closeSuggestions();
             const loadedItems = textComposer.suggestions.searchSource.items;
             if (event.key === 'Enter') {
+                event.preventDefault();
                 textComposer.handleSelect(loadedItems[focusedItemIndex]);
             }
             if (event.key === 'ArrowUp') {