stream-chat-react-native-core 3.10.2 → 4.0.0-beta.4

package/lib/typescript/i18n/nl.json

@@ -6,10 +6,10 @@
     "Are you sure you want to permanently delete this message?": "Weet u zeker dat u dit bericht definitief wilt verwijderen?",
     "Block User": "Blokkeer Gebruiker",
     "Cancel": "Annuleer",
+    "Cannot Flag Message": "Kan bericht niet rapporteren",
     "Copy Message": "Bericht kopiëren",
     "Delete": "Verwijderen",
     "Delete Message": "Verwijder bericht",
-    "Dismiss": "Afwijzen",
     "Do you want to send a copy of this message to a moderator for further investigation?": "Wil je een kopie van dit bericht naar een moderator sturen voor verder onderzoek?",
     "Edit Message": "Pas bericht aan",
     "Editing Message": "Bericht aanpassen",
@@ -21,7 +21,9 @@
     "Error while loading, please reload/refresh": "Probleem bij het laden, probeer opnieuw",
     "Flag": "Markeer",
     "Flag Message": "Markeer bericht",
+    "Flag action failed either due to a network issue or the message is already flagged": "Rapporteren mislukt door een netwerk fout of het berich is al gerapporteerd",
     "Instant Commands": "Directe Opdrachten",
+    "Links are disabled": "Het versturen van links staat uit",
     "Loading channels...": "Kanalen aan het laden...",
     "Loading messages...": "Berichten aan het laden...",
     "Loading...": "Aan het laden...",
@@ -30,9 +32,11 @@
     "Message flagged": "Bericht gemarkeerd",
     "Mute User": "Gebruiker dempen",
     "Nothing yet...": "Nog niets...",
+    "Ok": "Oké",
     "Only visible to you": "Alleen zichtbaar voor jou",
     "Photo": "Foto",
     "Photos": "Foto's",
+    "Pin to Conversation": "Vastmaken aan gesprek",
     "Please enable access to your photos and videos so you can share them.": "Schakel toegang tot uw foto's en video's in zodat u ze kunt delen.",
     "Please select a channel first": "Selecteer eerst een kanaal",
     "Reconnecting...": "Opnieuw Verbinding Maken...",
@@ -41,15 +45,17 @@
     "Resend": "Opnieuw versturen",
     "Search GIFs": "Zoek GIF's",
     "Send a message": "Stuur een bericht",
-    "Something went wrong": "Er is iets fout gegaan",
+    "Sending links is not allowed in this conversation": "In dit gesprek is het niet toegestaan links te versturen",
+    "Slow mode ON": "Langzame modus aan",
     "The message has been reported to a moderator.": "Het bericht is gerapporteerd aan een moderator.",
-    "The operation couldn't be completed.": "De bewerking kan niet worden voltooid.",
     "Thread Reply": "Discussie beantwoorden",
     "Unblock User": "Deblokkeer gebruiker",
     "Unknown User": "Onbekende gebruiker",
     "Unmute User": "Dempen van gebruiker opheffen",
+    "Unpin from Conversation": "Losmaken van gesprek",
     "Unread Messages": "Ongelezen Berichten",
     "You": "U",
+    "You can't send messages in this channel": "Je kan geen berichten sturen in dit kanaal",
     "{{ firstUser }} and {{ nonSelfUserLength }} more are typing": "{{ firstUser }} en {{ nonSelfUserLength }} anderen zijn aan het typen",
     "{{ index }} of {{ photoLength }}": "{{ index }} van {{ photoLength }}",
     "{{ replyCount }} Replies": "{{ replyCount }} Antwoorden",

package/lib/typescript/i18n/ru.json

@@ -6,10 +6,10 @@
     "Are you sure you want to permanently delete this message?": "Вы действительно хотите удалить это сообщение без возможности восстановления?",
     "Block User": "Заблокировать пользователя",
     "Cancel": "Отмена",
+    "Cannot Flag Message": "Невозможно пожаловаться на сообщение",
     "Copy Message": "Копировать сообщение",
     "Delete": "удалять",
     "Delete Message": "Удалить сообщение",
