stream-chat-react 12.0.0-rc.2 → 12.0.0-rc.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (91) hide show
  1. package/README.md +10 -0
  2. package/dist/components/Attachment/components/WaveProgressBar.d.ts +3 -1
  3. package/dist/components/Attachment/components/WaveProgressBar.js +44 -9
  4. package/dist/components/Channel/channelState.js +1 -0
  5. package/dist/components/DateSeparator/DateSeparator.js +1 -1
  6. package/dist/components/EventComponent/EventComponent.js +1 -1
  7. package/dist/components/InfiniteScrollPaginator/InfiniteScroll.js +9 -3
  8. package/dist/components/MediaRecorder/classes/MediaRecorderController.d.ts +6 -7
  9. package/dist/components/MediaRecorder/classes/MediaRecorderController.js +0 -5
  10. package/dist/components/MediaRecorder/hooks/index.d.ts +1 -1
  11. package/dist/components/MediaRecorder/hooks/useMediaRecorder.d.ts +1 -2
  12. package/dist/components/MediaRecorder/hooks/useMediaRecorder.js +1 -1
  13. package/dist/components/MediaRecorder/index.d.ts +1 -0
  14. package/dist/components/MediaRecorder/transcode/index.d.ts +6 -5
  15. package/dist/components/MediaRecorder/transcode/index.js +5 -15
  16. package/dist/components/Message/MessageSimple.js +1 -1
  17. package/dist/components/Message/MessageTimestamp.d.ts +0 -1
  18. package/dist/components/Message/MessageTimestamp.js +0 -1
  19. package/dist/components/Message/Timestamp.d.ts +0 -1
  20. package/dist/components/Message/Timestamp.js +2 -3
  21. package/dist/components/Message/renderText/remarkPlugins/keepLineBreaksPlugin.js +1 -1
  22. package/dist/components/Message/utils.js +2 -0
  23. package/dist/components/MessageInput/AttachmentPreviewList/AttachmentPreviewList.js +23 -27
  24. package/dist/components/MessageInput/AttachmentPreviewList/FileAttachmentPreview.d.ts +1 -0
  25. package/dist/components/MessageInput/AttachmentPreviewList/FileAttachmentPreview.js +1 -1
  26. package/dist/components/MessageInput/AttachmentPreviewList/ImageAttachmentPreview.js +2 -1
  27. package/dist/components/MessageInput/MessageInput.d.ts +4 -6
  28. package/dist/components/MessageInput/MessageInputFlat.js +4 -7
  29. package/dist/components/MessageInput/hooks/useAttachments.d.ts +1 -5
  30. package/dist/components/MessageInput/hooks/useAttachments.js +65 -52
  31. package/dist/components/MessageInput/hooks/useCreateMessageInputContext.js +2 -19
  32. package/dist/components/MessageInput/hooks/useMessageInputState.d.ts +2 -35
  33. package/dist/components/MessageInput/hooks/useMessageInputState.js +2 -107
  34. package/dist/components/MessageInput/hooks/usePasteHandler.js +1 -3
  35. package/dist/components/MessageInput/hooks/useSubmitHandler.js +19 -71
  36. package/dist/components/MessageInput/hooks/utils.d.ts +1 -2
  37. package/dist/components/MessageInput/icons.d.ts +0 -1
  38. package/dist/components/MessageInput/icons.js +0 -3
  39. package/dist/components/MessageInput/types.d.ts +3 -30
  40. package/dist/components/MessageList/MessageList.d.ts +3 -1
  41. package/dist/components/MessageList/MessageList.js +2 -1
  42. package/dist/components/MessageList/VirtualizedMessageList.d.ts +3 -1
  43. package/dist/components/MessageList/VirtualizedMessageList.js +3 -3
  44. package/dist/components/MessageList/VirtualizedMessageListComponents.js +3 -2
  45. package/dist/components/MessageList/hooks/MessageList/useEnrichedMessages.d.ts +2 -1
  46. package/dist/components/MessageList/hooks/MessageList/useEnrichedMessages.js +3 -3
  47. package/dist/components/MessageList/utils.d.ts +1 -1
  48. package/dist/components/MessageList/utils.js +16 -6
  49. package/dist/components/ReactFileUtilities/types.d.ts +0 -29
  50. package/dist/components/ReactFileUtilities/utils.d.ts +2 -0
  51. package/dist/components/ReactFileUtilities/utils.js +2 -0
  52. package/dist/context/ChannelActionContext.d.ts +2 -2
  53. package/dist/context/MessageInputContext.d.ts +1 -5
  54. package/dist/i18n/Streami18n.d.ts +2 -0
  55. package/dist/i18n/de.json +3 -1
  56. package/dist/i18n/en.json +3 -1
  57. package/dist/i18n/es.json +3 -1
  58. package/dist/i18n/fr.json +3 -1
  59. package/dist/i18n/hi.json +3 -1
  60. package/dist/i18n/it.json +3 -1
  61. package/dist/i18n/ja.json +3 -1
  62. package/dist/i18n/ko.json +3 -1
  63. package/dist/i18n/nl.json +3 -1
  64. package/dist/i18n/pt.json +3 -1
  65. package/dist/i18n/ru.json +3 -1
  66. package/dist/i18n/tr.json +3 -1
  67. package/dist/i18n/utils.d.ts +3 -3
  68. package/dist/index.cjs.js +1987 -12143
  69. package/dist/index.cjs.js.map +4 -4
  70. package/dist/{components → plugins}/Emojis/EmojiPicker.js +1 -1
  71. package/dist/plugins/Emojis/icons.d.ts +2 -0
  72. package/dist/plugins/Emojis/icons.js +4 -0
  73. package/dist/{components → plugins}/Emojis/index.cjs.js +23 -22
  74. package/dist/plugins/Emojis/index.cjs.js.map +7 -0
  75. package/dist/plugins/Emojis/index.d.ts +2 -0
  76. package/dist/plugins/Emojis/index.js +2 -0
  77. package/dist/plugins/encoders/mp3.cjs.js +111 -0
  78. package/dist/plugins/encoders/mp3.cjs.js.map +7 -0
  79. package/dist/{components/MediaRecorder/transcode → plugins/encoders}/mp3.js +3 -3
  80. package/package.json +16 -6
  81. package/dist/components/Emojis/index.cjs.js.map +0 -7
  82. package/dist/components/Emojis/index.d.ts +0 -1
  83. package/dist/components/Emojis/index.js +0 -1
  84. package/dist/components/MessageInput/AttachmentPreviewList/UploadPreviewItem.d.ts +0 -11
  85. package/dist/components/MessageInput/AttachmentPreviewList/UploadPreviewItem.js +0 -51
  86. package/dist/components/MessageInput/hooks/useFileUploads.d.ts +0 -7
  87. package/dist/components/MessageInput/hooks/useFileUploads.js +0 -85
  88. package/dist/components/MessageInput/hooks/useImageUploads.d.ts +0 -8
  89. package/dist/components/MessageInput/hooks/useImageUploads.js +0 -94
  90. /package/dist/{components → plugins}/Emojis/EmojiPicker.d.ts +0 -0
  91. /package/dist/{components/MediaRecorder/transcode → plugins/encoders}/mp3.d.ts +0 -0