-    "Dismiss": "Отклонить",
     "Do you want to send a copy of this message to a moderator for further investigation?": "Вы хотите отправить копию этого сообщения модератору для дальнейшего изучения?",
     "Edit Message": "Редактировать сообщение",
     "Editing Message": "Редактирование сообщения",
@@ -21,7 +21,9 @@
     "Error while loading, please reload/refresh": "Ошибка загрузки, пожалуйста перезагрузите или обновите",
     "Flag": "Пометить",
     "Flag Message": "Пометить сообщение",
+    "Flag action failed either due to a network issue or the message is already flagged": "Не удалось отправить жалобу. Возможные причины: проблема с подключением к интернету или ваша жалоба уже была принята.",
     "Instant Commands": "Мгновенные Команды",
+    "Links are disabled": "Ссылки отключены",
     "Loading channels...": "Загружаю каналы...",
     "Loading messages...": "Загружаю сообщения...",
     "Loading...": "Загружаю...",
@@ -30,9 +32,11 @@
     "Message flagged": "Сообщение отмечено",
     "Mute User": "Отключить пользователя",
     "Nothing yet...": "Пока ничего нет...",
+    "Ok": "Oк",
     "Only visible to you": "Видно только вам",
     "Photo": "Фото",
     "Photos": "Фото",
+    "Pin to Conversation": "Закрепить к беседе",
     "Please enable access to your photos and videos so you can share them.": "Разрешите доступ к своим фотографиям и видео, чтобы вы могли ими поделиться.",
     "Please select a channel first": "Пожалуйста, сначала выберите канал",
     "Reconnecting...": "Переподключение...",
@@ -41,15 +45,17 @@
     "Resend": "Отправить",
     "Search GIFs": "Поиск GIF",
     "Send a message": "Отправить сообщение",
-    "Something went wrong": "Что-то пошло не так",
+    "Sending links is not allowed in this conversation": "Отправка ссылок недоступна в этом чате",
+    "Slow mode ON": "Медленный режим включен",
     "The message has been reported to a moderator.": "Сообщение отправлено модератору.",
-    "The operation couldn't be completed.": "Операция не может быть завершена.",
     "Thread Reply": "Тема Ответить",
     "Unblock User": "Разблокировать пользователя",
     "Unknown User": "Неизвестный пользователь",
     "Unmute User": "Включить микрофон",
+    "Unpin from Conversation": "Открепить от беседы",
     "Unread Messages": "Непрочитанные Сообщения",
     "You": "Вы",
+    "You can't send messages in this channel": "Вы не можете отправлять сообщения в этот канал",
     "{{ firstUser }} and {{ nonSelfUserLength }} more are typing": "{{ firstUser }} и еще {{ nonSelfUserLength }} пишут",
     "{{ index }} of {{ photoLength }}": "{{ index }} из {{ photoLength }}",
     "{{ replyCount }} Replies": "{{ replyCount }} Ответов",

package/lib/typescript/i18n/tr.json

@@ -6,10 +6,10 @@
     "Are you sure you want to permanently delete this message?": "Bu mesajı kalıcı olarak silmek istediğinizden emin misiniz?",
     "Block User": "Kullanıcıyı engelle",
     "Cancel": "İptal",
+    "Cannot Flag Message": "Raporlama Başarısız",
     "Copy Message": "Mesajı Kopyala",
     "Delete": "Sil",
     "Delete Message": "Mesajı Sil",
-    "Dismiss": "Reddet",
     "Do you want to send a copy of this message to a moderator for further investigation?": "Daha fazla araştırma için bu mesajın bir kopyasını bir moderatöre göndermek istiyor musunuz?",
     "Edit Message": "Mesajı Düzenle",
     "Editing Message": "Mesaj Düzenleniyor",
@@ -19,9 +19,11 @@
     "Error loading channel list...": "Kanal listesi yüklenirken hata oluştu...",
     "Error loading messages for this channel...": "Bu kanal için mesajlar yüklenirken hata oluştu...",
     "Error while loading, please reload/refresh": "Yüklenirken hata oluştu, lütfen tekrar deneyin",
-    "Flag": "Bayrak çekmek",
+    "Flag": "Raporla",
     "Flag Message": "Mesajı İşaretle",
+    "Flag action failed either due to a network issue or the message is already flagged": "Raporlama, mesajın raporlanmış olması veya bağlantı hatası sebebiyle başarısız oldu.",
     "Instant Commands": "Anında Komutlar",
+    "Links are disabled": "Bağlantılar devre dışı",
     "Loading channels...": "Kanallar yükleniyor...",
     "Loading messages...": "Mesajlar yükleniyor...",
     "Loading...": "Yükleniyor...",
@@ -30,9 +32,11 @@
     "Message flagged": "Mesaj işaretlendi",
     "Mute User": "Kullanıcının Sesini Kapat",
     "Nothing yet...": "Şimdilik hiçbir şey...",
+    "Ok": "Tamam",
     "Only visible to you": "Sadece siz görebilirsiniz",
     "Photo": "Fotoğraf",
     "Photos": "Fotoğraflar",
+    "Pin to Conversation": "Konuşmaya sabitle",
     "Please enable access to your photos and videos so you can share them.": "Lütfen paylaşabilmek için fotoğraflarınıza ve videolarınıza erişimi etkinleştirin.",
     "Please select a channel first": "Lütfen önce bir kanal seçin",
     "Reconnecting...": "Yeniden Bağlanma...",
@@ -41,15 +45,17 @@
     "Resend": "Yeniden gönder",
     "Search GIFs": "GIF ara",
     "Send a message": "Bir mesaj göndermek",
-    "Something went wrong": "Bir şeyler yanlış gitti",
+    "Sending links is not allowed in this conversation": "Bağlantı göndermek bu konuşmada desteklenmiyor",
+    "Slow mode ON": "Yavaş Mod Açık",
     "The message has been reported to a moderator.": "Mesaj bir moderatöre bildirildi.",
-    "The operation couldn't be completed.": "İşlem tamamlanamadı.",
     "Thread Reply": "Konu Yanıtı",
     "Unblock User": "Kullanıcının engelini kaldır",
     "Unknown User": "Bilinmeyen kullanıcı",
     "Unmute User": "Kullanıcının sesini aç",
+    "Unpin from Conversation": "Sabitlenmeyi kaldır",
     "Unread Messages": "Okunmamış Mesajlar",
     "You": "Sen",
+    "You can't send messages in this channel": "Bu konuşmaya mesaj gönderemezsiniz",
     "{{ firstUser }} and {{ nonSelfUserLength }} more are typing": "{{ firstUser }} ve {{ nonSelfUserLength }} kişi daha yazıyor",
     "{{ index }} of {{ photoLength }}": "{{ index }} / {{ photoLength }}",
     "{{ replyCount }} Replies": "{{ replyCount }} Cevaplar",

package/lib/typescript/icons/{Left.d.ts → Pin.d.ts}

@@ -1,3 +1,3 @@
 import React from 'react';
 import { IconProps } from './utils/base';
-export declare const Left: React.FC<IconProps>;
+export declare const Pin: React.FC<IconProps>;

package/lib/typescript/icons/PinHeader.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './utils/base';
+export declare const PinHeader: React.FC<IconProps>;

package/lib/typescript/icons/{Right.d.ts → Unpin.d.ts}

@@ -1,3 +1,3 @@
 import React from 'react';
 import { IconProps } from './utils/base';
-export declare const Right: React.FC<IconProps>;
+export declare const Unpin: React.FC<IconProps>;

package/lib/typescript/icons/index.d.ts

@@ -29,7 +29,6 @@ export * from './Grid';
 export * from './Group';
 export * from './HTML';
 export * from './Imgur';
-export * from './Left';
 export * from './Lightning';
 export * from './Link';
 export * from './Loading';
@@ -47,11 +46,12 @@ export * from './Notification';
 export * from './ODT';
 export * from './PDF';
 export * from './Picture';
+export * from './Pin';
+export * from './PinHeader';
 export * from './PPT';
 export * from './PPTX';
 export * from './RAR';
 export * from './Refresh';
-export * from './Right';
 export * from './RTF';
 export * from './Search';
 export * from './SendRight';