@@ -1,51 +0,0 @@
1
- import React, { useCallback, useMemo } from 'react';
2
- import { FileAttachmentPreview } from './FileAttachmentPreview';
3
- import { ImageAttachmentPreview } from './ImageAttachmentPreview';
4
- import { useMessageInputContext } from '../../../context';
5
- export const ImageUploadPreviewAdapter = ({ id, Preview = ImageAttachmentPreview, }) => {
6
- const { imageUploads, removeImage, uploadImage } = useMessageInputContext('ImageUploadPreviewAdapter');
7
- const removeAttachments = useCallback((ids) => removeImage(ids[0]), [removeImage]);
8
- const handleRetry = useCallback((attachment) => attachment.localMetadata && uploadImage(attachment.localMetadata.id), [uploadImage]);
9
- const image = imageUploads[id];
10
- const attachment = useMemo(() =>
11
- // do not display scraped attachments
12
- !image || image.og_scrape_url
13
- ? undefined
14
- : {
15
- image_url: image.previewUri ?? image.url,
16
- localMetadata: {
17
- file: image.file,
18
- id,
19
- uploadState: image.state,
20
- },
21
- title: image.file.name,
22
- type: 'image',
23
- }, [id, image]);
24
- if (!attachment)
25
- return null;
26
- return (React.createElement(Preview, { attachment: attachment, handleRetry: handleRetry, removeAttachments: removeAttachments }));
27
- };
28
- export const FileUploadPreviewAdapter = ({ id, Preview = FileAttachmentPreview, }) => {
29
- const { fileUploads, removeFile, uploadFile } = useMessageInputContext('FileUploadPreviewAdapter');
30
- const removeAttachments = useCallback((ids) => {
31
- removeFile(ids[0]);
32
- }, [removeFile]);
33
- const handleRetry = useCallback((attachment) => attachment.localMetadata && uploadFile(attachment.localMetadata.id), [uploadFile]);
34
- const file = fileUploads[id];
35
- const attachment = useMemo(() => !file
36
- ? undefined
37
- : {
38
- asset_url: file.url,
39
- localMetadata: {
40
- file: file.file,
41
- id,
42
- uploadState: file.state,
43
- },
44
- mime_type: file.file.type,
45
- title: file.file.name,
46
- type: 'file',
47
- }, [file, id]);
48
- if (!attachment)
49
- return null;
50
- return (React.createElement(Preview, { attachment: attachment, handleRetry: handleRetry, removeAttachments: removeAttachments }));
51
- };
@@ -1,7 +0,0 @@
1
- import type { MessageInputReducerAction, MessageInputState } from './useMessageInputState';
2
- import type { MessageInputProps } from '../MessageInput';
3
- import type { CustomTrigger, DefaultStreamChatGenerics } from '../../../types/types';
4
- export declare const useFileUploads: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: React.Dispatch<MessageInputReducerAction<StreamChatGenerics>>) => {
5
- removeFile: (id: string) => void;
6
- uploadFile: (id: string) => void;
7
- };
@@ -1,85 +0,0 @@
1
- import { useCallback, useEffect } from 'react';
2
- import { checkUploadPermissions } from './utils';
3
- import { useChannelActionContext } from '../../../context/ChannelActionContext';
4
- import { useChannelStateContext } from '../../../context/ChannelStateContext';
5
- import { useChatContext } from '../../../context/ChatContext';
6
- import { useTranslationContext } from '../../../context/TranslationContext';
7
- export const useFileUploads = (props, state, dispatch) => {
8
- const { doFileUploadRequest, errorHandler } = props;
9
- const { fileUploads } = state;
10
- const { channel } = useChannelStateContext('useFileUploads');
11
- const { addNotification } = useChannelActionContext('useFileUploads');
12
- const { getAppSettings } = useChatContext('useFileUploads');
13
- const { t } = useTranslationContext('useFileUploads');
14
- const uploadFile = useCallback((id) => {
15
- dispatch({ id, state: 'uploading', type: 'setFileUpload' });
16
- // eslint-disable-next-line react-hooks/exhaustive-deps
17
- }, []);
18
- const removeFile = useCallback((id) => {
19
- // TODO: cancel upload if still uploading
20
- dispatch({ id, type: 'removeFileUpload' });
21
- // eslint-disable-next-line react-hooks/exhaustive-deps
22
- }, []);
23
- useEffect(() => {
24
- (async () => {
25
- const upload = Object.values(fileUploads).find((fileUpload) => fileUpload.state === 'uploading' && fileUpload.file);
26
- if (!upload)
27
- return;
28
- const { file, id } = upload;
29
- const canUpload = await checkUploadPermissions({
30
- addNotification,
31
- file,
32
- getAppSettings,
33
- t,
34
- uploadType: 'file',
35
- });
36
- if (!canUpload)
37
- return removeFile(id);
38
- let response;
39
- try {
40
- if (doFileUploadRequest) {
41
- response = await doFileUploadRequest(file, channel);
42
- }
43
- else {
44
- response = await channel.sendFile(file);
45
- }
46
- }
47
- catch (error) {
48
- const errorMessage = typeof error.message === 'string'
49
- ? error.message
50
- : t('Error uploading file');
51
- addNotification(errorMessage, 'error');
52
- let alreadyRemoved = false;
53
- if (!fileUploads[id]) {
54
- alreadyRemoved = true;
55
- }
56
- else {
57
- dispatch({ id, state: 'failed', type: 'setFileUpload' });
58
- }
59
- if (!alreadyRemoved && errorHandler) {
60
- // TODO: verify if the parameters passed to the error handler actually make sense
61
- errorHandler(error, 'upload-file', file);
62
- }
63
- return;
64
- }
65
- // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
66
- // This is for the case if someone wants to handle failure on app level.
67
- if (!response) {
68
- removeFile(id);
69
- return;
70
- }
71
- dispatch({
72
- id,
73
- state: 'finished',
74
- thumb_url: response.thumb_url,
75
- type: 'setFileUpload',
76
- url: response.file,
77
- });
78
- })();
79
- // eslint-disable-next-line react-hooks/exhaustive-deps
80
- }, [fileUploads, channel, doFileUploadRequest, errorHandler, removeFile]);
81
- return {
82
- removeFile,
83
- uploadFile,
84
- };
85
- };
@@ -1,8 +0,0 @@
1
- import React from 'react';
2
- import type { MessageInputReducerAction, MessageInputState } from './useMessageInputState';
3
- import type { MessageInputProps } from '../MessageInput';
4
- import type { CustomTrigger, DefaultStreamChatGenerics } from '../../../types/types';
5
- export declare const useImageUploads: <StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics, V extends CustomTrigger = CustomTrigger>(props: MessageInputProps<StreamChatGenerics, V>, state: MessageInputState<StreamChatGenerics>, dispatch: React.Dispatch<MessageInputReducerAction<StreamChatGenerics>>) => {
6
- removeImage: (id: string) => void;
7
- uploadImage: (id: string) => Promise<void>;
8
- };
@@ -1,94 +0,0 @@
1
- import { useCallback, useEffect } from 'react';
2
- import { checkUploadPermissions } from './utils';
3
- import { useChannelActionContext } from '../../../context/ChannelActionContext';
4
- import { useChannelStateContext } from '../../../context/ChannelStateContext';
5
- import { useChatContext } from '../../../context/ChatContext';
6
- import { useTranslationContext } from '../../../context/TranslationContext';
7
- export const useImageUploads = (props, state, dispatch) => {
8
- const { doImageUploadRequest, errorHandler } = props;
9
- const { imageUploads } = state;
10
- const { channel } = useChannelStateContext('useImageUploads');
11
- const { getAppSettings } = useChatContext('useImageUploads');
12
- const { addNotification } = useChannelActionContext('useImageUploads');
13
- const { t } = useTranslationContext('useImageUploads');
14
- const removeImage = useCallback((id) => {
15
- dispatch({ id, type: 'removeImageUpload' });
16
- // TODO: cancel upload if still uploading
17
- // eslint-disable-next-line react-hooks/exhaustive-deps
18
- }, []);
19
- const uploadImage = useCallback(async (id) => {
20
- const img = imageUploads[id];
21
- if (!img)
22
- return;
23
- const { file } = img;
24
- if (img.state !== 'uploading') {
25
- dispatch({ id, state: 'uploading', type: 'setImageUpload' });
26
- }
27
- const canUpload = await checkUploadPermissions({
28
- addNotification,
29
- file,
30
- getAppSettings,
31
- t,
32
- uploadType: 'image',
33
- });
34
- if (!canUpload)
35
- return removeImage(id);
36
- let response;
37
- try {
38
- if (doImageUploadRequest) {
39
- response = await doImageUploadRequest(file, channel);
40
- }
41
- else {
42
- response = await channel.sendImage(file);
43
- }
44
- }
45
- catch (error) {
46
- const errorMessage = typeof error.message === 'string'
47
- ? error.message
48
- : t('Error uploading image');
49
- addNotification(errorMessage, 'error');
50
- let alreadyRemoved = false;
51
- if (!imageUploads[id]) {
52
- alreadyRemoved = true;
53
- }
54
- else {
55
- dispatch({ id, state: 'failed', type: 'setImageUpload' });
56
- }
57
- if (!alreadyRemoved && errorHandler) {
58
- // TODO: verify if the parameters passed to the error handler actually make sense
59
- errorHandler(error, 'upload-image', {
60
- ...file,
61
- id,
62
- });
63
- }
64
- return;
65
- }
66
- // If doImageUploadRequest returns any falsy value, then don't create the upload preview.
67
- // This is for the case if someone wants to handle failure on app level.
68
- if (!response) {
69
- removeImage(id);
70
- return;
71
- }
72
- if (img.previewUri)
73
- URL.revokeObjectURL?.(img.previewUri);
74
- dispatch({
75
- id,
76
- previewUri: undefined,
77
- state: 'finished',
78
- type: 'setImageUpload',
79
- url: response.file,
80
- });
81
- },
82
- // eslint-disable-next-line react-hooks/exhaustive-deps
83
- [imageUploads, channel, doImageUploadRequest, errorHandler, removeImage]);
84
- useEffect(() => {
85
- const upload = Object.values(imageUploads).find((imageUpload) => imageUpload.state === 'uploading' && imageUpload.file);
86
- if (!upload)
87
- return;
88
- uploadImage(upload.id);
89
- }, [imageUploads, uploadImage]);
90
- return {
91
- removeImage,
92
- uploadImage,
93
- };
94
- };