@@ -68,6 +68,7 @@ export * from './ThumbsUpReaction';
 export * from './Time';
 export * from './TXT';
 export * from './Unknown';
+export * from './Unpin';
 export * from './User';
 export * from './UserAdd';
 export * from './UserDelete';

package/lib/typescript/native.d.ts

@@ -1,12 +1,5 @@
-/// <reference types="react" />
-import { FlatList as DefaultFlatList, StyleProp, ViewStyle } from 'react-native';
+import { FlatList as DefaultFlatList } from 'react-native';
 import type { NetInfoSubscription } from '@react-native-community/netinfo';
-declare type BlurView = React.ComponentType<{
-    blurAmount?: number;
-    blurType?: string;
-    style?: StyleProp<ViewStyle>;
-}>;
-export declare let BlurView: BlurView;
 declare type CompressImage = ({ compressImageQuality, height, uri, width, }: {
     compressImageQuality: number;
     height: number;
@@ -83,7 +76,6 @@ declare type TriggerHaptic = (method: HapticFeedbackMethod) => void | never;
 export declare let triggerHaptic: TriggerHaptic;
 export declare let SDK: string;
 declare type Handlers = {
-    BlurView?: BlurView;
     compressImage?: CompressImage;
     deleteFile?: DeleteFile;
     FlatList?: typeof DefaultFlatList;

package/lib/typescript/utils/Streami18n.d.ts

@@ -1,5 +1,7 @@
 import Dayjs from 'dayjs';
 import { FallbackLng, TFunction } from 'i18next';
+import type moment from 'moment';
+import type { TDateTimeParser } from '../contexts/translationContext/TranslationContext';
 import enTranslations from '../i18n/en.json';
 import 'dayjs/locale/fr';
 import 'dayjs/locale/hi';
@@ -15,8 +17,6 @@ import 'dayjs/locale/tr';
  * sure we don't mess up languages in other places in the app.
  */
 import 'dayjs/locale/en';
-import type moment from 'moment';
-import type { TDateTimeParser } from '../contexts/translationContext/TranslationContext';
 import type { UnknownType } from '../types/types';
 declare type Options = {
     DateTimeParser?: typeof Dayjs | typeof moment;
@@ -118,10 +118,10 @@ export declare class Streami18n {
                 "Are you sure you want to permanently delete this message?": string;
                 "Block User": string;
                 Cancel: string;
+                "Cannot Flag Message": string;
                 "Copy Message": string;
                 Delete: string;
                 "Delete Message": string;
-                Dismiss: string;
                 "Do you want to send a copy of this message to a moderator for further investigation?": string;
                 "Edit Message": string;
                 "Editing Message": string;
@@ -133,7 +133,9 @@ export declare class Streami18n {
                 "Error while loading, please reload/refresh": string;
                 Flag: string;
                 "Flag Message": string;
+                "Flag action failed either due to a network issue or the message is already flagged": string;
                 "Instant Commands": string;
+                "Links are disabled": string;
                 "Loading channels...": string;
                 "Loading messages...": string;
                 "Loading...": string;
@@ -142,9 +144,11 @@ export declare class Streami18n {
                 "Message flagged": string;
                 "Mute User": string;
                 "Nothing yet...": string;
+                Ok: string;
                 "Only visible to you": string;
                 Photo: string;
                 Photos: string;
+                "Pin to Conversation": string;
                 "Please enable access to your photos and videos so you can share them.": string;
                 "Please select a channel first": string;
                 "Reconnecting...": string;
@@ -153,18 +157,17 @@ export declare class Streami18n {
                 Resend: string;
                 "Search GIFs": string;
                 "Send a message": string;
-                "Something went wrong": string;
+                "Sending links is not allowed in this conversation": string;
+                "Slow mode ON": string;
                 "The message has been reported to a moderator.": string;
-                "The operation couldn't be completed.": string; /**
-                 * Hindi notation for meridiems are quite fuzzy in practice. While there exists
-                 * a rigid notion of a 'Pahar' it is not used as rigidly in modern Hindi.
-                 */
                 "Thread Reply": string;
                 "Unblock User": string;
                 "Unknown User": string;
                 "Unmute User": string;
+                "Unpin from Conversation": string;
                 "Unread Messages": string;
                 You: string;
+                "You can't send messages in this channel": string;
                 "{{ firstUser }} and {{ nonSelfUserLength }} more are typing": string;
                 "{{ index }} of {{ photoLength }}": string;
                 "{{ replyCount }} Replies": string;

package/lib/typescript/utils/date.d.ts

@@ -0,0 +1,2 @@
+export declare const ONE_SECOND_IN_MS = 1000;
+export declare const secondsUntil: (date: Date) => number;

package/lib/typescript/utils/getResizedImageUrl.d.ts

@@ -0,0 +1,19 @@
+declare type GetResizedImageUrlParams = {
+    url: string;
+    height?: string | number;
+    width?: string | number;
+};
+/**
+ * Any file or image upload done through stream's chat SDK or components get uploaded
+ * to CloudFront CDN. Following function returns a url of resized image (to given width and height).
+ * It can be used to avoid rendering heavy images on UI, for the sake of performance.
+ *
+ * This function accepts an object with following properties:
+ * - height: height of the resized image.
+ * - url: url of the image.
+ * - width: width of the resized image.
+ *
+ * @returns {string} Url of the image with given height and width.
+ */
+export declare function getResizedImageUrl({ height, url, width }: GetResizedImageUrlParams): string;
+export {};

package/lib/typescript/utils/getUrlOfImageAttachment.d.ts

@@ -0,0 +1,7 @@
+import type { Attachment } from 'stream-chat';
+/**
+ * Extract url of image from image attachment.
+ * @param image Image attachment
+ * @returns {string}
+ */
+export declare function getUrlOfImageAttachment(image: Attachment): string | undefined;

package/lib/typescript/utils/utils.d.ts

@@ -1,12 +1,9 @@
-import { Emoji } from '../emoji-data/compiled';
 import type React from 'react';
 import type { DebouncedFunc } from 'lodash';
-import type { Channel, StreamChat } from 'stream-chat';
-import type { CommandsItemProps } from '../components/AutoCompleteInput/CommandsItem';
-import type { EmojisItemProps } from '../components/AutoCompleteInput/EmojisItem';
-import type { MentionsItemProps } from '../components/AutoCompleteInput/MentionsItem';
+import type { Channel, CommandResponse, StreamChat } from 'stream-chat';
 import type { MentionAllAppUsersQuery } from '../contexts/messageInputContext/MessageInputContext';
-import type { SuggestionCommand, SuggestionUser } from '../contexts/suggestionsContext/SuggestionsContext';
+import type { SuggestionCommand, SuggestionComponentType, SuggestionUser } from '../contexts/suggestionsContext/SuggestionsContext';
+import { Emoji } from '../emoji-data/compiled';
 import type { IconProps } from '../icons/utils/base';
 import type { DefaultAttachmentType, DefaultChannelType, DefaultCommandType, DefaultEventType, DefaultMessageType, DefaultReactionType, DefaultUserType, UnknownType } from '../types/types';
 export declare type ReactionData = {
@@ -24,6 +21,11 @@ export declare const ProgressIndicatorTypes: {
     IN_PROGRESS: 'in_progress';
     RETRY: 'retry';
 };
+export declare const MessageStatusTypes: {
+    FAILED: string;
+    RECEIVED: string;
+    SENDING: string;
+};
 export declare const queryMembersDebounced: DebouncedFunc<(<At extends UnknownType = DefaultAttachmentType, Ch extends UnknownType = DefaultChannelType, Co extends string = import("stream-chat").LiteralStringForUnion, Ev extends UnknownType = UnknownType, Me extends UnknownType = UnknownType, Re extends UnknownType = UnknownType, Us extends UnknownType = DefaultUserType>(channel: Channel<At, Ch, Co, Ev, Me, Re, Us>, query: SuggestionUser<Us>["name"], onReady?: ((users: SuggestionUser<Us>[]) => void) | undefined, options?: {
     limit?: number;
 }) => Promise<void>)>;
@@ -37,28 +39,27 @@ export declare const isMentionTrigger: (trigger: Trigger) => trigger is "@";
 export declare type Trigger = '/' | '@' | ':';
 export declare type TriggerSettings<Co extends string = DefaultCommandType, Us extends UnknownType = DefaultUserType> = {
     '/'?: {
-        component: string | React.ComponentType<Partial<CommandsItemProps<Co>>>;
-        dataProvider: (query: SuggestionCommand<Co>['name'], text: string, onReady?: (data: SuggestionCommand<Co>[], q: SuggestionCommand<Co>['name']) => void, options?: {
+        dataProvider: (query: CommandResponse<Co>['name'], text: string, onReady?: (data: CommandResponse<Co>[], q: CommandResponse<Co>['name']) => void, options?: {
             limit?: number;
         }) => SuggestionCommand<Co>[];
-        output: (entity: SuggestionCommand<Co>) => {
+        output: (entity: CommandResponse<Co>) => {
             caretPosition: string;
             key: string;
             text: string;
         };
+        type: SuggestionComponentType;
     };
     ':'?: {
-        component: string | React.ComponentType<Partial<EmojisItemProps>>;
         dataProvider: (query: Emoji['name'], _: string, onReady?: (data: Emoji[], q: Emoji['name']) => void) => Emoji[];
         output: (entity: Emoji) => {
             caretPosition: string;
             key: string;
             text: string;
         };
+        type: SuggestionComponentType;
     };
     '@'?: {
         callback: (item: SuggestionUser<Us>) => void;
-        component: string | React.ComponentType<Partial<MentionsItemProps<Us>>>;
         dataProvider: (query: SuggestionUser<Us>['name'], _: string, onReady?: (data: SuggestionUser<Us>[], q: SuggestionUser<Us>['name']) => void, options?: {
             limit?: number;
             mentionAllAppUsersEnabled?: boolean;
@@ -69,6 +70,7 @@ export declare type TriggerSettings<Co extends string = DefaultCommandType, Us e
             key: string;
             text: string;
         };
+        type: SuggestionComponentType;
     };
 };
 export declare type ACITriggerSettingsParams<At extends UnknownType = DefaultAttachmentType, Ch extends UnknownType = DefaultChannelType, Co extends string = DefaultCommandType, Ev extends UnknownType = DefaultEventType, Me extends UnknownType = DefaultMessageType, Re extends UnknownType = DefaultReactionType, Us extends UnknownType = DefaultUserType> = {
@@ -101,3 +103,4 @@ export declare const vw: (percentageWidth: number, rounded?: boolean) => number;
 export declare const vh: (percentageHeight: number, rounded?: boolean) => number;
 export declare const generateRandomId: (a?: string) => string;
 export declare const emojiRegex: RegExp;
+export declare const urlRegex: RegExp;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-react-native-core",
   "description": "The official React Native and Expo components for Stream Chat, a service for building chat applications",
-  "version": "3.10.2",
+  "version": "4.0.0-beta.4",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
@@ -29,7 +29,7 @@
     "copy-translations": "echo '\u001b[34mℹ\u001b[0m Copying translation files to \u001b[34mlib/typescript/i18n\u001b[0m' && cp -R -f ./src/i18n ./lib/typescript/i18n && echo '\u001b[32m✓\u001b[0m Done Copying Translations'",
     "docs": "styleguidist build",
     "docs-server": "styleguidist server",
-    "eslint": "eslint '**/*.{js,md,ts,jsx,tsx}' --max-warnings 0",
+    "eslint": "eslint 'src/**/*.{js,md,ts,jsx,tsx}' --max-warnings 0",
     "lint": "prettier --ignore-path ../.prettierignore --list-different 'src/**/*.{js,ts,tsx,md,json}' .eslintrc.json ../.prettierrc .babelrc && eslint 'src/**/*.{js,ts,tsx,md}' --max-warnings 0 && yarn run validate-translations",
     "lint-fix": "prettier --ignore-path ../.prettierignore --write 'src/**/*.{js,ts,tsx,md,json}' .eslintrc.json ../.prettierrc .babelrc && eslint --fix 'src/**/*.{js,ts,tsx,md}' --max-warnings 0",
     "prepare": "yarn run build",
@@ -70,24 +70,19 @@
   },
   "dependencies": {
     "@babel/runtime": "7.13.10",
-    "@gorhom/bottom-sheet": "3.6.4",
-    "anchorme": "^1.1.2",
+    "@gorhom/bottom-sheet": "4.1.5",
     "dayjs": "1.10.5",
     "file-loader": "6.2.0",
     "i18next": "20.2.4",
     "lodash-es": "4.17.21",
     "metro-react-native-babel-preset": "0.66.0",
+    "mime-types": "^2.1.34",
     "path": "0.12.7",
     "react-art": "^17.0.2",
     "react-native-markdown-package": "1.8.1",
-    "stream-chat": "~3.13.1"
+    "stream-chat": "^5.1.2"
   },
   "peerDependencies": {
-    "react": "*",
-    "react-dom": "*",
-    "react-native": "*",
-    "react-native-gesture-handler": "^1.8.0",
-    "react-native-reanimated": "^2.0.0",
     "react-native-svg": "^12.1.0"
   },
   "devDependencies": {
@@ -110,17 +105,19 @@
     "@types/react": "17.0.5",
     "@types/react-native": "0.65.1",
     "@types/react-test-renderer": "17.0.1",
-    "@typescript-eslint/eslint-plugin": "4.24.0",
-    "@typescript-eslint/parser": "4.24.0",
+    "@typescript-eslint/eslint-plugin": "^5.7.0",
+    "@typescript-eslint/parser": "^5.7.0",
     "babel-eslint": "10.1.0",
     "babel-jest": "26.6.3",
     "babel-loader": "8.2.2",
     "babel-plugin-i18next-extract": "0.8.3",
     "babel-plugin-module-resolver": "4.1.0",
     "babel-plugin-react-native-web": "0.16.3",
-    "eslint": "7.26.0",
+    "eslint": "7.32.0",
     "eslint-config-prettier": "8.3.0",
+    "eslint-import-resolver-babel-module": "^5.3.1",
     "eslint-plugin-babel": "5.3.1",
+    "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-jest": "24.3.6",
     "eslint-plugin-markdown": "2.1.0",
     "eslint-plugin-prettier": "3.4.0",
@@ -135,6 +132,7 @@
     "react-dom": "17.0.2",
     "react-native": "0.64.1",
     "react-native-builder-bob": "0.18.1",
+    "react-native-fs": "2.18.0",
     "react-native-gesture-handler": "1.10.3",
     "react-native-reanimated": "2.1.0",
     "react-native-svg": "12.1.1",
@@ -142,7 +140,7 @@
     "react-native-web": "0.15.0",
     "react-styleguidist": "11.1.6",
     "react-test-renderer": "17.0.2",
-    "typescript": "4.2.4",
+    "typescript": "4.4.3",
     "uuid": "8.3.2",
     "webpack": "4.44.2"
   }

package/src/components/Attachment/Attachment.tsx

@@ -1,17 +1,17 @@
 import React from 'react';
 
+import type { Attachment as AttachmentType } from 'stream-chat';
+
 import { AttachmentActions as AttachmentActionsDefault } from '../../components/Attachment/AttachmentActions';
 import { Card as CardDefault } from '../../components/Attachment/Card';
+import { FileAttachment as FileAttachmentDefault } from '../../components/Attachment/FileAttachment';
 import { Gallery as GalleryDefault } from '../../components/Attachment/Gallery';
 import { Giphy as GiphyDefault } from '../../components/Attachment/Giphy';
-import { FileAttachment as FileAttachmentDefault } from '../../components/Attachment/FileAttachment';
 import {
   MessagesContextValue,
   useMessagesContext,
 } from '../../contexts/messagesContext/MessagesContext';
 
-import type { Attachment as AttachmentType } from 'stream-chat';
-
 import type {
   DefaultAttachmentType,
   DefaultChannelType,

package/src/components/Attachment/AttachmentActions.tsx

@@ -9,14 +9,14 @@ import {
   ViewStyle,
 } from 'react-native';
 
+import type { Attachment } from 'stream-chat';
+
 import {
   MessageContextValue,
   useMessageContext,
 } from '../../contexts/messageContext/MessageContext';
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
 
-import type { Attachment } from 'stream-chat';
-
 import type {
   DefaultAttachmentType,
   DefaultChannelType,

package/src/components/Attachment/Card.tsx

@@ -12,6 +12,8 @@ import {
   ViewStyle,
 } from 'react-native';
 
+import type { Attachment } from 'stream-chat';
+
 import {
   MessageContextValue,
   useMessageContext,
@@ -21,10 +23,6 @@ import {
   useMessagesContext,
 } from '../../contexts/messagesContext/MessagesContext';
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
-import { makeImageCompatibleUrl } from '../../utils/utils';
-
-import type { Attachment } from 'stream-chat';
-
 import type {
   DefaultAttachmentType,
   DefaultChannelType,
@@ -35,6 +33,7 @@ import type {
   DefaultUserType,
   UnknownType,
 } from '../../types/types';
+import { makeImageCompatibleUrl } from '../../utils/utils';
 
 const styles = StyleSheet.create({
   authorName: { fontSize: 14.5, fontWeight: '600' },
@@ -105,6 +104,8 @@ export type CardPropsWithContext<
     MessagesContextValue<At, Ch, Co, Ev, Me, Re, Us>,
     'additionalTouchableProps' | 'CardCover' | 'CardFooter' | 'CardHeader'
   > & {
+    channelId: string | undefined;
+    messageId: string | undefined;
     styles?: Partial<{
       authorName: StyleProp<TextStyle>;
       authorNameContainer: StyleProp<ViewStyle>;
@@ -318,7 +319,7 @@ export const Card = <
 >(
   props: CardProps<At, Ch, Co, Ev, Me, Re, Us>,
 ) => {
-  const { onLongPress, onPress, onPressIn, preventPress } =
+  const { message, onLongPress, onPress, onPressIn, preventPress } =
     useMessageContext<At, Ch, Co, Ev, Me, Re, Us>();
   const { additionalTouchableProps, CardCover, CardFooter, CardHeader } =
     useMessagesContext<At, Ch, Co, Ev, Me, Re, Us>();
@@ -330,6 +331,8 @@ export const Card = <
         CardCover,
         CardFooter,
         CardHeader,
+        channelId: message.cid,
+        messageId: message.id,
         onLongPress,
         onPress,
         onPressIn,

package/src/components/Attachment/FileAttachment.tsx

@@ -10,6 +10,8 @@ import {
   ViewStyle,
 } from 'react-native';
 
+import type { Attachment } from 'stream-chat';
+
 import { AttachmentActions as AttachmentActionsDefault } from '../../components/Attachment/AttachmentActions';
 import { FileIcon as FileIconDefault } from '../../components/Attachment/FileIcon';
 import {
@@ -21,10 +23,6 @@ import {
   useMessagesContext,
 } from '../../contexts/messagesContext/MessagesContext';
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
-import { vw } from '../../utils/utils';
-
-import type { Attachment } from 'stream-chat';
-
 import type {
   DefaultAttachmentType,
   DefaultChannelType,
@@ -35,6 +33,7 @@ import type {
   DefaultUserType,
   UnknownType,
 } from '../../types/types';
+import { vw } from '../../utils/utils';
 
 const styles = StyleSheet.create({
   container: {

package/src/components/Attachment/FileIcon.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { useTheme } from '../../contexts/themeContext/ThemeContext';
 
 import { Audio } from '../../icons/Audio';
@@ -17,12 +18,11 @@ import { RTF } from '../../icons/RTF';
 import { SEVEN_Z } from '../../icons/SEVEN_Z';
 import { TAR } from '../../icons/TAR';
 import { TXT } from '../../icons/TXT';
+import type { IconProps } from '../../icons/utils/base';
 import { XLS } from '../../icons/XLS';
 import { XLSX } from '../../icons/XLSX';
 import { ZIP } from '../../icons/ZIP';
 
-import type { IconProps } from '../../icons/utils/base';
-
 // https://www.iana.org/assignments/media-types/media-types.xhtml#audio
 const audioFileTypes = [
   'audio/1d-interleaved-parityfec',