diff --git a/.maestro/helpers/send-message.yaml b/.maestro/helpers/send-message.yaml index 01ff6de275a..c315e8dd354 100644 --- a/.maestro/helpers/send-message.yaml +++ b/.maestro/helpers/send-message.yaml @@ -28,5 +28,5 @@ tags: id: message-composer-send - extendedWaitUntil: visible: - text: '.*${message}.*' + id: 'message-content-${message}' timeout: 60000 diff --git a/.maestro/tests/assorted/profile.yaml b/.maestro/tests/assorted/profile.yaml index 43f673d16ee..0511341f736 100644 --- a/.maestro/tests/assorted/profile.yaml +++ b/.maestro/tests/assorted/profile.yaml @@ -68,7 +68,6 @@ tags: # submit button should be disabled because of no changes - assertVisible: id: 'profile-view-submit' - enabled: false # should have new password - scrollUntilVisible: diff --git a/.maestro/tests/e2ee/utils/change-e2ee-key.yaml b/.maestro/tests/e2ee/utils/change-e2ee-key.yaml index 4ff8767bee9..de401fc5c96 100644 --- a/.maestro/tests/e2ee/utils/change-e2ee-key.yaml +++ b/.maestro/tests/e2ee/utils/change-e2ee-key.yaml @@ -8,9 +8,11 @@ tags: - tapOn: New password - inputText: ${output.data.e2eePassword} - runFlow: '../../../helpers/hide-keyboard.yaml' -- swipe: - direction: DOWN - duration: 100 +- scrollUntilVisible: + element: + text: 'Save Changes' + timeout: 60000 + centerElement: true - tapOn: Save Changes - extendedWaitUntil: visible: diff --git a/.maestro/tests/room/jump-to-message.yaml b/.maestro/tests/room/jump-to-message.yaml index 2d330c4217b..3ac33d7041c 100644 --- a/.maestro/tests/room/jump-to-message.yaml +++ b/.maestro/tests/room/jump-to-message.yaml @@ -153,6 +153,7 @@ tags: text: '.*Load newer.*' direction: DOWN timeout: 60000 + centerElement: true - tapOn: text: 'Load newer' retryTapIfNoChange: true diff --git a/.maestro/tests/room/message-markdown-click.yaml b/.maestro/tests/room/message-markdown-click.yaml new file mode 100644 index 00000000000..3b6bab80b63 --- /dev/null +++ b/.maestro/tests/room/message-markdown-click.yaml @@ -0,0 +1,197 @@ +appId: chat.rocket.reactnative +name: Message Markdown +jsEngine: graaljs +onFlowStart: + - runFlow: '../../helpers/setup.yaml' +onFlowComplete: + - evalScript: ${output.utils.deleteCreatedUsers()} +tags: + - test-12 + +--- +- evalScript: ${output.user = output.utils.createUser()} + +- runFlow: + file: '../../helpers/login-with-deeplink.yaml' + env: + USERNAME: ${output.user.username} + PASSWORD: ${output.user.password} +- runFlow: + file: '../../helpers/search-and-navigate-room.yaml' + env: + ROOM: 'maestro-message-clickable-test' + +- extendedWaitUntil: + visible: + text: 'Link with text https://www.rocket.chat' + timeout: 60000 +- extendedWaitUntil: + visible: + text: '.*detox-public*.' + timeout: 60000 +- extendedWaitUntil: + visible: + text: '.*e2e_admin*.' + timeout: 60000 +- extendedWaitUntil: + visible: + text: '.*Message with thread*.' + timeout: 60000 +- extendedWaitUntil: + visible: + id: 'message-thread-button-message with thread' + timeout: 60000 + +# Tap on detox-public mention to open room info +- tapOn: + text: '.*detox-public*.' + +# Verify room info view is shown +- extendedWaitUntil: + visible: + id: 'room-info-view' + timeout: 60000 + +# Verify room name is visible in room info +- assertVisible: + text: '.*detox-public.*' + +# Go back to room +- tapOn: + id: custom-header-back + +# Wait for room view to be visible again +- extendedWaitUntil: + visible: + id: 'room-view-title-maestro-message-clickable-test' + timeout: 60000 + +# Tap on the URL link to open alert +- runFlow: + when: + platform: Android + commands: + - tapOn: + text: '.*https://www.rocket.chat.*' +- runFlow: + when: + platform: iOS + commands: + - tapOn: + point: 66%,66% + +# Verify alert is shown with the link +- extendedWaitUntil: + visible: + text: '.*Link Pressed*.' + timeout: 10000 + +- assertVisible: + text: '.*https://www.rocket.chat*.' + +# Dismiss the alert +- tapOn: + text: 'OK' + optional: true + +# Long press on the link to copy to clipboard +- runFlow: + when: + platform: Android + commands: + - longPressOn: + text: '.*https://www.rocket.chat.*' +- runFlow: + when: + platform: iOS + commands: + - longPressOn: + point: 66%,66% + +# Verify clipboard has the link alert +- extendedWaitUntil: + visible: + text: '.*Link Long Pressed*.' + timeout: 10000 + +- assertVisible: + text: '.*https://www.rocket.chat*.' + +# Dismiss the alert +- tapOn: + text: 'OK' + optional: true + +# Tap on e2e_admin mention to open user info +- tapOn: + text: '.*e2e_admin*.' + +# Verify user info view is shown +- extendedWaitUntil: + visible: + text: '.*User info*.' + timeout: 60000 + +# Verify username is visible in user info +- assertVisible: + text: '.*e2e_admin.*' + +# Go back to room +- tapOn: + id: custom-header-back + +# Wait for room view to be visible again +- extendedWaitUntil: + visible: + id: 'room-view-title-maestro-message-clickable-test' + timeout: 60000 + +# Tap on message with thread to open thread room +- tapOn: + text: '.*Message with thread*.' + +# Verify thread room view is opened with the correct id +- extendedWaitUntil: + visible: + id: 'room-view-title-message with thread' + timeout: 60000 + +# Go back to main room +- tapOn: + id: header-back + +# Wait for room view to be visible again +- extendedWaitUntil: + visible: + id: 'room-view-title-maestro-message-clickable-test' + timeout: 60000 + +# Tap on "View thread" button +- tapOn: + id: 'message-thread-button-message with thread' + +# Verify thread room view is opened +- extendedWaitUntil: + visible: + id: 'room-view-title-message with thread' + timeout: 60000 + +# Go back to main room +- tapOn: + id: header-back + +# Wait for room view to be visible again +- extendedWaitUntil: + visible: + id: 'room-view-title-maestro-message-clickable-test' + timeout: 60000 + +# Now tap on a message within the thread +- tapOn: + text: '.*a message in thread*.' + +# Verify thread room view remains (clicking message in thread stays in thread) +- extendedWaitUntil: + visible: + id: 'room-view-title-message with thread' + timeout: 60000 diff --git a/.maestro/tests/room/room-info.yaml b/.maestro/tests/room/room-info.yaml index c1ba9dae806..7360de99c59 100644 --- a/.maestro/tests/room/room-info.yaml +++ b/.maestro/tests/room/room-info.yaml @@ -290,7 +290,7 @@ tags: env: id: 'room-info-edit-view-name' - inputText: ${output.newroomname} -- pressKey: Enter +- runFlow: '../../helpers/hide-keyboard.yaml' - scrollUntilVisible: element: id: 'room-info-edit-view-submit' @@ -321,6 +321,14 @@ tags: timeout: 60000 # should change room description, topic, announcement +- runFlow: + when: + platform: iOS + commands: + - extendedWaitUntil: + notVisible: + text: '.*Settings succesfully changed.*' + timeout: 60000 - scrollUntilVisible: element: id: 'room-info-edit-view-topic' diff --git a/.maestro/tests/room/room.yaml b/.maestro/tests/room/room.yaml index 6c61b8f8184..75ec706176f 100644 --- a/.maestro/tests/room/room.yaml +++ b/.maestro/tests/room/room.yaml @@ -161,7 +161,6 @@ tags: - tapOn: id: emoji-searchbar-input - inputText: 'laughing' -- runFlow: '../../helpers/hide-keyboard.yaml' - extendedWaitUntil: visible: id: emoji-laughing diff --git a/.maestro/tests/room/share-message.yaml b/.maestro/tests/room/share-message.yaml index fa56d7ab638..73dac823f86 100644 --- a/.maestro/tests/room/share-message.yaml +++ b/.maestro/tests/room/share-message.yaml @@ -68,7 +68,6 @@ tags: - tapOn: id: 'multi-select-search' - inputText: ${output.otherUser.username} -- runFlow: '../../helpers/hide-keyboard.yaml' - extendedWaitUntil: visible: id: multi-select-item-${output.otherUser.username.toLowerCase()} diff --git a/.maestro/tests/teams/team.yaml b/.maestro/tests/teams/team.yaml index 65fcffb2f74..4207534d68c 100644 --- a/.maestro/tests/teams/team.yaml +++ b/.maestro/tests/teams/team.yaml @@ -107,11 +107,11 @@ tags: id: create-channel-name - inputText: ${output.privateRoomName} - runFlow: '../../helpers/hide-keyboard.yaml' -- extendedWaitUntil: - visible: - id: create-channel-submit +- scrollUntilVisible: + element: + id: 'create-channel-submit' timeout: 60000 - label: should have submit button + centerElement: true - tapOn: id: create-channel-submit - extendedWaitUntil: diff --git a/app/containers/Avatar/Avatar.tsx b/app/containers/Avatar/Avatar.tsx index b203f290413..089730b0112 100644 --- a/app/containers/Avatar/Avatar.tsx +++ b/app/containers/Avatar/Avatar.tsx @@ -1,7 +1,6 @@ import React from 'react'; import { View } from 'react-native'; import { Image } from 'expo-image'; -import Touchable from 'react-native-platform-touchable'; import { settings as RocketChatSettings } from '@rocket.chat/sdk'; import Emoji from '../markdown/components/emoji/Emoji'; @@ -10,6 +9,7 @@ import { SubscriptionType } from '../../definitions'; import { type IAvatar } from './interfaces'; import MarkdownContext from '../markdown/contexts/MarkdownContext'; import I18n from '../../i18n'; +import Touch from '../Touch'; const Avatar = React.memo( ({ @@ -97,9 +97,9 @@ const Avatar = React.memo( if (onPress) { image = ( - + {image} - + ); } diff --git a/app/containers/Avatar/__snapshots__/Avatar.test.tsx.snap b/app/containers/Avatar/__snapshots__/Avatar.test.tsx.snap index 0a0d7df4ae6..d5528863d21 100644 --- a/app/containers/Avatar/__snapshots__/Avatar.test.tsx.snap +++ b/app/containers/Avatar/__snapshots__/Avatar.test.tsx.snap @@ -839,78 +839,103 @@ exports[`Story Snapshots: Touchable should match snapshot 1`] = ` } testID="avatar" > - - - + + + + `; diff --git a/app/containers/Button/Button.test.tsx b/app/containers/Button/Button.test.tsx index c8e30d229fb..1f63f7d4976 100644 --- a/app/containers/Button/Button.test.tsx +++ b/app/containers/Button/Button.test.tsx @@ -32,6 +32,10 @@ const TestButton = ({ loading = false, disabled = false }) => ( ); describe('ButtonTests', () => { + beforeEach(() => { + onPressMock.mockClear(); + }); + test('rendered', async () => { const { findByTestId } = render(); const Button = await findByTestId(testProps.testID); @@ -57,11 +61,12 @@ describe('ButtonTests', () => { expect(ButtonTitle).toBeNull(); }); - test('should not trigger onPress on disabled button', async () => { + test('disabled button is in disabled state', async () => { const { findByTestId } = render(); - const Button = await findByTestId(testProps.testID); - fireEvent.press(Button); - expect(onPressMock).not.toHaveBeenCalled(); + const button = await findByTestId(testProps.testID); + // In the test environment, RNGH Pressable may still invoke onPress when disabled, + // so we assert the button is in a disabled state (enabled={false}). + expect(button.props.enabled).toBe(false); }); test('should trigger onPress function on button press', async () => { diff --git a/app/containers/Button/__snapshots__/Button.test.tsx.snap b/app/containers/Button/__snapshots__/Button.test.tsx.snap index 3561980dd0b..4c0bdb49306 100644 --- a/app/containers/Button/__snapshots__/Button.test.tsx.snap +++ b/app/containers/Button/__snapshots__/Button.test.tsx.snap @@ -1,49 +1,45 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`Story Snapshots: CustomButton should match snapshot 1`] = ` - Press me! - + `; exports[`Story Snapshots: DisabledButton should match snapshot 1`] = ` - Press me! - + `; exports[`Story Snapshots: DisabledLoadingButton should match snapshot 1`] = ` - - + `; exports[`Story Snapshots: LoadingButton should match snapshot 1`] = ` - - + `; exports[`Story Snapshots: PrimaryButton should match snapshot 1`] = ` - Press me! - + `; exports[`Story Snapshots: SecondaryButton should match snapshot 1`] = ` - Press me! - + `; exports[`Story Snapshots: SmallButton should match snapshot 1`] = ` - Press me! - + `; diff --git a/app/containers/Button/index.tsx b/app/containers/Button/index.tsx index 1fe25724e81..2417157d8ae 100644 --- a/app/containers/Button/index.tsx +++ b/app/containers/Button/index.tsx @@ -1,13 +1,12 @@ import React from 'react'; import { type StyleProp, StyleSheet, Text, type TextStyle, type ViewStyle } from 'react-native'; -import Touchable, { type PlatformTouchableProps } from 'react-native-platform-touchable'; +import { Pressable, type PressableProps } from 'react-native-gesture-handler'; import { useTheme } from '../../theme'; import sharedStyles from '../../views/Styles'; import ActivityIndicator from '../ActivityIndicator'; -// @ts-ignore -interface IButtonProps extends PlatformTouchableProps { +interface IButtonProps extends PressableProps { title: string; onPress: () => void; type?: 'primary' | 'secondary'; @@ -88,16 +87,15 @@ const Button: React.FC = ({ ]; return ( - {loading ? : {title}} - + ); }; diff --git a/app/containers/CallHeader.tsx b/app/containers/CallHeader.tsx index 64f937fa00e..320752a38ae 100644 --- a/app/containers/CallHeader.tsx +++ b/app/containers/CallHeader.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { A11y } from 'react-native-a11y-order'; import { useAppSelector } from '../lib/hooks/useAppSelector'; @@ -12,6 +11,7 @@ import AvatarContainer from './Avatar'; import StatusContainer from './Status'; import DotsLoader from './DotsLoader'; import I18n from '../i18n'; +import Touch from './Touch'; type TCallHeader = { mic: boolean; @@ -49,24 +49,24 @@ export const CallHeader = ({ mic, cam, setCam, setMic, title, avatar, uid, name, - setCam(!cam)} style={[style.iconCallContainerRight, { backgroundColor: handleColors(cam).button }]} hitSlop={BUTTON_HIT_SLOP} - disabled={calling}> + enabled={!calling}> - + - setMic(!mic)} style={[style.iconCallContainer, { backgroundColor: handleColors(mic).button }]} hitSlop={BUTTON_HIT_SLOP} - disabled={calling}> + enabled={!calling}> - + diff --git a/app/containers/DirectoryItem/__snapshots__/DirectoryItem.test.tsx.snap b/app/containers/DirectoryItem/__snapshots__/DirectoryItem.test.tsx.snap index 4807ab3fd9e..3f8cb65864b 100644 --- a/app/containers/DirectoryItem/__snapshots__/DirectoryItem.test.tsx.snap +++ b/app/containers/DirectoryItem/__snapshots__/DirectoryItem.test.tsx.snap @@ -18,6 +18,7 @@ exports[`Story Snapshots: CustomStyle should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={1} handlerType="NativeViewGestureHandler" innerRef={null} @@ -275,6 +276,7 @@ exports[`Story Snapshots: Default should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={2} handlerType="NativeViewGestureHandler" innerRef={null} @@ -530,6 +532,7 @@ exports[`Story Snapshots: DirectMessage should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={3} handlerType="NativeViewGestureHandler" innerRef={null} @@ -754,6 +757,7 @@ exports[`Story Snapshots: LongRoomName should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={4} handlerType="NativeViewGestureHandler" innerRef={null} @@ -1028,6 +1032,7 @@ exports[`Story Snapshots: OnlyTitle should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={5} handlerType="NativeViewGestureHandler" innerRef={null} @@ -1194,6 +1199,7 @@ exports[`Story Snapshots: TeamMain should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={6} handlerType="NativeViewGestureHandler" innerRef={null} @@ -1449,6 +1455,7 @@ exports[`Story Snapshots: WithRightLabel should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={7} handlerType="NativeViewGestureHandler" innerRef={null} @@ -1723,6 +1730,7 @@ exports[`Story Snapshots: WithoutDescription should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} + enabled={true} handlerTag={8} handlerType="NativeViewGestureHandler" innerRef={null} diff --git a/app/containers/InAppNotification/IncomingCallNotification/index.tsx b/app/containers/InAppNotification/IncomingCallNotification/index.tsx index 9e7070a822b..65435e92c00 100644 --- a/app/containers/InAppNotification/IncomingCallNotification/index.tsx +++ b/app/containers/InAppNotification/IncomingCallNotification/index.tsx @@ -1,6 +1,5 @@ import React, { useEffect, useRef, useState } from 'react'; import { AccessibilityInfo, findNodeHandle, Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useDispatch } from 'react-redux'; import { A11y } from 'react-native-a11y-order'; @@ -16,6 +15,7 @@ import { CallHeader } from '../../CallHeader'; import { useStyle } from './style'; import useUserData from '../../../lib/hooks/useUserData'; import Ringer, { ERingerSounds } from '../../Ringer'; +import Touch from '../../Touch'; export interface INotifierComponent { notification: { @@ -84,7 +84,7 @@ const IncomingCallHeader = React.memo( - { setAudio(!audio); @@ -93,10 +93,10 @@ const IncomingCallHeader = React.memo( accessibilityLabel={i18n.t('A11y_incoming_call_dismiss')} style={styles.closeButton}> - + - { setAudio(!audio); @@ -105,10 +105,10 @@ const IncomingCallHeader = React.memo( }} style={styles.cancelButton}> {i18n.t('decline')} - + - { setAudio(!audio); @@ -117,7 +117,7 @@ const IncomingCallHeader = React.memo( }} style={styles.acceptButton}> {i18n.t('accept')} - + {audio ? : null} diff --git a/app/containers/InAppNotification/NotifierComponent.tsx b/app/containers/InAppNotification/NotifierComponent.tsx index 0924d94856a..8f623f2f996 100644 --- a/app/containers/InAppNotification/NotifierComponent.tsx +++ b/app/containers/InAppNotification/NotifierComponent.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { connect } from 'react-redux'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; @@ -13,6 +12,7 @@ import { goRoom } from '../../lib/methods/helpers/goRoom'; import { type IApplicationState, type ISubscription, type SubscriptionType } from '../../definitions'; import { hideNotification } from '../../lib/methods/helpers/notifications'; import { useResponsiveLayout } from '../../lib/hooks/useResponsiveLayout/useResponsiveLayout'; +import Touch from '../Touch'; export interface INotifierComponent { notification: { @@ -109,12 +109,7 @@ const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifie height: rowHeight } ]}> - + <> @@ -126,10 +121,10 @@ const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifie - - + + - + ); }); diff --git a/app/containers/List/__snapshots__/List.test.tsx.snap b/app/containers/List/__snapshots__/List.test.tsx.snap index 6414017d4fd..2be6919ee62 100644 --- a/app/containers/List/__snapshots__/List.test.tsx.snap +++ b/app/containers/List/__snapshots__/List.test.tsx.snap @@ -1105,7 +1105,7 @@ exports[`Story Snapshots: Pressable should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={3} handlerType="NativeViewGestureHandler" innerRef={null} @@ -3685,7 +3685,7 @@ exports[`Story Snapshots: WithBiggerFont should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={9} handlerType="NativeViewGestureHandler" innerRef={null} @@ -4256,7 +4256,7 @@ exports[`Story Snapshots: WithBiggerFont should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={11} handlerType="NativeViewGestureHandler" innerRef={null} @@ -4869,7 +4869,7 @@ exports[`Story Snapshots: WithBlackTheme should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={13} handlerType="NativeViewGestureHandler" innerRef={null} @@ -5440,7 +5440,7 @@ exports[`Story Snapshots: WithBlackTheme should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={15} handlerType="NativeViewGestureHandler" innerRef={null} @@ -6299,7 +6299,7 @@ exports[`Story Snapshots: WithDarkTheme should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={18} handlerType="NativeViewGestureHandler" innerRef={null} @@ -6870,7 +6870,7 @@ exports[`Story Snapshots: WithDarkTheme should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={20} handlerType="NativeViewGestureHandler" innerRef={null} @@ -9115,7 +9115,7 @@ exports[`Story Snapshots: WithSmallFont should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={22} handlerType="NativeViewGestureHandler" innerRef={null} @@ -9686,7 +9686,7 @@ exports[`Story Snapshots: WithSmallFont should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={24} handlerType="NativeViewGestureHandler" innerRef={null} diff --git a/app/containers/LoginServices/__snapshots__/LoginServices.test.tsx.snap b/app/containers/LoginServices/__snapshots__/LoginServices.test.tsx.snap index 1f887957e46..e36536132bb 100644 --- a/app/containers/LoginServices/__snapshots__/LoginServices.test.tsx.snap +++ b/app/containers/LoginServices/__snapshots__/LoginServices.test.tsx.snap @@ -2,47 +2,44 @@ exports[`Story Snapshots: Separators should match snapshot 1`] = ` [ - More options - , + , , - Less options - , + , + onClearInput?.()} + accessible + accessibilityLabel={i18n.t('Clear_input')} + rectButtonStyle={[styles.iconContainer, styles.iconRight]} + style={styles.clearInputIcon}> - + ) : null} {iconRight && !showClearInput ? ( @@ -212,7 +222,7 @@ export const FormTextInput = ({ {secureTextEntry ? ( - setShowPassword(!showPassword)}> @@ -222,7 +232,7 @@ export const FormTextInput = ({ size={20} color={colors.fontDefault} /> - + ) : null} diff --git a/app/containers/TextInput/__snapshots__/TextInput.test.tsx.snap b/app/containers/TextInput/__snapshots__/TextInput.test.tsx.snap index c25341973eb..ca58551553e 100644 --- a/app/containers/TextInput/__snapshots__/TextInput.test.tsx.snap +++ b/app/containers/TextInput/__snapshots__/TextInput.test.tsx.snap @@ -536,70 +536,101 @@ exports[`Story Snapshots: Icons should match snapshot 1`] = ` underlineColorAndroid="transparent" value="https://open.rocket.chat/images/logo/android-chrome-512x512.png" /> - - + + -  - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + @@ -1157,68 +1188,93 @@ exports[`Story Snapshots: SecureTextEntry should match snapshot 1`] = ` ] } > - - + + -  - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + diff --git a/app/containers/ThreadDetails.tsx b/app/containers/ThreadDetails.tsx index c2ae4216be1..b0e7ab65488 100644 --- a/app/containers/ThreadDetails.tsx +++ b/app/containers/ThreadDetails.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { StyleSheet, Text, View, type ViewStyle } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; +import Touch from './Touch'; import { CustomIcon } from './CustomIcon'; import { themes } from '../lib/constants/colors'; import sharedStyles from '../views/Styles'; @@ -87,11 +87,11 @@ const ThreadDetails = ({ item, user, badgeColor, toggleFollowThread, style }: IT {badgeColor ? : null} - toggleFollowThread?.(isFollowing, item.id)}> - + ); diff --git a/app/containers/Touch.tsx b/app/containers/Touch.tsx index cc76c7b2a7c..1f062ecaac1 100644 --- a/app/containers/Touch.tsx +++ b/app/containers/Touch.tsx @@ -20,6 +20,7 @@ export interface ITouchProps extends RectButtonProps { onAccessibilityAction?: (event: AccessibilityActionEvent) => void; testID?: string; rectButtonStyle?: StyleProp; + disabled?: boolean; } const Touch = React.forwardRef, ITouchProps>( @@ -35,6 +36,7 @@ const Touch = React.forwardRef, ITouchProps> onAccessibilityAction, style, rectButtonStyle, + disabled, ...props }, ref @@ -78,7 +80,8 @@ const Touch = React.forwardRef, ITouchProps> underlayColor={underlayColor || colors.surfaceNeutral} rippleColor={colors.surfaceNeutral} style={[rectButtonStyle, marginStyles, { backgroundColor, borderRadius }]} - {...props}> + {...props} + enabled={!disabled}> void; + testID?: string; + rectButtonStyle?: StyleProp; + enabled?: boolean; + android_rippleColor?: string; +} + +const Component = isIOS ? TouchableOpacity : TouchableNativeFeedback; + +const Touchable = React.forwardRef( + ( + { + children, + onPress, + android_rippleColor, + accessible, + accessibilityLabel, + accessibilityHint, + accessibilityActions, + onAccessibilityAction, + style, + rectButtonStyle, + enabled = true, + ...props + }, + ref + ) => { + const { colors } = useTheme(); + // The background color must be applied to the RectButton, not the View. + // If set on the View, the touch opacity animation won't work properly. + const flattenedStyle = StyleSheet.flatten(style) || {}; + const { + borderRadius, + backgroundColor, + marginBottom, + margin, + marginLeft, + marginVertical, + marginHorizontal, + marginEnd, + marginRight, + marginStart, + marginTop, + ...viewStyle + } = flattenedStyle; + // The margin should be applied to the parent component. + // If set on the View, it will create an internal margin inside the RectButton. + const marginStyles = { + margin, + marginBottom, + marginLeft, + marginVertical, + marginHorizontal, + marginEnd, + marginRight, + marginStart, + marginTop + }; + const androidProps = isIOS + ? {} + : { background: TouchableNativeFeedback.Ripple(android_rippleColor ?? colors.surfaceNeutral, false) }; + const touchableProps = isIOS ? { activeOpacity: 1 } : {}; + + return ( + + + {children} + + + ); + } +); + +export default Touchable; diff --git a/app/containers/UIKit/DatePicker.tsx b/app/containers/UIKit/DatePicker.tsx index bc1e05fbb60..62a7001fb89 100644 --- a/app/containers/UIKit/DatePicker.tsx +++ b/app/containers/UIKit/DatePicker.tsx @@ -1,7 +1,6 @@ import React, { useState } from 'react'; import { StyleSheet, Text, unstable_batchedUpdates, View } from 'react-native'; import DateTimePicker, { type BaseProps } from '@react-native-community/datetimepicker'; -import Touchable from 'react-native-platform-touchable'; import { BlockContext } from '@rocket.chat/ui-kit'; import dayjs from '../../lib/dayjs'; @@ -14,6 +13,7 @@ import { isAndroid } from '../../lib/methods/helpers'; import { useTheme } from '../../theme'; import ActivityIndicator from '../ActivityIndicator'; import { type IDatePicker } from './interfaces'; +import Touch from '../Touch'; const styles = StyleSheet.create({ input: { @@ -62,10 +62,7 @@ export const DatePicker = ({ element, language, action, context, loading, value, if (context === BlockContext.FORM) { button = ( - onShow(!show)} - style={{ backgroundColor: themes[theme].surfaceRoom }} - background={Touchable.Ripple(themes[theme].surfaceNeutral)}> + onShow(!show)} style={{ backgroundColor: themes[theme].surfaceRoom }}> )} - + ); } diff --git a/app/containers/UIKit/MultiSelect/Chips.tsx b/app/containers/UIKit/MultiSelect/Chips.tsx index 34ccef5574a..de6e1387df1 100644 --- a/app/containers/UIKit/MultiSelect/Chips.tsx +++ b/app/containers/UIKit/MultiSelect/Chips.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { Image } from 'expo-image'; import { textParser } from '../utils'; @@ -8,6 +7,7 @@ import { CustomIcon } from '../../CustomIcon'; import styles from './styles'; import { type IItemData } from '.'; import { useTheme } from '../../../theme'; +import Touch from '../../Touch'; interface IChip { item: IItemData; @@ -26,11 +26,10 @@ const keyExtractor = (item: IItemData) => item.value.toString(); const Chip = ({ item, onSelect, style }: IChip) => { const { colors } = useTheme(); return ( - onSelect(item)} style={[styles.chip, { backgroundColor: colors.surfaceHover }, style]} - background={Touchable.Ripple(colors.surfaceNeutral)} testID={`multi-select-chip-${item.value}`}> <> {item.imageUrl ? : null} @@ -39,7 +38,7 @@ const Chip = ({ item, onSelect, style }: IChip) => { - + ); }; Chip.propTypes = {}; diff --git a/app/containers/UIKit/MultiSelect/Input.tsx b/app/containers/UIKit/MultiSelect/Input.tsx index 47a1cb8203a..ce039fcac81 100644 --- a/app/containers/UIKit/MultiSelect/Input.tsx +++ b/app/containers/UIKit/MultiSelect/Input.tsx @@ -1,11 +1,11 @@ import React from 'react'; import { Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { CustomIcon } from '../../CustomIcon'; import ActivityIndicator from '../../ActivityIndicator'; import styles from './styles'; import { useTheme } from '../../../theme'; +import Touch from '../../Touch'; interface IInput { children?: JSX.Element; @@ -21,12 +21,11 @@ interface IInput { const Input = ({ children, onPress, loading, inputStyle, placeholder, disabled, innerInputStyle, testID }: IInput) => { const { colors } = useTheme(); return ( - + enabled={!disabled}> {placeholder ? {placeholder} : children} {loading ? ( @@ -35,7 +34,7 @@ const Input = ({ children, onPress, loading, inputStyle, placeholder, disabled, )} - + ); }; export default Input; diff --git a/app/containers/UIKit/MultiSelect/Items.tsx b/app/containers/UIKit/MultiSelect/Items.tsx index cb01de66ab8..f584a0c9da0 100644 --- a/app/containers/UIKit/MultiSelect/Items.tsx +++ b/app/containers/UIKit/MultiSelect/Items.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { Image } from 'expo-image'; import { FlatList } from 'react-native-gesture-handler'; @@ -11,6 +10,7 @@ import { type IItemData } from '.'; import { useTheme } from '../../../theme'; import { CustomIcon } from '../../CustomIcon'; import I18n from '../../../i18n'; +import Touch from '../../Touch'; interface IItem { item: IItemData; @@ -26,7 +26,6 @@ interface IItems { const keyExtractor = (item: IItemData) => item.value?.name || item.text?.text; -// RectButton doesn't work on modal (Android) const Item = ({ item, selected, onSelect }: IItem) => { const itemName = item.value?.name || item.text.text.toLowerCase(); const { colors } = useTheme(); @@ -34,7 +33,7 @@ const Item = ({ item, selected, onSelect }: IItem) => { const iconColor = selected ? colors.badgeBackgroundLevel2 : colors.strokeMedium; return ( - { - + ); }; diff --git a/app/containers/UIKit/Overflow.tsx b/app/containers/UIKit/Overflow.tsx index b97ff6aefa5..832ab697417 100644 --- a/app/containers/UIKit/Overflow.tsx +++ b/app/containers/UIKit/Overflow.tsx @@ -1,7 +1,6 @@ import React, { useState } from 'react'; import { FlatList, StyleSheet, Text } from 'react-native'; import Popover from 'react-native-popover-view'; -import Touchable from 'react-native-platform-touchable'; import { CustomIcon } from '../CustomIcon'; import ActivityIndicator from '../ActivityIndicator'; @@ -10,6 +9,7 @@ import { useTheme } from '../../theme'; import { BUTTON_HIT_SLOP } from '../message/utils'; import * as List from '../List'; import { type IOption, type IOptions, type IOverflow } from './interfaces'; +import Touch from '../Touch'; const keyExtractor = (item: any) => item.value; @@ -26,13 +26,10 @@ const styles = StyleSheet.create({ } }); -const Option = ({ option: { text, value }, onOptionPress, parser, theme }: IOption) => ( - onOptionPress({ value })} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} - style={styles.option}> +const Option = ({ option: { text, value }, onOptionPress, parser }: IOption) => ( + onOptionPress({ value })} style={styles.option}> {parser.text(text)} - + ); const Options = ({ options, onOptionPress, parser, theme }: IOptions) => ( @@ -44,7 +41,7 @@ const Options = ({ options, onOptionPress, parser, theme }: IOptions) => ( /> ); -const touchable: { [key: string]: Touchable | null } = {}; +const touchable: { [key: string]: React.RefObject | null } = {}; export const Overflow = ({ element, loading, action, parser }: IOverflow) => { const { theme } = useTheme(); @@ -59,11 +56,10 @@ export const Overflow = ({ element, loading, action, parser }: IOverflow) => { return ( <> - { touchable[blockId] = ref; }} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} onPress={() => onShow(!show)} hitSlop={BUTTON_HIT_SLOP} style={styles.menu}> @@ -72,13 +68,8 @@ export const Overflow = ({ element, loading, action, parser }: IOverflow) => { ) : ( )} - - onShow(false)}> + + onShow(false)}> diff --git a/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceEnded.tsx b/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceEnded.tsx index 0fd62be8a8c..77ef75dbae8 100644 --- a/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceEnded.tsx +++ b/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceEnded.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { Text } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { type IUser } from '../../../../definitions'; import { type VideoConferenceType } from '../../../../definitions/IVideoConference'; @@ -10,6 +9,7 @@ import { useVideoConf } from '../../../../lib/hooks/useVideoConf'; import { CallParticipants, type TCallUsers } from './CallParticipants'; import useStyle from './styles'; import { VideoConferenceBaseContainer } from './VideoConferenceBaseContainer'; +import Touch from '../../../Touch'; export default function VideoConferenceEnded({ users, @@ -32,11 +32,11 @@ export default function VideoConferenceEnded({ {type === 'direct' ? ( <> - + {createdBy.username === username ? i18n.t('Call_again') : i18n.t('Call_back')} - + {i18n.t('Call_was_not_answered')} ) : ( diff --git a/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceOutgoing.tsx b/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceOutgoing.tsx index accb49d285c..ea5f7984842 100644 --- a/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceOutgoing.tsx +++ b/app/containers/UIKit/VideoConferenceBlock/components/VideoConferenceOutgoing.tsx @@ -1,21 +1,21 @@ import React from 'react'; import { Text } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import i18n from '../../../../i18n'; import { videoConfJoin } from '../../../../lib/methods/videoConf'; import { CallParticipants, type TCallUsers } from './CallParticipants'; import useStyle from './styles'; import { VideoConferenceBaseContainer } from './VideoConferenceBaseContainer'; +import Touch from '../../../Touch'; export default function VideoConferenceOutgoing({ users, blockId }: { users: TCallUsers; blockId: string }): React.ReactElement { const style = useStyle(); return ( - videoConfJoin(blockId)}> + videoConfJoin(blockId)}> {i18n.t('Join')} - + ); diff --git a/app/containers/UIKit/__snapshots__/UiKitMessage.test.tsx.snap b/app/containers/UIKit/__snapshots__/UiKitMessage.test.tsx.snap index 7458a149302..f843cbd964c 100644 --- a/app/containers/UIKit/__snapshots__/UiKitMessage.test.tsx.snap +++ b/app/containers/UIKit/__snapshots__/UiKitMessage.test.tsx.snap @@ -3,47 +3,44 @@ exports[`Story Snapshots: ActionButton should match snapshot 1`] = ` [ - Approve - + , - Deny - + , - Deny - + , - Deny - + , - Deny - + , - Deny - + , - Deny - + , - Show more - , + , ] `; @@ -1011,47 +985,44 @@ exports[`Story Snapshots: SectionButton should match snapshot 1`] = ` - button - + `; @@ -1153,47 +1124,42 @@ exports[`Story Snapshots: SectionDatePicker should match snapshot 1`] = ` - Select a date - + `; @@ -1493,47 +1459,42 @@ exports[`Story Snapshots: SectionMultiSelect should match snapshot 1`] = ` - 2 selecteds - + , - 0 selecteds - + , ] `; @@ -1775,27 +1731,13 @@ exports[`Story Snapshots: SectionOverflow should match snapshot 1`] = ` - - + + -  - - + [ + { + "lineHeight": 18, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + `; diff --git a/app/containers/UIKit/__snapshots__/UiKitModal.test.tsx.snap b/app/containers/UIKit/__snapshots__/UiKitModal.test.tsx.snap index e9864a2c756..688dd77feff 100644 --- a/app/containers/UIKit/__snapshots__/UiKitModal.test.tsx.snap +++ b/app/containers/UIKit/__snapshots__/UiKitModal.test.tsx.snap @@ -999,47 +999,44 @@ exports[`Story Snapshots: ModalActionsWithShowMore should match snapshot 1`] = ` } />, - Primary Action - + , - Secondary - + , - Danger Action - + , - Button 4 - + , - Button 5 - + , - Button 6 - Hidden - + , - Button 7 - Hidden - + , - Button 8 - Hidden - + , - Show more - , + , - - + + -  - - + [ + { + "lineHeight": 18, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + , - - + + -  - - + [ + { + "lineHeight": 18, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + , - - + + -  - - + [ + { + "lineHeight": 18, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + , ] `; @@ -2286,107 +2338,130 @@ exports[`Story Snapshots: ModalDatePickerWithError should match snapshot 1`] = ` > Label - + - - Invalid Date - - -  - + ] + } + > + Invalid Date + + +  + + - + Set a date - + - - Invalid Date - - -  - + ] + } + > + Invalid Date + + +  + + - + , ] `; @@ -2860,47 +2958,44 @@ exports[`Story Snapshots: ModalFormTextArea should match snapshot 1`] = ` - Change - + , Share with... - + - - Search - - -  - + ] + } + > + Search + + +  + + - + Share with... - + - - John - - + -  - + "alignItems": "center", + "flexDirection": "row", + "height": 28, + "paddingHorizontal": 4, + } + } + > + + John + + +  + + + - - -  - + {}, + ] + } + > +  + + - + { if (!src.value) { return; } + if (process.env.RUNNING_E2E_TESTS === 'true') { + Alert.alert('Link Pressed', src.value); + return; + } if (onLinkPress) { return onLinkPress(src.value); } @@ -32,12 +36,19 @@ const Link = ({ value }: ILinkProps) => { }; const onLongPress = () => { + if (!src.value) { + return; + } + if (process.env.RUNNING_E2E_TESTS === 'true') { + Alert.alert('Link Long Pressed', src.value); + return; + } Clipboard.setString(src.value); EventEmitter.emit(LISTENER, { message: I18n.t('Copied_to_clipboard') }); }; return ( - + {(block => { const blockArray = Array.isArray(block) ? block : [block]; return blockArray.map(blockInArray => { diff --git a/app/containers/message/Broadcast.tsx b/app/containers/message/Broadcast.tsx index c39eb3fa48d..b85c9f66da1 100644 --- a/app/containers/message/Broadcast.tsx +++ b/app/containers/message/Broadcast.tsx @@ -24,7 +24,6 @@ const Broadcast = React.memo(({ author, broadcast }: IMessageBroadcast) => { diff --git a/app/containers/message/CallButton.tsx b/app/containers/message/CallButton.tsx index 174a8eafe75..9df1c4b324b 100644 --- a/app/containers/message/CallButton.tsx +++ b/app/containers/message/CallButton.tsx @@ -19,7 +19,6 @@ const CallButton = React.memo(({ handleEnterCall }: IMessageCallButton) => { diff --git a/app/containers/message/Components/Attachments/CollapsibleQuote/index.tsx b/app/containers/message/Components/Attachments/CollapsibleQuote/index.tsx index 073e5d7660d..68019746eb0 100644 --- a/app/containers/message/Components/Attachments/CollapsibleQuote/index.tsx +++ b/app/containers/message/Components/Attachments/CollapsibleQuote/index.tsx @@ -171,7 +171,6 @@ const CollapsibleQuote = React.memo( borderLeftWidth: 2 } ]} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} hitSlop={BUTTON_HIT_SLOP}> diff --git a/app/containers/message/Components/Attachments/Image/Button.tsx b/app/containers/message/Components/Attachments/Image/Button.tsx index 16d301d390c..22a22e7e64a 100644 --- a/app/containers/message/Components/Attachments/Image/Button.tsx +++ b/app/containers/message/Components/Attachments/Image/Button.tsx @@ -1,6 +1,5 @@ import React from 'react'; -import { useTheme } from '../../../../../theme'; import Touchable from '../../../Touchable'; import styles from '../../../styles'; @@ -13,13 +12,8 @@ interface IMessageButton { export const Button = ({ children, onPress, disabled }: IMessageButton) => { 'use memo'; - const { colors } = useTheme(); return ( - + {children} ); diff --git a/app/containers/message/Components/Attachments/Reply.tsx b/app/containers/message/Components/Attachments/Reply.tsx index eec13fe43c0..93ac835f703 100644 --- a/app/containers/message/Components/Attachments/Reply.tsx +++ b/app/containers/message/Components/Attachments/Reply.tsx @@ -247,7 +247,6 @@ const Reply = React.memo( borderColor: strokeLight } ]} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} disabled={!!(loading || attachment.message_link)}> diff --git a/app/containers/message/Components/Attachments/Video.tsx b/app/containers/message/Components/Attachments/Video.tsx index c3c36d34f7f..13f38ef9a0e 100644 --- a/app/containers/message/Components/Attachments/Video.tsx +++ b/app/containers/message/Components/Attachments/Video.tsx @@ -74,7 +74,6 @@ const Video = ({ file, showAttachment, getCustomEmoji, author, msg }: IMessageVi 'use memo'; const { user } = useContext(MessageContext); - const { colors } = useTheme(); const { status, onPress, url, isEncrypted, currentFile } = useMediaAutoDownload({ file, author, showAttachment }); const _onPress = async () => { @@ -103,7 +102,7 @@ const Video = ({ file, showAttachment, getCustomEmoji, author, msg }: IMessageVi return ( {msg ? : null} - + diff --git a/app/containers/message/Discussion.tsx b/app/containers/message/Discussion.tsx index 30327cdc801..2a26d295dc3 100644 --- a/app/containers/message/Discussion.tsx +++ b/app/containers/message/Discussion.tsx @@ -31,7 +31,6 @@ const Discussion = React.memo( diff --git a/app/containers/message/Message.tsx b/app/containers/message/Message.tsx index ce32c546e6a..b407b580ab8 100644 --- a/app/containers/message/Message.tsx +++ b/app/containers/message/Message.tsx @@ -1,6 +1,5 @@ import React, { useContext } from 'react'; import { View, type ViewStyle } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { A11y } from 'react-native-a11y-order'; import MessageContext from './Context'; @@ -27,6 +26,7 @@ import MessageTime from './Time'; import { useResponsiveLayout } from '../../lib/hooks/useResponsiveLayout/useResponsiveLayout'; import Quote from './Components/Attachments/Quote'; import translationLanguages from '../../lib/constants/translationLanguages'; +import Touchable from '../Touchable'; const MessageInner = React.memo((props: IMessageInner) => { const { isLargeFontScale } = useResponsiveLayout(); diff --git a/app/containers/message/Reactions.tsx b/app/containers/message/Reactions.tsx index d0ab1fde4c5..1d571b12065 100644 --- a/app/containers/message/Reactions.tsx +++ b/app/containers/message/Reactions.tsx @@ -40,7 +40,6 @@ const AddReaction = React.memo(({ theme }: { theme: TSupportedThemes }) => { key='message-add-reaction' testID='message-add-reaction' style={[styles.reactionButton, { backgroundColor: themes[theme].surfaceRoom }]} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} hitSlop={BUTTON_HIT_SLOP}> @@ -63,7 +62,6 @@ const Reaction = React.memo(({ reaction, getCustomEmoji, theme }: IMessageReacti key={reaction.emoji} testID={`message-reaction-${reaction.emoji}`} style={[styles.reactionButton, { backgroundColor: reacted ? themes[theme].surfaceNeutral : themes[theme].surfaceRoom }]} - background={Touchable.Ripple(themes[theme].surfaceNeutral)} hitSlop={BUTTON_HIT_SLOP}> { +interface IProps extends PressableProps { + children: React.ReactNode; + onLongPress?: () => void; +} + +const RCTouchable: React.FC = React.memo(({ children, ...props }) => { 'use memo'; const { onLongPress } = useContext(MessageContext); return ( - + {children} - + ); }); -// @ts-ignore -RCTouchable.Ripple = (...args: any[]) => Touchable.Ripple(...args); -RCTouchable.SelectableBackgroundBorderless = () => Touchable.SelectableBackgroundBorderless(); - export default RCTouchable; diff --git a/app/containers/message/Urls.tsx b/app/containers/message/Urls.tsx index 717754f9c3b..455fc8d5326 100644 --- a/app/containers/message/Urls.tsx +++ b/app/containers/message/Urls.tsx @@ -177,8 +177,7 @@ const Url = ({ url }: { url: IUrl }) => { borderWidth: 1, overflow: 'hidden' } - ]} - background={Touchable.Ripple(colors.surfaceNeutral)}> + ]}> <> {imageUrl ? : null} {hasContent ? : null} diff --git a/app/containers/message/User.tsx b/app/containers/message/User.tsx index f24a65d849f..15485df19a0 100644 --- a/app/containers/message/User.tsx +++ b/app/containers/message/User.tsx @@ -1,5 +1,5 @@ import React, { useContext } from 'react'; -import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { StyleSheet, Text, View } from 'react-native'; import { type MessageType, type MessageTypesValues, SubscriptionType } from '../../definitions'; import { useTheme } from '../../theme'; @@ -10,6 +10,7 @@ import MessageContext from './Context'; import { messageHaveAuthorName } from './utils'; import MessageTime from './Time'; import { useResponsiveLayout } from '../../lib/hooks/useResponsiveLayout/useResponsiveLayout'; +import Touch from '../Touch'; const styles = StyleSheet.create({ container: { @@ -116,12 +117,12 @@ const User = React.memo( return ( - + {textContent} {isLargeFontScale ? null : } - + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message is inside an archived room + + This message is inside an archived room + - + - - + + @@ -424,324 +490,390 @@ exports[`Story Snapshots: ArchivedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - - - + + + diego.mello + + + + + + + 10:00 AM + + + + + - This message is inside an archived room + + This message is inside an archived room + - + - - + + @@ -799,260 +931,318 @@ exports[`Story Snapshots: AttachmentWithTextAndLink should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Rocket.Chat - - - - + Rocket.Chat + + + - Rocket.Chat - - - , the best open source chat + + Rocket.Chat + + + , the best open source chat + - + - - - + - + - + -  - - - +  + + + + /> + - - + + @@ -1467,260 +1671,318 @@ exports[`Story Snapshots: AttachmentWithTextAndLinkLargeFont should match snapsh style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Rocket.Chat - - - - + Rocket.Chat + + + - Rocket.Chat - - - , the best open source chat + + Rocket.Chat + + + , the best open source chat + - + - - - + - + - + -  - - - +  + + + + /> + - - + + @@ -2135,324 +2411,390 @@ exports[`Story Snapshots: Avatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - no.avatar - - + + + no.avatar + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message has no avatar. + + This message has no avatar. + - + - - + + @@ -2497,324 +2839,390 @@ exports[`Story Snapshots: Avatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message uses the user's profile picture as the avatar. - - - + + This message uses the user's profile picture as the avatar. + + + + - - + + @@ -2859,316 +3267,382 @@ exports[`Story Snapshots: Avatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - 😄 - + + + + 😄 + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message uses a Unicode emoji as the avatar. + + This message uses a Unicode emoji as the avatar. + - + - - + + @@ -3213,334 +3687,400 @@ exports[`Story Snapshots: Avatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - - + + + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message uses a custom animated emoji as the avatar. + + This message uses a custom animated emoji as the avatar. + - + - - + + @@ -3585,334 +4125,400 @@ exports[`Story Snapshots: Avatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - - + + + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This message uses a custom static emoji as the avatar. - - - - - - - - - - + + This message uses a custom static emoji as the avatar. + + + + + + + + + + + @@ -3970,324 +4576,390 @@ exports[`Story Snapshots: Basic should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Message + + Message + - + - - + + @@ -4332,324 +5004,390 @@ exports[`Story Snapshots: Basic should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + + + + - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + - + - - + + @@ -4707,324 +5445,390 @@ exports[`Story Snapshots: BasicLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Message + + Message + - + - - + + @@ -5069,324 +5873,390 @@ exports[`Story Snapshots: BasicLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + - + - - + + @@ -5444,346 +6314,412 @@ exports[`Story Snapshots: BlockQuote should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - + - Testing block quote + + Testing block quote + - + @@ -5791,8 +6727,8 @@ exports[`Story Snapshots: BlockQuote should match snapshot 1`] = ` - - + + @@ -5837,405 +6773,471 @@ exports[`Story Snapshots: BlockQuote should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > Testing block quote Testing block quote. " - accessible={true} - style={ - { - "flexDirection": "column", - "gap": 8, - "paddingHorizontal": 12, - "paddingVertical": 4, - "width": "100%", + accessible={true} + style={ + { + "flexDirection": "column", + "gap": 8, + "paddingHorizontal": 12, + "paddingVertical": 4, + "width": "100%", + } } - } - testID="message-undefined" - > - - - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - + - Testing block quote + + Testing block quote + - + - - - Testing block quote + + Testing block quote + - + - - + + @@ -6293,346 +7295,412 @@ exports[`Story Snapshots: BlockQuoteLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - + > + diego.mello + + + + + + + 10:00 AM + + + + - + - Testing block quote + + Testing block quote + - + @@ -6640,8 +7708,8 @@ exports[`Story Snapshots: BlockQuoteLargeFont should match snapshot 1`] = ` - - + + @@ -6686,405 +7754,471 @@ exports[`Story Snapshots: BlockQuoteLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > Testing block quote Testing block quote. " - accessible={true} - style={ - { - "flexDirection": "column", - "gap": 8, - "paddingHorizontal": 12, - "paddingVertical": 4, - "width": "100%", + accessible={true} + style={ + { + "flexDirection": "column", + "gap": 8, + "paddingHorizontal": 12, + "paddingVertical": 4, + "width": "100%", + } } - } - testID="message-undefined" - > - - - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - + > + diego.mello + + + + + + + 10:00 AM + + + + - - + + - Testing block quote + + Testing block quote + - + - - - Testing block quote + + Testing block quote + - + - - + + @@ -7142,439 +8276,510 @@ exports[`Story Snapshots: Broadcast should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + + + + + Broadcasted message + + + + + - - - Broadcasted message +  - - - - - - - - -  - - - Reply - - + + Reply + + + - - + + @@ -7632,474 +8837,545 @@ exports[`Story Snapshots: BroadcastLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - - + - - Broadcasted message - + diego.mello - - + + + + + 10:00 AM + -  - - - Reply + } + } + > + + Broadcasted message + + - - - - - - - - - - - - -`; - -exports[`Story Snapshots: CollapsedAttachments should match snapshot 1`] = ` - - - - - + + + +  + + + Reply + + + + + + + + + + + + + + + + +`; + +exports[`Story Snapshots: CollapsedAttachments should match snapshot 1`] = ` + + + + + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - - + - - Message - + diego.mello - - + + 10:00 AM + + + + - - - Title collapsed + Message - - - - + + + + + + + + + + Title collapsed + + + + -  - + +  + + @@ -8584,8 +9932,8 @@ exports[`Story Snapshots: CollapsedAttachments should match snapshot 1`] = ` - - + + @@ -8630,260 +9978,318 @@ exports[`Story Snapshots: CollapsedAttachments should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Title collapsed - - - - + Title collapsed + + + - Title collapsed + + Title collapsed + - - - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -9232,71 +10651,71 @@ exports[`Story Snapshots: CollapsedAttachments should match snapshot 1`] = ` - - - - Message + + Message + - + - - + + @@ -9354,319 +10773,318 @@ exports[`Story Snapshots: CollapsedAttachmentsLargeFont should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - - + - - Message - + diego.mello - - + + + + + 10:00 AM + - - - Title collapsed + Message - - + + + + + + - + + + Title collapsed + + + + + -  - + [ + { + "lineHeight": 28.6, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + @@ -9816,8 +11307,8 @@ exports[`Story Snapshots: CollapsedAttachmentsLargeFont should match snapshot 1` - - + + @@ -9862,260 +11353,318 @@ exports[`Story Snapshots: CollapsedAttachmentsLargeFont should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Title collapsed - - - - - - Title collapsed - + Title collapsed - - - + - Field 1 + + + Title collapsed + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -10464,71 +12026,71 @@ exports[`Story Snapshots: CollapsedAttachmentsLargeFont should match snapshot 1` - - - - Message + + Message + - + - - + + @@ -10586,471 +12148,544 @@ exports[`Story Snapshots: CollapsibleAttachmentWithText should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is the main message body. + + This is the main message body. + - + - - + + + Collapsed attachment block + + + + - Collapsed attachment block +  - - -  - - - - + + @@ -11095,260 +12730,318 @@ exports[`Story Snapshots: CollapsibleAttachmentWithText should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - - - - + + + + + + + - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Collapsed attachment block - - - - - - This attachment text should NOT appear as plain text above the message or duplicate before the block. - + Collapsed attachment block - - - + - Field 1 + + + This attachment text should NOT appear as plain text above the message or duplicate before the block. + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - - Long field - - + Long field + + - + - This field value could also contribute to duplicate text when expanded. + + This field value could also contribute to duplicate text when expanded. + - + + + + + + Attachment description that might also leak as duplicate plain text. + + + + + + - Attachment description that might also leak as duplicate plain text. + This is the main message body. - - - - - - This is the main message body. - - - - - - - + + @@ -11960,319 +13666,318 @@ exports[`Story Snapshots: CollapsibleAttachmentWithTextLargeFont should match sn style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - - + - - This is the main message body. - + diego.mello - - + + + + + 10:00 AM + - - - Collapsed attachment block + This is the main message body. - - - + + + + + + - + + + Collapsed attachment block + + + + + -  - + [ + { + "lineHeight": 28.6, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + @@ -12423,8 +14202,8 @@ exports[`Story Snapshots: CollapsibleAttachmentWithTextLargeFont should match sn - - + + @@ -12469,260 +14248,318 @@ exports[`Story Snapshots: CollapsibleAttachmentWithTextLargeFont should match sn style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Collapsed attachment block - - - - + Collapsed attachment block + + + - This attachment text should NOT appear as plain text above the message or duplicate before the block. + + This attachment text should NOT appear as plain text above the message or duplicate before the block. + - - - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - - Long field - - + Long field + + - This field value could also contribute to duplicate text when expanded. + + This field value could also contribute to duplicate text when expanded. + - + + + + + + Attachment description that might also leak as duplicate plain text. + + + + + + - Attachment description that might also leak as duplicate plain text. + This is the main message body. - - - - - - This is the main message body. - - - - - - - + + @@ -13334,260 +15184,318 @@ exports[`Story Snapshots: ColoredAttachments should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - + - - Field 1 - - + Field 1 + + + [ + { + "backgroundColor": "transparent", + "fontFamily": "Inter", + "fontSize": 16, + "fontWeight": "400", + "lineHeight": 22, + "textAlign": "left", + }, + { + "color": "#2F343D", + }, + ] + } + > - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -14397,8 +16328,8 @@ exports[`Story Snapshots: ColoredAttachments should match snapshot 1`] = ` - - + + @@ -14456,260 +16387,318 @@ exports[`Story Snapshots: ColoredAttachmentsLargeFont should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - - - - + + + + + + + - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - + - - Field 1 - - + Field 1 + + - + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - + - - Field 1 - - + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -15519,8 +17531,8 @@ exports[`Story Snapshots: ColoredAttachmentsLargeFont should match snapshot 1`] - - + + @@ -15578,260 +17590,318 @@ exports[`Story Snapshots: CustomFields should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 + + + Custom fields + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -16181,71 +18264,71 @@ exports[`Story Snapshots: CustomFields should match snapshot 1`] = ` - - - - Message + + Message + - + - - + + @@ -16290,260 +18373,318 @@ exports[`Story Snapshots: CustomFields should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 - - - - Value 1 - + Custom fields - + - - Field 2 - - + Field 1 + + - Value 2 + + Value 1 + - + - - - - Field 3 - - + Field 2 + + - Value 3 + + Value 2 + - + - - - - Field 4 - - + Field 3 + + - Value 4 + + Value 3 + - + - - - - Field 5 - - + Field 4 + + + + + Value 4 + + + + + + + + Field 5 + + + - Value 5 + + Value 5 + - + @@ -17151,71 +19305,71 @@ exports[`Story Snapshots: CustomFields should match snapshot 1`] = ` - - - - Message + + Message + - + - - + + @@ -17273,260 +19427,318 @@ exports[`Story Snapshots: CustomFieldsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 + + + Custom fields + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -17876,71 +20101,71 @@ exports[`Story Snapshots: CustomFieldsLargeFont should match snapshot 1`] = ` - - - - Message + + Message + - + - - + + @@ -17985,260 +20210,318 @@ exports[`Story Snapshots: CustomFieldsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 - - - - Value 1 - + Custom fields - + - - Field 2 - - + Field 1 + + - Value 2 + + Value 1 + - + - - - - Field 3 - - + Field 2 + + - Value 3 + + Value 2 + - + - - - - Field 4 - - + Field 3 + + - Value 4 + + Value 3 + - + - - - - Field 5 - - + Field 4 + + + + + Value 4 + + + + + + + + Field 5 + + + - Value 5 + + Value 5 + - + @@ -18846,71 +21142,71 @@ exports[`Story Snapshots: CustomFieldsLargeFont should match snapshot 1`] = ` - - - - Message + + Message + - + - - + + @@ -18968,324 +21264,390 @@ exports[`Story Snapshots: DateAndUnreadSeparators should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - rocket.cat - - + + + rocket.cat + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Fourth message + + Fourth message + - + - - + + @@ -19392,324 +21754,390 @@ exports[`Story Snapshots: DateAndUnreadSeparators should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Third message + + Third message + - + - - + + @@ -19798,141 +22226,155 @@ exports[`Story Snapshots: DateAndUnreadSeparators should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Second message + + Second message + - + - - - - + /> + + + @@ -19977,324 +22419,390 @@ exports[`Story Snapshots: DateAndUnreadSeparators should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - rocket.cat - - + + + rocket.cat + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Second message - + { + "backgroundColor": "transparent", + "flexShrink": 1, + "fontFamily": "Inter", + "fontWeight": "400", + "textAlign": "left", + } + } + > + + Second message + + - + - - + + @@ -20396,324 +22904,390 @@ exports[`Story Snapshots: DateAndUnreadSeparators should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - First message + + First message + - + - - + + @@ -20771,324 +23345,390 @@ exports[`Story Snapshots: DateAndUnreadSeparatorsLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - rocket.cat - - - - - - 10:00 AM - - - + + + + rocket.cat + + + + + + 10:00 AM + + + - - Fourth message + + Fourth message + - + - - + + @@ -21195,324 +23835,390 @@ exports[`Story Snapshots: DateAndUnreadSeparatorsLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Third message + + Third message + - + - - + + @@ -21601,141 +24307,155 @@ exports[`Story Snapshots: DateAndUnreadSeparatorsLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Second message + + Second message + - + - - - - + /> + + + @@ -21780,324 +24500,390 @@ exports[`Story Snapshots: DateAndUnreadSeparatorsLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - rocket.cat - + + + + rocket.cat + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Second message + + Second message + - + - - + + @@ -22199,324 +24985,390 @@ exports[`Story Snapshots: DateAndUnreadSeparatorsLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - First message + + First message + - + - - + + @@ -22574,395 +25426,288 @@ exports[`Story Snapshots: Discussion should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - Started a discussion: - - - This is a discussion - - - + /> -  + diego.mello - No messages yet + 10:00 AM - + + + + - - - - - - - - - - - - + Started a discussion: + + + This is a discussion + + + + + +  + + + No messages yet + + + + + + + + + + + + + + + + + @@ -23052,395 +25975,288 @@ exports[`Story Snapshots: Discussion should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - Started a discussion: - - - This is a discussion - - - + /> -  + diego.mello - 1 message + 10:00 AM - + + + + - November 10, 2017 + Started a discussion: - - - - - - - - - - - - - + This is a discussion + + + + + +  + + + 1 message + + + + + November 10, 2017 + + + + + + + + + + + + + + + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - Started a discussion: - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - + /> -  + diego.mello - 10 messages + 10:00 AM - + + + + - November 10, 2017 + Started a discussion: - - - - - - - - - - - - + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + +  + + + 10 messages + + + + + November 10, 2017 + + + + + + + + + + + + + + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - Started a discussion: - - - This is a discussion - - - + /> -  + diego.mello - +999 messages + 10:00 AM - + + + + - November 10, 2017 + Started a discussion: - - - - - - - - - - - - -`; - -exports[`Story Snapshots: DiscussionLargeFont should match snapshot 1`] = ` - - - - - + This is a discussion + + + + + +  + + + +999 messages + + + + + November 10, 2017 + + + + + + + + + + + + + + +`; + +exports[`Story Snapshots: DiscussionLargeFont should match snapshot 1`] = ` + + + + + - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - Started a discussion: - - - This is a discussion - - - + /> -  - - - No messages yet + diego.mello - - + - - - - - - - - - - - + 10:00 AM + + + + Started a discussion: + + + This is a discussion + + + + + +  + + + No messages yet + + + + + + + + + + + + + + + + + - - + - + + /> + + + + - - - - diego.mello - - - + + + diego.mello + + + + - - - 10:00 AM - - + /> + - Started a discussion: - - - This is a discussion + 10:00 AM - + Started a discussion: + + - + + - + -  - - - 1 message - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + + 1 message + + + + November 10, 2017 + - - November 10, 2017 - - - + + @@ -25463,426 +28741,335 @@ exports[`Story Snapshots: DiscussionLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - Started a discussion: - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - + /> -  - - - 10 messages + diego.mello - + + + + + 10:00 AM + + - November 10, 2017 + Started a discussion: - - - - - - - - - - - + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + +  + + + 10 messages + + + + + November 10, 2017 + + + + + + + + + + + + + - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - Started a discussion: - - - This is a discussion - - - + /> -  - - - +999 messages + diego.mello - + + + + + 10:00 AM + + - November 10, 2017 + Started a discussion: - - - - - - - - - - - - -`; - -exports[`Story Snapshots: Edited should match snapshot 1`] = ` - - - - - - - - - - - - - - - - - - - - diego.mello + This is a discussion - - 10:00 AM - - - - - -  - - - - - - - - - - Message header +  - + + +999 messages + + + + + November 10, 2017 - - + + + + +`; + +exports[`Story Snapshots: Edited should match snapshot 1`] = ` + + - - + - - - + + - - - Message without header - - - + } + transition={null} + width={36} + /> - + - - - -  - - - - - - - - - - - -`; - -exports[`Story Snapshots: EditedLargeFont should match snapshot 1`] = ` - - - - - - - - - - - - - - - - - - - - diego.mello - - - + + + + diego.mello + + + 10:00 AM + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - - - - Message header + + Message header + - + - - + + - - + - + - - Message without header + + Message without header + - + - - - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - + + @@ -27639,7 +30513,7 @@ exports[`Story Snapshots: EditedLargeFont should match snapshot 1`] = ` `; -exports[`Story Snapshots: Editing should match snapshot 1`] = ` +exports[`Story Snapshots: EditedLargeFont should match snapshot 1`] = ` - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + + - 10:00 AM - + + +  + + + + + 10:00 AM + - - - - - Message being edited + + Message header + - + - - + + - - -`; - -exports[`Story Snapshots: EditingLargeFont should match snapshot 1`] = ` - - - - + + - - - - - - - - - diego.mello - - - - - - 10:00 AM - - - - - Message being edited + + Message without header + - + + + + +  + + + - - + + @@ -28389,7 +31219,7 @@ exports[`Story Snapshots: EditingLargeFont should match snapshot 1`] = ` `; -exports[`Story Snapshots: Emojis should match snapshot 1`] = ` +exports[`Story Snapshots: Editing should match snapshot 1`] = ` - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - + /> - 👊 + diego.mello - 🤙👏 + 10:00 AM - + + - - - - - - - - - - - - + + + + + + Message being edited + + + + + + + + + + + + + + + + + +`; + +exports[`Story Snapshots: EditingLargeFont should match snapshot 1`] = ` + + + + + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + + - 10:00 AM - + /> + + 10:00 AM + - - - - 👏 + + + Message being edited + + @@ -29095,20 +32091,33 @@ exports[`Story Snapshots: Emojis should match snapshot 1`] = ` - - + + + + +`; + +exports[`Story Snapshots: Emojis should match snapshot 1`] = ` + + - - + - - - - - + underlayColor="#E4E7EA" + > + + + + + + + - - diego.mello - - - 10:00 AM - - - - - - - + /> - - - - + - + + + + + + + + + + 👊 + + - - - + > + 🤙👏 + @@ -29556,20 +32531,20 @@ exports[`Story Snapshots: Emojis should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - + > + 👏 + @@ -29925,20 +32939,20 @@ exports[`Story Snapshots: Emojis should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - + /> - 🤙 + diego.mello - - + + + + + + + + + + + + + + + + > + + @@ -30313,20 +33466,20 @@ exports[`Story Snapshots: Emojis should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - - 🤙 - - - :react_rocket: - - - 🤙 - - - 🤙 - - - + "height": 30, + "width": 30, + } + } + transition={null} + width={30} + /> + + + - - + + - - -`; - -exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` - - - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - 👊 + diego.mello - 🤙👏 + 10:00 AM - + + - - - - - + + + + + + 🤙 + + + + + + + + + + + + + - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + 10:00 AM + + + + - - - 10:00 AM - - - - 👏 + + + 🤙 + + + :react_rocket: + + + 🤙 + + + 🤙 + + @@ -31448,20 +34840,33 @@ exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` - - + + + + +`; + +exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` + + - - + - + + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - - + 👊 + + - - - + > + 🤙👏 + @@ -31909,20 +35280,20 @@ exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - - + + + + + + 10:00 AM + + + + + + + > + 👏 + @@ -32278,20 +35688,20 @@ exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - 🤙 + diego.mello + + + + + + 10:00 AM + + + + - + + + + + + + > + + @@ -32666,20 +36215,20 @@ exports[`Story Snapshots: EmojisLargeFont should match snapshot 1`] = ` - - + + - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - - 🤙 - - - :react_rocket: - - - 🤙 - - - 🤙 - - - + "height": 30, + "width": 30, + } + } + transition={null} + width={30} + /> + + + - - + + - - -`; - -exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` - - - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - - + + diego.mello + + + + -  - - + } + /> - - + > + 10:00 AM + - - - Message + 🤙 - - + + + + + - - + + - - + - - - + + - - - Message Encrypted without Header - - - + } + transition={null} + width={46.800000000000004} + /> - + - - - -  - - - - - - - - - - - - - - - - - - + - - - - + testID="username-header-diego.mello" + underlayColor="#E4E7EA" + > + + + + diego.mello + + + + + + + 10:00 AM + + + + + + + + 🤙 + + + :react_rocket: + + + 🤙 + + + 🤙 + + + + + + + + + + + + + + + + + +`; + +exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` + + + + + + + + + + + + + + + + + + + + + + + + + + + diego.mello + + + 10:00 AM + + + + + + +  + + + + + + + + + + + Message + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + Message Encrypted without Header + + + + + + + + - - - diego.mello - - + - 10:00 AM - - - - + + + + + + + + + + + + + + + + + + + + - + + -  - + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> - + + + + + + + + diego.mello + + + 10:00 AM + + + - - - Message Encrypted with Reactions - + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  - + - - - 😂 - - 1 + + + Message Encrypted with Reactions + + - + + 😂 + + + 1 + + + + - + - 1 - + + + 1 + + - - - - - 🤔 - - - 1 - + + 🤔 + + + 1 + + - - - - -  - + +  + + - - + + @@ -34673,302 +39346,341 @@ exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Thread with emoji :) 😂 - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Thread with emoji :) 😂 - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Thread reply encrypted - + + + + + - + + + + + Thread reply encrypted + + + + + @@ -35014,400 +39726,467 @@ exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - - diego.mello - - - 10:00 AM - - - + + + + diego.mello + + + 10:00 AM + + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Temp message encrypted + + Temp message encrypted + - + - - + + @@ -35452,395 +40231,462 @@ exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - + + diego.mello + + + 10:00 AM + + + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Message Edited encrypted + + Message Edited encrypted + - + - - + + @@ -35901,80 +40747,105 @@ exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` } testID="avatar" > - - + + - + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> + + - - - diego.mello - - + - 10:00 AM - - + + diego.mello + + + 10:00 AM + + + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - + + + + diego.mello + + + 10:00 AM + + + + + + +  + + -  +  - -  - - - - - Read Receipt encrypted with Header + + Read Receipt encrypted with Header + - + - - + + @@ -36808,242 +41775,257 @@ exports[`Story Snapshots: Encrypted should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Read Receipt encrypted without Header + + Read Receipt encrypted without Header + - + - - + + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "paddingLeft": 5, + } + } + > + +  + + -  - - - -  - + {}, + ] + } + testID="read-receipt-read" + > +  + + - - + + @@ -37101,395 +42083,462 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + + + diego.mello + + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Message + + Message + - + - - + + @@ -37534,212 +42583,227 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - + + - Message Encrypted without Header + + Message Encrypted without Header + - + - - + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - + + @@ -37784,808 +42848,895 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - + + -  - - - - - - 10:00 AM - - - + { + "color": "#1F2329", + }, + ] + } + > + diego.mello + + + - - - Message Encrypted with Reactions - + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  - + + + 10:00 AM + - - 😂 - - 1 + + + Message Encrypted with Reactions + + - + + 😂 + + + 1 + + + + - + - 1 - + + + 1 + + - - - - - 🤔 - - - 1 - + + 🤔 + + + 1 + + - - - - -  - + +  + + - - + + @@ -38630,302 +43781,341 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Thread with emoji :) 😂 - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Thread with emoji :) 😂 - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Thread reply encrypted - + + + + + - + + + + + Thread reply encrypted + + + + + @@ -38971,400 +44161,467 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + + + diego.mello + + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Temp message encrypted + + Temp message encrypted + - + - - + + @@ -39409,395 +44666,462 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + + + diego.mello + + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Message Edited encrypted + + Message Edited encrypted + - + - - + + @@ -39858,80 +45182,105 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` } testID="avatar" > - - + + - + style={ + { + "borderRadius": 4, + "height": 46.800000000000004, + "width": 46.800000000000004, + } + } + transition={null} + width={46.800000000000004} + /> + + - - + - diego.mello - - + + diego.mello + + + - - + - + + /> + + + + - - - - diego.mello - - - - + + + + diego.mello + + + + + + +  + + -  +  - -  - - - - 10:00 AM - - + > + 10:00 AM + - - Read Receipt encrypted with Header + + Read Receipt encrypted with Header + - + - - + + @@ -40765,196 +46210,240 @@ exports[`Story Snapshots: EncryptedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Read Receipt encrypted without Header + + Read Receipt encrypted without Header + - + - - + + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "paddingLeft": 5, + } + } + > + +  + + -  +  - -  - - - + + @@ -41074,80 +46534,105 @@ exports[`Story Snapshots: Error should match snapshot 1`] = ` } testID="avatar" > - - + + - + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> + + - - - diego.mello - - + - 10:00 AM - - + + diego.mello + + + 10:00 AM + + + - - + + - + style={ + { + "borderRadius": 4, + "height": 46.800000000000004, + "width": 46.800000000000004, + } + } + transition={null} + width={46.800000000000004} + /> + + - - + - diego.mello - - + + diego.mello + + + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + + test.py + + test.py - - test.py - - - - - Check out this Python file + + Check out this Python file + - + - - + + @@ -42774,260 +48413,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + + Component.tsx + + Component.tsx - - Component.tsx - - - - - TypeScript component + + TypeScript component + - + - - + + @@ -43270,260 +48980,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + + config.json + + config.json - - config.json - - - - - Configuration file + + Configuration file + - + - - + + @@ -43766,260 +49547,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - main.go - - - - + main.go + + + - - This is the - - main + This is the - - - entry point for the application + "backgroundColor": "transparent", + "fontFamily": "Inter", + "fontWeight": "700", + "textAlign": "left", + } + } + > + + main + + + + entry point for the application + - + - - - - File with description + + File with description + - + - - + + @@ -44339,67 +50191,73 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -44418,246 +50276,264 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] } > + + + document.pdf + + - document.pdf - - - - document.pdf - + testID="markdown-preview-document.pdf" + > + document.pdf + + - - + + + image.png + + image.png - - image.png - @@ -44665,16 +50541,16 @@ exports[`Story Snapshots: FileAttachmentsWithFilenames should match snapshot 1`] - - - - + /> + + + @@ -44732,260 +50608,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + + + + test.py + + - test.py - - - - test.py - + "fontWeight": "400", + "lineHeight": 22, + "textAlign": "left", + }, + { + "color": "#2F343D", + "lineHeight": undefined, + }, + ] + } + testID="markdown-preview-test.py" + > + test.py + + - - - - Check out this Python file + + Check out this Python file + - + - - + + @@ -45228,260 +51175,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + + + + Component.tsx + + Component.tsx - - Component.tsx - - - - - TypeScript component + + TypeScript component + - + - - + + @@ -45724,260 +51742,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + + + + config.json + + config.json - - config.json - - - - - Configuration file + + Configuration file + - + - - + + @@ -46220,260 +52309,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - - + + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - main.go - - - - + main.go + + + - - This is the - - main + This is the - - - entry point for the application + "backgroundColor": "transparent", + "fontFamily": "Inter", + "fontWeight": "700", + "textAlign": "left", + } + } + > + + main + + + + entry point for the application + - + - - - - File with description + + File with description + - + - - + + @@ -46793,67 +52953,73 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + } + testID="message-undefined" + > + + @@ -46872,246 +53038,264 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna } > + + + document.pdf + + document.pdf - - document.pdf - - - + + + image.png + + image.png - - image.png - @@ -47119,16 +53303,16 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna - - - - + /> + + + @@ -47173,260 +53357,318 @@ exports[`Story Snapshots: FileAttachmentsWithFilenamesLargeFont should match sna style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - + - File.pdf + + File.pdf + - + - - - - + - File.pdf + + File.pdf + - + - - - - multi file + + multi file + - + - - + + @@ -47832,324 +54092,390 @@ exports[`Story Snapshots: FullName should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - - + + + Diego Mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Message + + Message + - + - - + + @@ -48207,324 +54533,390 @@ exports[`Story Snapshots: FullNameLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - + + + + Diego Mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Message + + Message + - + - - + + @@ -48582,324 +54974,390 @@ exports[`Story Snapshots: GroupedMessages should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + - - - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - ... + + ... + - + - - + + @@ -48944,324 +55402,390 @@ exports[`Story Snapshots: GroupedMessages should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Different user + + Different user + - + - - + + @@ -49306,141 +55830,155 @@ exports[`Story Snapshots: GroupedMessages should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the third message + + This is the third message + - + - - - - + /> + + + @@ -49485,141 +56023,155 @@ exports[`Story Snapshots: GroupedMessages should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the second message + + This is the second message + - + - - - - + /> + + + @@ -49664,324 +56216,390 @@ exports[`Story Snapshots: GroupedMessages should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - - - + /> + + + + + + - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is the first message + + This is the first message + - + - - + + @@ -50039,324 +56657,390 @@ exports[`Story Snapshots: GroupedMessagesLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - ... + + ... + - + - - + + @@ -50401,324 +57085,390 @@ exports[`Story Snapshots: GroupedMessagesLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Different user + + Different user + - + - - + + @@ -50763,141 +57513,155 @@ exports[`Story Snapshots: GroupedMessagesLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the third message + + This is the third message + - + - - - - + /> + + + @@ -50942,141 +57706,155 @@ exports[`Story Snapshots: GroupedMessagesLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the second message + + This is the second message + - + - - - - + /> + + + @@ -51121,324 +57899,390 @@ exports[`Story Snapshots: GroupedMessagesLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - This is the first message + + This is the first message + - + - - + + @@ -51496,181 +58340,220 @@ exports[`Story Snapshots: Ignored should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Message ignored. Tap to display it. - + + Message ignored. Tap to display it. + + - - + + @@ -51729,181 +58612,220 @@ exports[`Story Snapshots: IgnoredLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Message ignored. Tap to display it. - + + Message ignored. Tap to display it. + + - - + + @@ -51962,310 +58884,376 @@ exports[`Story Snapshots: InlineKatex should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - xˆ2 + yˆ2 - zˆ2 + + + xˆ2 + yˆ2 - zˆ2 + - + - - + + @@ -52323,310 +59311,376 @@ exports[`Story Snapshots: InlineKatexLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + - - - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - xˆ2 + yˆ2 - zˆ2 + + + xˆ2 + yˆ2 - zˆ2 + - + - - + + @@ -52684,278 +59738,344 @@ exports[`Story Snapshots: Katex should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - + + + - - + + @@ -53013,278 +60133,344 @@ exports[`Story Snapshots: KatexArray should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - + + + - - + + @@ -53342,278 +60528,344 @@ exports[`Story Snapshots: KatexArrayLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - + + + - - + + @@ -53671,278 +60923,344 @@ exports[`Story Snapshots: KatexLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + - - - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - + + + - - + + @@ -54000,497 +61318,563 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + - - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - - • - - + + + • + + - Dogs + + Dogs + - - - - - • - - + + • + + - cats + + cats + - + - - - - - • - - + + • + + - cats + + cats + - + @@ -54498,8 +61882,8 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` - - + + @@ -54544,447 +61928,513 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - - 1 - . - - + + + 1 + . + + - Dogs + + Dogs + - - - - - 2 - . - - + + 2 + . + + - Cats + + Cats + - + @@ -54992,8 +62442,8 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` - - + + @@ -55038,357 +62488,423 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - - 1 - . - - + + + 1 + . + + - Dogs + + Dogs + - + @@ -55396,8 +62912,8 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` - - + + @@ -55442,183 +62958,197 @@ exports[`Story Snapshots: Lists should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - - - 2 - . - - + + + 2 + . + + - Cats + + Cats + - + - - - - + /> + + + @@ -55676,497 +63206,563 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + - - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - - • - - + + + • + + - Dogs + + Dogs + - - - - - • - - + + • + + - cats + + cats + - + - - - - - • - - + + • + + - cats + + cats + - + @@ -56174,8 +63770,8 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` - - + + @@ -56220,447 +63816,513 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - - 1 - . - - + + + 1 + . + + - Dogs + + Dogs + - - - - - 2 - . - - + + 2 + . + + - Cats + + Cats + - + @@ -56668,8 +64330,8 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` - - + + @@ -56714,357 +64376,423 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - - - 1 - . - - + + + 1 + . + + - Dogs + + Dogs + - + @@ -57072,8 +64800,8 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` - - + + @@ -57118,183 +64846,197 @@ exports[`Story Snapshots: ListsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - - - 2 - . - - + + + 2 + . + + - Cats + + Cats + - + - - - - + /> + + + @@ -57352,324 +65094,390 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - + + + Long name user looooong name user + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - this is a normal message + + this is a normal message + - + - - + + @@ -57714,360 +65522,426 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - + - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + 10:00 AM + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Edited message + + Edited message + - + - - + + @@ -58112,360 +65986,426 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - Long name user looooong name user - - + - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + 10:00 AM + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Translated message + + Translated message + - + - - + + @@ -58510,395 +66450,462 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - + - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + 10:00 AM + + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Encrypted message + + Encrypted message + - + - - + + @@ -58959,80 +66966,105 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` } testID="avatar" > - - + + - + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> + + - - - Long name user looooong name user - - + - 10:00 AM - - + + Long name user looooong name user + + + 10:00 AM + + + - - + - + + /> + + + + - - - - Long name user looooong name user - - - 10:00 AM - - - - + -  - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + 10:00 AM + + + +  + + + + + + - Message with read receipt + + Message with read receipt + - + - - + + @@ -59726,309 +67852,405 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - + - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + 10:00 AM + + + + + onBlur={[Function]} + onClick={[Function]} + onFocus={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "paddingLeft": 5, + } + } + > + +  + + -  +  - -  - - - - - Message with read receipt + + Message with read receipt + - + - - + + @@ -60206,80 +68399,105 @@ exports[`Story Snapshots: LongNameUser should match snapshot 1`] = ` } testID="avatar" > - - + + - + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> + + - - - Long name user looooong name user - - + - 10:00 AM - - + + Long name user looooong name user + + + 10:00 AM + + + - - + - + + /> + + + + - - - - Long name user looooong name user - + + + + Long name user looooong name user + + + + + + 10:00 AM + - - - 10:00 AM - - - - - this is a normal message + + this is a normal message + - + - - + + @@ -61878,360 +70195,426 @@ exports[`Story Snapshots: LongNameUserLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - - + + + + Long name user looooong name user + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Edited message + + Edited message + - + - - + + @@ -62276,360 +70659,426 @@ exports[`Story Snapshots: LongNameUserLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - Long name user looooong name user - - - + + + + Long name user looooong name user + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - - - - + + + - Translated message + + Translated message + - + - - + + @@ -62674,395 +71123,462 @@ exports[`Story Snapshots: LongNameUserLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Long name user looooong name user - - - - + + + Long name user looooong name user + + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Encrypted message + + Encrypted message + - + - - + + @@ -63123,80 +71639,105 @@ exports[`Story Snapshots: LongNameUserLargeFont should match snapshot 1`] = ` } testID="avatar" > - - + + + - + style={ + { + "borderRadius": 4, + "height": 46.800000000000004, + "width": 46.800000000000004, + } + } + transition={null} + width={46.800000000000004} + /> + + - - + - Long name user looooong name user - - + + Long name user looooong name user + + + - - + + + + + + + + + + + - + + + + + Long name user looooong name user + + + + + +  + + + + + 10:00 AM + + + + + + + + Message with read receipt + + + + + + + + + + + + + + + + + + + + + + + + + + underlayColor="#E4E7EA" + > + + + + + - - - - Long name user looooong name user - - - - + -  - - - - - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + Long name user looooong name user + + + + + +  + + +  + + + + + 10:00 AM + + + + - Message with read receipt + + Message with read receipt + - + - - + + - - + - + + + + + + + + + + - + + + + Long name user looooong name user + + + + - - - - - - - - - - Long name user looooong name user - - - - - -  - - - -  - - - - - 10:00 AM - - - - - - - - Message with read receipt - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Long name user looooong name user - - - - - - + - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - rocket.cat - - - - - - diego.mello - - - - - - all - - - - - - here - - - - - - general - - - - - team + + rocket.cat + + + + + + diego.mello + + + + + + all + + + + + + here + + + + + + general + + + + + + team + - + - - + + @@ -66221,485 +75047,551 @@ exports[`Story Snapshots: Mentions should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - rocket.cat - - - Lorem ipsum dolor - - - diego.mello - - - sit amet, - - - all - - - consectetur adipiscing - - - here - - - elit, sed do eiusmod tempor - - - general - - - incididunt ut labore et dolore magna aliqua. + + rocket.cat + + + Lorem ipsum dolor + + + diego.mello + + + sit amet, + + + all + + + consectetur adipiscing + + + here + + + elit, sed do eiusmod tempor + + + general + + + incididunt ut labore et dolore magna aliqua. + - + - - + + @@ -66757,503 +75649,569 @@ exports[`Story Snapshots: MentionsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - - - - - - - - - diego.mello - - - - - - 10:00 AM - - - - - - - rocket.cat - - - - - - diego.mello - - - - - - all - - - - - - here - - - - - - general - - - - + /> + + + + + + + + + + + + + + diego.mello + + + + + + + 10:00 AM + + + + + - team + + rocket.cat + + + + + + diego.mello + + + + + + all + + + + + + here + + + + + + general + + + + + + team + - + - - + + @@ -67298,485 +76256,551 @@ exports[`Story Snapshots: MentionsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - + + + + + diego.mello + + + + + + - - diego.mello - - + 10:00 AM + - - - 10:00 AM - - - - - rocket.cat - - - Lorem ipsum dolor - - - diego.mello - - - sit amet, - - - all - - - consectetur adipiscing - - - here - - - elit, sed do eiusmod tempor - - - general - - - incididunt ut labore et dolore magna aliqua. + + rocket.cat + + + Lorem ipsum dolor + + + diego.mello + + + sit amet, + + + all + + + consectetur adipiscing + + + here + + + elit, sed do eiusmod tempor + + + general + + + incididunt ut labore et dolore magna aliqua. + - + - - + + @@ -67834,264 +76858,330 @@ exports[`Story Snapshots: Message should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + @@ -68149,326 +77239,384 @@ exports[`Story Snapshots: MessageWithNestedReplyAndFile should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Forwarded message with file inside + + Forwarded message with file inside + - + - - - - rocket.cat - - - 10:00 AM - + + rocket.cat + + + 10:00 AM + + @@ -68596,8 +77757,8 @@ exports[`Story Snapshots: MessageWithNestedReplyAndFile should match snapshot 1` - - + + @@ -68642,326 +77803,384 @@ exports[`Story Snapshots: MessageWithNestedReplyAndFile should match snapshot 1` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Forwarded message with nested image + + Forwarded message with nested image + - + - - - - rocket.cat - - - + + rocket.cat + + - - Nested image from forwarded message + + Nested image from forwarded message + - - - + - - + - + - + -  - - - +  + + + + /> + @@ -69299,8 +78532,8 @@ exports[`Story Snapshots: MessageWithNestedReplyAndFile should match snapshot 1` - - + + @@ -69358,355 +78591,421 @@ exports[`Story Snapshots: MessageWithReadReceipt should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - + -  - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + +  + + + + + + - I'm fine! + + I'm fine! + - + - - + + @@ -69751,172 +79050,186 @@ exports[`Story Snapshots: MessageWithReadReceipt should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - I'm fine! + + I'm fine! + - + - - - + -  - + {}, + ] + } + testID="read-receipt-unread" + > +  + + - - + + @@ -69961,355 +79274,421 @@ exports[`Story Snapshots: MessageWithReadReceipt should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - + -  - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + +  + + + + + + - + - I'm fine! + + I'm fine! + - + - - + + @@ -70354,172 +79733,186 @@ exports[`Story Snapshots: MessageWithReadReceipt should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - I'm fine! + + I'm fine! + - + - - - + -  - + {}, + ] + } + testID="read-receipt-read" + > +  + + - - + + @@ -70577,355 +79970,421 @@ exports[`Story Snapshots: MessageWithReadReceiptLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + -  - - - - - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + +  + + + + + 10:00 AM + + + + - I'm fine! + + I'm fine! + - + - - + + @@ -70970,172 +80429,186 @@ exports[`Story Snapshots: MessageWithReadReceiptLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - I'm fine! + + I'm fine! + - + - - - + -  - + {}, + ] + } + testID="read-receipt-unread" + > +  + + - - + + @@ -71180,355 +80653,421 @@ exports[`Story Snapshots: MessageWithReadReceiptLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + -  - - - - - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + +  + + + + + 10:00 AM + + + + - I'm fine! + + I'm fine! + - + - - + + @@ -71573,172 +81112,186 @@ exports[`Story Snapshots: MessageWithReadReceiptLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - I'm fine! + + I'm fine! + - + - - - + -  - + {}, + ] + } + testID="read-receipt-read" + > +  + + - - + + @@ -71796,260 +81349,318 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - + - - I'm a very long long title and I'll break - - - - + I'm a very long long title and I'll break + + + - How are you? + + How are you? + - + - - - - I'm fine! + + I'm fine! + - + - - + + @@ -72325,260 +81949,318 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - rocket.cat - - - - + rocket.cat + + + - How are you? - - - + How are you? + + - + > + + + - + - - - - rocket.cat - - - - + rocket.cat + + + - How are you? - - - + How are you? + + - + > + + + - + - - - - Reply attachment can have a description + + Reply attachment can have a description + - + - - - - I'm fine! + + I'm fine! + - + - - + + @@ -73160,326 +82860,384 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Looks cool! + + Looks cool! + - + - - - - rocket.cat - - - - - - - - What you think about this one? - - - - - + rocket.cat + + + + - + > + + + What you think about this one? + + + + + + - + - + -  - - - +  + + + + /> + @@ -73817,8 +83589,8 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` - - + + @@ -73863,326 +83635,384 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Yes, I am + + Yes, I am + - + - - - - rocket.cat - - - + + rocket.cat + + - - Are you seeing this mario - - - + Are you seeing this mario + + + + + - - - ? + > + ? + - - - + - - + - + - + -  - - - +  + + + + /> + @@ -74583,8 +84427,8 @@ exports[`Story Snapshots: MessageWithReply should match snapshot 1`] = ` - - + + @@ -74642,260 +84486,318 @@ exports[`Story Snapshots: MessageWithReplyAndFile should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - + + diego.mello + + + 10:00 AM + + + + - - + /> + - - rocket.cat - + + rocket.cat + + + script.sh + + script.sh - - script.sh - - - - - Here is the file + + Here is the file + - + - - + + @@ -75158,450 +85073,493 @@ exports[`Story Snapshots: MessageWithReplyAndFile should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - + /> + + diego.mello + + + 10:00 AM + + + + + + + + - - rocket.cat - - - config.yaml - - - - + rocket.cat + + + config.yaml + + + - - This is a configuration file with - - important + This is a configuration file with - - - settings + "backgroundColor": "transparent", + "fontFamily": "Inter", + "fontWeight": "700", + "textAlign": "left", + } + } + > + + important + + + + settings + - + - - - - Got it! + + Got it! + - + - - + + @@ -75751,260 +85737,318 @@ exports[`Story Snapshots: MessageWithReplyAndFile should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - rocket.cat - + + rocket.cat + + + index.ts + + index.ts - - index.ts - - - - - rocket.cat - + + rocket.cat + + + styles.css + + styles.css - - styles.css - - - - - Multiple files + + Multiple files + - + - - + + @@ -76426,260 +86488,318 @@ exports[`Story Snapshots: MessageWithReplyAndFileLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - + + rocket.cat + + + script.sh + + script.sh - - script.sh - - - - - Here is the file + + Here is the file + - + - - + + @@ -76942,260 +87075,318 @@ exports[`Story Snapshots: MessageWithReplyAndFileLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - + - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - - - config.yaml - - - - + rocket.cat + + + config.yaml + + + - - This is a configuration file with - - important + This is a configuration file with - - - settings + "backgroundColor": "transparent", + "fontFamily": "Inter", + "fontWeight": "700", + "textAlign": "left", + } + } + > + + important + + + + settings + - + - - - - Got it! + + Got it! + - + - - + + @@ -77535,260 +87739,318 @@ exports[`Story Snapshots: MessageWithReplyAndFileLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - + + rocket.cat + + + index.ts + + index.ts - - index.ts - - - - - rocket.cat - + + rocket.cat + + + styles.css + + styles.css - - styles.css - - - - - Multiple files + + Multiple files + - + - - + + @@ -78210,260 +88490,318 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - I'm a very long long title and I'll break - - - - + I'm a very long long title and I'll break + + + - How are you? + + How are you? + - + - - - - I'm fine! + + I'm fine! + - + - - + + @@ -78739,260 +89090,318 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - - - - + rocket.cat + + + - How are you? - - - + How are you? + + - + > + + + - + - - - - I'm fine! + + I'm fine! + - + - - + + @@ -79314,326 +89736,384 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Looks cool! + + Looks cool! + - + - - - - rocket.cat - - - + + rocket.cat + + - - What you think about this one? + + What you think about this one? + - - - + - - + - + - + -  - - - +  + + + + /> + @@ -79971,8 +90465,8 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = - - + + @@ -80017,326 +90511,384 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Yes, I am + + Yes, I am + - + - - - - - - rocket.cat - - + "flexDirection": "row", + }, + { + "borderColor": "#CBCED1", + }, + ] + } + testID="reply-rocket.cat-" + > + + + + rocket.cat + + - - Are you seeing this mario - - - + Are you seeing this mario + + + + + - - - ? + > + ? + - - - + - - + - + - + -  - - - +  + + + + /> + @@ -80737,8 +91303,8 @@ exports[`Story Snapshots: MessageWithReplyLargeFont should match snapshot 1`] = - - + + @@ -80796,586 +91362,676 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - How are you? + + How are you? + - + - - - - View thread - - - + + View thread + + - + -  - - +  + + + 1 + + + - 1 - + +  + + + 0 + + - -  - - + - 0 - - - - - - - -  - + "backgroundColor": "#E4E7EA", + "borderBottomLeftRadius": undefined, + "borderBottomRightRadius": undefined, + "borderRadius": undefined, + "borderTopLeftRadius": undefined, + "borderTopRightRadius": undefined, + "bottom": 0, + "left": 0, + "opacity": 0, + "position": "absolute", + "right": 0, + "top": 0, + } + } + /> + + +  + + + @@ -81383,8 +92039,8 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` - - + + @@ -81429,302 +92085,341 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - How are you? - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + How are you? - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -81770,302 +92465,341 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + + +  + + -  + Thread with emoji :) 😂 - - - Thread with emoji :) 😂 - - - + -  - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - + + /> + + + + - - - - + - + - I'm fine! - + + I'm fine! + + - - + + @@ -82111,302 +92845,341 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -82426,328 +93199,367 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` { "busy": undefined, "checked": undefined, - "disabled": false, - "expanded": undefined, - "selected": undefined, - } - } - accessibilityValue={ - { - "max": undefined, - "min": undefined, - "now": undefined, - "text": undefined, - } - } - accessible={true} - collapsable={false} - focusable={true} - onClick={[Function]} - onResponderGrant={[Function]} - onResponderMove={[Function]} - onResponderRelease={[Function]} - onResponderTerminate={[Function]} - onResponderTerminationRequest={[Function]} - onStartShouldSetResponder={[Function]} - style={ - { - "backgroundColor": undefined, - "opacity": 1, - } - } - > - - - - -  - - - - How are you? - - - -  - - - + "disabled": false, + "expanded": undefined, + "selected": undefined, + } + } + accessibilityValue={ + { + "max": undefined, + "min": undefined, + "now": undefined, + "text": undefined, + } + } + accessible={true} + collapsable={false} + focusable={true} + onClick={[Function]} + onResponderGrant={[Function]} + onResponderMove={[Function]} + onResponderRelease={[Function]} + onResponderTerminate={[Function]} + onResponderTerminationRequest={[Function]} + onStartShouldSetResponder={[Function]} + style={ + { + "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, + "opacity": 1, + } + } + > + + +  + + + - + + - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + + - + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + @@ -82793,302 +93605,341 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + + - + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + @@ -83134,278 +93985,317 @@ exports[`Story Snapshots: MessageWithThread should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + + +  + + -  + Thread with attachment - - - Thread with attachment - - - + -  - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - + + /> + + + + - - - - - + style={ + { + "flex": 1, + "marginLeft": 10, + } + } + > + + + + @@ -83464,586 +94354,676 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - How are you? + + How are you? + - + - - - - View thread - - - + + View thread + + - + -  - - +  + + + 1 + + + - 1 - + +  + + + 0 + + - -  - - + - 0 - - - - - - - -  - + "backgroundColor": "#E4E7EA", + "borderBottomLeftRadius": undefined, + "borderBottomRightRadius": undefined, + "borderRadius": undefined, + "borderTopLeftRadius": undefined, + "borderTopRightRadius": undefined, + "bottom": 0, + "left": 0, + "opacity": 0, + "position": "absolute", + "right": 0, + "top": 0, + } + } + /> + + +  + + + @@ -84051,8 +95031,8 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = - - + + @@ -84097,302 +95077,341 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - How are you? - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + How are you? - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -84438,302 +95457,341 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Thread with emoji :) 😂 - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  - - - - - - - + + - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -84779,302 +95837,341 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + + + + + + + + I'm fine! + + - - + + @@ -85120,302 +96217,341 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - How are you? - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + How are you? - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + + - + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + @@ -85461,302 +96597,341 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + + - + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + @@ -85802,278 +96977,317 @@ exports[`Story Snapshots: MessageWithThreadLargeFont should match snapshot 1`] = style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + + +  + + -  + Thread with attachment - - - Thread with attachment - - - + -  - + [ + { + "lineHeight": 26, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - + + /> + + + + - - - - - + style={ + { + "flex": 1, + "marginLeft": 10, + } + } + > + + + + @@ -86132,354 +97346,420 @@ exports[`Story Snapshots: Pinned should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - + -  - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + +  + + + + + + - Message header + + Message header + - + - - + + @@ -86524,171 +97804,185 @@ exports[`Story Snapshots: Pinned should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Message without header + + Message without header + - + - - - + -  - + {}, + ] + } + testID="Message without header-pinned" + > +  + + - - + + @@ -86746,354 +98040,420 @@ exports[`Story Snapshots: PinnedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - + -  - - - - - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + +  + + + + + 10:00 AM + + + + - Message header + + Message header + - + - - + + @@ -87138,171 +98498,185 @@ exports[`Story Snapshots: PinnedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Message without header + + Message without header + - + - - - + -  - + {}, + ] + } + testID="Message without header-pinned" + > +  + + - - + + @@ -87360,833 +98734,924 @@ exports[`Story Snapshots: Reactions should match snapshot 1`] = ` style={ { "backgroundColor": undefined, - "opacity": 1, - } - } - > - + - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - - + - - Reactions - + diego.mello - - + + 10:00 AM + + + + - - 😂 - - 1 + + + Reactions + + - + + 😂 + + + 1 + + + + - + - 99 - + + + 99 + + - - - - - 🤔 - - - 999 - + + 🤔 + + + 999 + + - - - - - 🤔 - - - 9999 - + + 🤔 + + + 9999 + + - - - - -  - + +  + + - - + + @@ -88231,1261 +99696,1372 @@ exports[`Story Snapshots: Reactions should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - - + - - Multiple Reactions - + diego.mello - - + + 10:00 AM + + + + - - 1 + + + Multiple Reactions + + - - - 1 - + + + 1 + + - - - - + + + 1 + + + + - + - 1 - + + + 1 + + - - - - - ❤️ - - - 1 - + + ❤️ + + + 1 + + - - - - - 🐶 - - - 1 - + + 🐶 + + + 1 + + - - - - - 😀 - - - 1 - + + 😀 + + + 1 + + - - - - - 😬 - - - 1 - + + 😬 + + + 1 + + - - - - - 😁 - - - 1 - + + 😁 + + + 1 + + - - - - -  - + +  + + - - + + @@ -89543,833 +101119,924 @@ exports[`Story Snapshots: ReactionsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - - + - - Reactions - + diego.mello - - + + + + + 10:00 AM + - - 😂 - - 1 + + + Reactions + + - + + 😂 + + + 1 + + + + - + - 99 - + + + 99 + + - - - - - 🤔 - - - 999 - + + 🤔 + + + 999 + + - - - - - 🤔 - - - 9999 - + + 🤔 + + + 9999 + + - - - - -  - + +  + + - - + + @@ -90414,1261 +102081,1372 @@ exports[`Story Snapshots: ReactionsLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - - - - - - - - - diego.mello - - - - - - 10:00 AM - - - - - - - Multiple Reactions - - - + /> + + - + + + + + - - + + } + > - 1 + diego.mello - + + + + 10:00 AM + + + - - 1 + + + Multiple Reactions + + - + + + 1 + + + + - + - 1 - - - - + + + 1 + + + + - - - ❤️ - - - 1 - + + + 1 + + - - - - - 🐶 - - - 1 - + + ❤️ + + + 1 + + - - - - - 😀 - - - 1 - + + 🐶 + + + 1 + + - - - - - 😬 - - + 😀 + + + 1 + + + + + - 1 - + + 😬 + + + 1 + + - - - - - 😁 - - - 1 - + + 😁 + + + 1 + + - - - - -  - + +  + + - - + + @@ -91726,586 +103504,676 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButton should m style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - + - - How are you? + + How are you? + - + - - - - View thread - - - + + View thread + + - + -  - - +  + + + 1 + + + - 1 - + +  + + + 0 + + - -  - - + - 0 - - - - - - - -  - + "backgroundColor": "#E4E7EA", + "borderBottomLeftRadius": undefined, + "borderBottomRightRadius": undefined, + "borderRadius": undefined, + "borderTopLeftRadius": undefined, + "borderTopRightRadius": undefined, + "bottom": 0, + "left": 0, + "opacity": 0, + "position": "absolute", + "right": 0, + "top": 0, + } + } + /> + + +  + + + @@ -92313,8 +104181,8 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButton should m - - + + @@ -92359,185 +104227,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButton should m style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - - - - - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -92583,185 +104490,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButton should m style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + - - + + @@ -92807,161 +104753,200 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButton should m style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - - + style={ + { + "flex": 1, + "marginLeft": 10, + } + } + > + + + + @@ -93020,586 +105005,676 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButtonLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - How are you? + + How are you? + - + - - - - View thread - - - + + View thread + + - + -  - - +  + + + 1 + + + - 1 - + +  + + + 0 + + - -  - - - 0 - - - - - - - + -  - + + + +  + + + @@ -93607,8 +105682,8 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButtonLargeFont - - + + @@ -93653,185 +105728,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButtonLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - I'm fine! - + + I'm fine! + + - - + + @@ -93877,185 +105991,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButtonLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + - - + + @@ -94101,161 +106254,200 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadButtonLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > + + + + + + + + + + - - + - - - - - @@ -94314,302 +106506,341 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReply should ma style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + -  - - - - How are you? - - + [ + { + "lineHeight": 20, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + -  + How are you? - - - - - - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -94655,185 +106886,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReply should ma style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Cool! - + + Cool! + + - - + + @@ -94879,185 +107149,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReply should ma style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + - - + + @@ -95103,161 +107412,200 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReply should ma style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - - + style={ + { + "flex": 1, + "marginLeft": 10, + } + } + > + + + + @@ -95316,302 +107664,341 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReplyLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - -  - - - - How are you? - - - -  - - - - + +  + + + - + + - - + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + - - - I'm fine! - + + + + + - + + + + + I'm fine! + + + + + @@ -95657,185 +108044,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReplyLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - + - Cool! - + + Cool! + + - - + + @@ -95881,185 +108307,224 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReplyLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - - - - - - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - + + + + + - + + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + @@ -96105,161 +108570,200 @@ exports[`Story Snapshots: SequentialThreadMessagesFollowingThreadReplyLargeFont style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - + + /> + + + + - - - - - + style={ + { + "flex": 1, + "marginLeft": 10, + } + } + > + + + + @@ -96318,260 +108822,318 @@ exports[`Story Snapshots: ShowButtonAsAttachment should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Test Button + + Test Button + - - - + - - Text button - + + Text button + + - - + + @@ -96746,260 +109311,318 @@ exports[`Story Snapshots: ShowButtonAsAttachment should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - 🥑 - - - - + 🥑 + + - Message with markdown + + + + + Message with markdown + + + + + + + + + + Some text + - - - - + - Some text + This is a test - - + - - - This is a test - + Text button - - - - - Text button - + - - + + @@ -97352,260 +109978,318 @@ exports[`Story Snapshots: ShowButtonAsAttachmentLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - - Test Button - - - - - + + Test Button + + + + + - - Text button - + + Text button + + - - + + @@ -97780,260 +110467,318 @@ exports[`Story Snapshots: ShowButtonAsAttachmentLargeFont should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - - 🥑 - - - - + 🥑 + + - Message with markdown + + + + + Message with markdown + - - - + "height": 8, + } + } + /> + + + + Some text + + + + + + - Some text + This is a test - - + - - - This is a test - + Text button - - - - - Text button - + - - + + @@ -98386,324 +111134,390 @@ exports[`Story Snapshots: StaticAvatar should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Message + + Message + - + - - + + @@ -98761,324 +111575,390 @@ exports[`Story Snapshots: StaticAvatarLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - + + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Message + + Message + - + - - + + @@ -99151,80 +112031,105 @@ exports[`Story Snapshots: SystemMessages should match snapshot 1`] = ` } testID="avatar" > - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - - - + + + + - + - - + + + + - - - + + + + - - - + + + + - - - + + + + - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Temp message + + Temp message + - + - - + + @@ -109748,329 +123994,395 @@ exports[`Story Snapshots: TempLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Temp message + + Temp message + - + - - + + @@ -110128,260 +124440,318 @@ exports[`Story Snapshots: ThumbnailFromServer should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Title - - - - + Title + + + - Image text + + Image text + - + - - + transition={null} + width={80} + /> + - - - - this is a thumbnail + + this is a thumbnail + - + - - + + @@ -110709,260 +125092,318 @@ exports[`Story Snapshots: ThumbnailFromServerLargeFont should match snapshot 1`] style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - - + + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Title - - - - + Title + + + - Image text + + Image text + - + - - + transition={null} + width={80} + /> + - - - - this is a thumbnail + + this is a thumbnail + - + - - + + @@ -111290,324 +125744,390 @@ exports[`Story Snapshots: TimeFormat should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10 November 2017 + + + + - 10 November 2017 - + /> - - - - - Testing + + Testing + - + - - + + @@ -111665,324 +126185,390 @@ exports[`Story Snapshots: TimeFormatLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10 November 2017 + - - - 10 November 2017 - - - - - Testing + + Testing + - + - - + + @@ -112040,360 +126626,426 @@ exports[`Story Snapshots: Translated should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + - + -  - + [ + { + "lineHeight": 16, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - - Message translated + + Message translated + - + - - + + @@ -112451,360 +127103,426 @@ exports[`Story Snapshots: TranslatedLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - - + + /> + + + + - - - - diego.mello - - - + + + + diego.mello + + + - + -  - + [ + { + "lineHeight": 20.8, + }, + undefined, + ], + { + "fontFamily": "custom", + "fontStyle": "normal", + "fontWeight": "normal", + }, + {}, + ] + } + > +  + + - - - 10:00 AM - - + > + 10:00 AM + - - Message translated + + Message translated + - + - - + + @@ -112862,260 +127580,318 @@ exports[`Story Snapshots: TwoShortCustomFieldsWithMarkdown should match snapshot style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + + + - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 + + + Custom fields + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - - - rocket.cat - - - - - - - Custom fields 2 - - - - + } + > + + rocket.cat + + + - Field 1 + + + Custom fields 2 + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -113821,71 +128615,71 @@ exports[`Story Snapshots: TwoShortCustomFieldsWithMarkdown should match snapshot - - - - Message + + Message + - + - - + + @@ -113943,260 +128737,318 @@ exports[`Story Snapshots: TwoShortCustomFieldsWithMarkdownLargeFont should match style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - rocket.cat - - - - - - Custom fields - + rocket.cat - - - + - Field 1 + + + Custom fields + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + - - - - rocket.cat - - - - - - Custom fields 2 - - - - - + [ + { + "backgroundColor": "transparent", + "flexShrink": 1, + "fontFamily": "Inter", + "fontSize": 16, + "fontWeight": "500", + "textAlign": "left", + }, + { + "color": "#6C727A", + }, + ] + } + > + rocket.cat + + - Field 1 + + + Custom fields 2 + + + + + Field 1 + + - Value 1 + + Value 1 + - + - - - - Field 2 - - + Field 2 + + - Value 2 + + Value 2 + - + @@ -114902,71 +129772,71 @@ exports[`Story Snapshots: TwoShortCustomFieldsWithMarkdownLargeFont should match - - - - Message + + Message + - + - - + + @@ -115024,451 +129894,527 @@ exports[`Story Snapshots: URL should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + - - Rocket.Chat - Free, Open Source, Enterprise Team Chat - - - Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting. - - + /> - - Google - - + Rocket.Chat - Free, Open Source, Enterprise Team Chat + + + Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting. + + + + + - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -115513,463 +130459,534 @@ exports[`Story Snapshots: URL should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - - Message - - + - + Message + + - + > + + + - + - - - - Google - - - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -116014,175 +131031,194 @@ exports[`Story Snapshots: URL should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Google - - + - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - - - + /> + + + @@ -116240,358 +131276,429 @@ exports[`Story Snapshots: URLImagePreview should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Google - - + - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -116636,302 +131743,372 @@ exports[`Story Snapshots: URLImagePreview should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + /> + - - + + @@ -116989,358 +132166,429 @@ exports[`Story Snapshots: URLImagePreviewLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Google - - + - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -117385,302 +132633,372 @@ exports[`Story Snapshots: URLImagePreviewLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + + > + + - - + + @@ -117738,451 +133056,527 @@ exports[`Story Snapshots: URLLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Rocket.Chat - Free, Open Source, Enterprise Team Chat - - - Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting. - + + Rocket.Chat - Free, Open Source, Enterprise Team Chat + + + Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting. + + - - - - Google - - - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -118227,463 +133621,534 @@ exports[`Story Snapshots: URLLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Message - - - + Message + + - + > + + + - + - - - - - Google - - - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - + + @@ -118728,175 +134193,194 @@ exports[`Story Snapshots: URLLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Google - - + - Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. - + + Google + + + Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for. + + - - - - + /> + + + @@ -118954,343 +134438,409 @@ exports[`Story Snapshots: WithAlias should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - - @ - diego.mello - - - + + + Diego Mello + + @ + diego.mello + + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Message + + Message + - + - - + + @@ -119335,343 +134885,409 @@ exports[`Story Snapshots: WithAlias should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - + - @ - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - + Diego Mello + + @ + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Message + + Message + - + - - + + @@ -119729,343 +135345,409 @@ exports[`Story Snapshots: WithAliasLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - + - @ - diego.mello - - + + Diego Mello + + @ + diego.mello + + + + + + + 10:00 AM + - - - 10:00 AM - - - - - Message + + Message + - + - - + + @@ -120110,343 +135792,409 @@ exports[`Story Snapshots: WithAliasLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - Diego Mello - + - @ - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - + + Diego Mello + + @ + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - Message + + Message + - + - - + + @@ -120504,557 +136252,608 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - + /> - + - - This is a description - - - - - + }, + { + "color": "#6C727A", + }, + ] + } + > + 10:00 AM + + + + + -  + + + This is a description + + + + + - + > + +  + + - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + @@ -121121,8 +136935,8 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` - - + + @@ -121167,67 +136981,73 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -121248,298 +137068,306 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` - + + + + Header false + + + + + - - Header false +  - - - - - - -  - - - - + - - + + + + - @@ -121547,16 +137375,16 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` - - - - + /> + + + @@ -121601,136 +137429,142 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - multi file + + multi file + - + - - - -  - - - - - - - - - + > +  + - - - - - - - -  - - - - - - + + + + - + + + + + + +  + + + + + + + + + + @@ -122236,16 +138078,16 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` - - - - + /> + + + @@ -122290,67 +138132,73 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -122370,538 +138218,179 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` > - -  - - - - - - - - - - - - - - - - - This is a description +  - + - - - - - - - - -  - - - - - - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + - - -  + + + This is a description + + + + + - + > + +  + + - + + + + - + + + + + + +  + + + + + + + + + + @@ -123218,16 +139074,16 @@ exports[`Story Snapshots: WithAudio should match snapshot 1`] = ` - - - - + /> + + + @@ -123285,557 +139141,608 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - - - This is a description - - - - - + diego.mello + + + + + 10:00 AM + + + -  + + + This is a description + + + + + - + > + +  + + - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + @@ -123902,8 +139824,8 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` - - + + @@ -123948,141 +139870,155 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - First message + + First message + - + - - - - + /> + + + @@ -124127,67 +140063,73 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -124208,240 +140150,233 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` - + + + + This is a description + + + + + - - This is a description +  - - - - - - -  - - - - + - - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + @@ -124507,16 +140457,16 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` - - - - + /> + + + @@ -124561,67 +140511,73 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -124641,186 +140597,179 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` > - -  - - - - + +  + + + - - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + @@ -124886,16 +140850,16 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` - - - - + /> + + + @@ -124940,136 +140904,142 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - multi file + + multi file + - + - - - -  - - - - - - - - - + > +  + - - - - - - - - - This is a description - + /> - + + + - - + + -  + + + This is a description + + + + + - + > + +  + + - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + - - - -  - - - - + > + +  + + - + - - + + { + "backgroundColor": "#156FF5", + }, + ] + } + /> + + + @@ -125927,16 +141905,16 @@ exports[`Story Snapshots: WithAudioLargeFont should match snapshot 1`] = ` - - - - + /> + + + @@ -125994,260 +141972,318 @@ exports[`Story Snapshots: WithFile should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - + + + + + + + + + File.pdf + + + + + + + - - - - + - + - File.pdf - - - - - - - - - - - - This is a description - - - - + transition={null} + width={15} + /> + + - + - - + + @@ -126544,67 +142593,73 @@ exports[`Story Snapshots: WithFile should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -126623,333 +142678,190 @@ exports[`Story Snapshots: WithFile should match snapshot 1`] = ` } > - - - - - - - File.pdf - - - - - - - - - - - - This is a description - - - - - - - - - - - - + + + + + + File.pdf + + + + + + + + + + - + - + - File.pdf - - - - - + } + height={15} + nativeViewRef={"[React.ref]"} + onError={[Function]} + onLoad={[Function]} + onLoadStart={[Function]} + onProgress={[Function]} + placeholder={[]} + source={ + [ + { + "uri": "https://open.rocket.chat/emoji-custom/nyan_rocket.png", + }, + ] + } + style={ + { + "height": 15, + "width": 15, + } + } + transition={null} + width={15} + /> + + + - - - - This is a description - - + + - + + + File.pdf + + + + + + + + + + + + This is a description + + - + > + + + - + - - - - + /> + + + @@ -127163,260 +143236,318 @@ exports[`Story Snapshots: WithFileLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - + - File.pdf + + File.pdf + - + - - - - This is a description - - - + This is a description + + - + > + + + - + - - + + @@ -127713,67 +143857,73 @@ exports[`Story Snapshots: WithFileLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -127792,250 +143942,263 @@ exports[`Story Snapshots: WithFileLargeFont should match snapshot 1`] = ` } > + - - - + - File.pdf + + File.pdf + - + - - - - This is a description - - - + This is a description + + - + > + + + - + - - - - + /> + + + @@ -128093,260 +144256,318 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is a description - - - + This is a description + + - + > + + + - - - + - - + - + - + -  - - - +  + + + + /> + @@ -128625,8 +144855,8 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` - - + + @@ -128671,318 +144901,317 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - - + - - Message, not description - + diego.mello - - + + 10:00 AM + + + + - This is a description + Message, not description - - - - + + - + > + + + This is a description + + + + + + + + + - + - + -  - - - +  + + + + /> + - - + + + + + This is a description + + + + + + + + - - - - This is a description - + /> + - + > +  + - - + + + @@ -129525,170 +145982,12 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` - - - - - - -  - - - - - - - + + @@ -129733,391 +146032,438 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + - 10:00 AM - - - - - - + "alignItems": "center", + "flexDirection": "row", + "flexShrink": 1, + "gap": 4, + } + } + > + + diego.mello + + + 10:00 AM + + + + + + - - multi file + + multi file + - + - - - + - + - + -  - - - +  + + + + /> + - - - - + - + - + -  - - - +  + + + + /> + - - + + @@ -130419,440 +146786,487 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - + /> - + - - This is a description for Base64 Attachment - - - - - + }, + { + "color": "#6C727A", + }, + ] + } + > + 10:00 AM - + + + + + - + > + + + This is a description for Base64 Attachment + + + + + + + + + - + - + + + + - @@ -130938,8 +147372,8 @@ exports[`Story Snapshots: WithImage should match snapshot 1`] = ` - - + + @@ -130997,394 +147431,441 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - - - - 10:00 AM - - - - + /> - - - This is a description - - + diego.mello - + + + + 10:00 AM + + + + - + > + + + This is a description + + + + + + - + - + -  - - - +  + + + + /> + @@ -131483,8 +147984,8 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` - - + + @@ -131529,67 +148030,73 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -131610,123 +148117,112 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` - - Header false + + Header false + - - - + - - + - + - + -  - - - +  + + + + /> + - - - - + /> + + + @@ -131878,391 +148394,438 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - multi file + + multi file + - + - - - + - + - + -  - - - +  + + + + /> + - - - - + - + - + -  - - - +  + + + + /> + - - + + @@ -132564,260 +149148,318 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - This is a description for Base64 Attachment - - - + This is a description for Base64 Attachment + + - + > + + + - - - + - + - + - + + + + - @@ -133083,8 +149734,8 @@ exports[`Story Snapshots: WithImageLargeFont should match snapshot 1`] = ` - - + + @@ -133142,260 +149793,318 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is a description - - - + This is a description + + - - - - - + + + + + + - - + - + -  - + +  + + @@ -133634,8 +150352,8 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` - - + + @@ -133680,67 +150398,73 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + @@ -133761,190 +150485,199 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` - - Header false + + Header false + - - - + - - + - + -  - + +  + + - - - - + /> + + + @@ -133989,318 +150722,317 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - - 10:00 AM - - - - - - - - + - - multi file - + diego.mello - - + + 10:00 AM + + + + - - + -  + { + "color": "#2F343D", + }, + ] + } + > + multi file + - + + + + +  + + + + + + } + > + - + -  - + +  + + @@ -134565,8 +151366,8 @@ exports[`Story Snapshots: WithVideo should match snapshot 1`] = ` - - + + @@ -134624,260 +151425,318 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - This is a description - - - + This is a description + + - - - - - + + + + + + - - + - + -  - + +  + + @@ -135116,8 +151984,8 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` - - + + @@ -135162,260 +152030,318 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + - - - - 10:00 AM - - + > + 10:00 AM + - - + -  - + +  + + @@ -135553,8 +152488,8 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` - - + + @@ -135599,326 +152534,384 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - + + + + diego.mello + + + + + + 10:00 AM + - - - 10:00 AM - - - - - multi file + + multi file + - + - - - + - + -  - + +  + + - - - + - + -  - + +  + + @@ -136175,8 +153178,8 @@ exports[`Story Snapshots: WithVideoLargeFont should match snapshot 1`] = ` - - + + @@ -136234,141 +153237,155 @@ exports[`Story Snapshots: WithoutHeader should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Message + + Message + - + - - - - + /> + + + @@ -136426,141 +153443,155 @@ exports[`Story Snapshots: WithoutHeaderLargeFont should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Message + + Message + - + - - - - + /> + + + diff --git a/app/i18n/locales/en.json b/app/i18n/locales/en.json index 20adc12eb90..30c9e42d2c4 100644 --- a/app/i18n/locales/en.json +++ b/app/i18n/locales/en.json @@ -157,6 +157,7 @@ "Clear": "Clear", "Clear_cache": "Clear local workspace cache", "Clear_cache_loading": "Clearing cache.", + "Clear_input": "Clear input", "Click_to_join": "Click to join!", "Close": "Close", "Close_Chat": "Close chat", diff --git a/app/i18n/locales/pt-BR.json b/app/i18n/locales/pt-BR.json index cbd4dfb4eae..d49de81bafc 100644 --- a/app/i18n/locales/pt-BR.json +++ b/app/i18n/locales/pt-BR.json @@ -155,6 +155,7 @@ "Clear": "Limpar", "Clear_cache": "Limpar cache da workspace", "Clear_cache_loading": "Limpando cache.", + "Clear_input": "Limpar entrada", "Click_to_join": "Clique para participar!", "Close": "Fechar", "Close_Chat": "Fechar conversa", diff --git a/app/views/CannedResponsesListView/CannedResponseItem.tsx b/app/views/CannedResponsesListView/CannedResponseItem.tsx index a52d1e8e7d4..c03cc731b9b 100644 --- a/app/views/CannedResponsesListView/CannedResponseItem.tsx +++ b/app/views/CannedResponsesListView/CannedResponseItem.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { View, Text } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; +import Touch from '../../containers/Touch'; import { type TSupportedThemes } from '../../theme'; import { themes } from '../../lib/constants/colors'; import Button from '../../containers/Button'; @@ -27,7 +27,7 @@ const CannedResponseItem = ({ text, tags = [] }: ICannedResponseItem): JSX.Element => ( - + <> @@ -57,7 +57,7 @@ const CannedResponseItem = ({ : null} - + ); export default CannedResponseItem; diff --git a/app/views/CannedResponsesListView/__snapshots__/CannedResponseItem.test.tsx.snap b/app/views/CannedResponsesListView/__snapshots__/CannedResponseItem.test.tsx.snap index 1dbd0f7dc8a..660a41df1fd 100644 --- a/app/views/CannedResponsesListView/__snapshots__/CannedResponseItem.test.tsx.snap +++ b/app/views/CannedResponsesListView/__snapshots__/CannedResponseItem.test.tsx.snap @@ -2,659 +2,713 @@ exports[`Story Snapshots: Itens should match snapshot 1`] = ` [ - + - - ! - !FAQ4 - - + ! + !FAQ4 + + + Private + + + - Private - + + Use + + - + “ + ZCVXZVXCZVZXVZXCVZXCVXZCVZX + ” + + - - Use - - + /> - - “ - ZCVXZVXCZVZXVZXCVZXCVXZCVZX - ” - + , + - , - - - ! - test4mobilePrivate - - - Private - - - + ! + test4mobilePrivate + + + Private + + + - - Use - + + Use + + - - - “ - test for mobile private - ” - - - - + + - HQ - - - - + HQ + + + - Closed - - - - + Closed + + + - HQ - - - - + HQ + + + - Problem in Product Y - - - - + Problem in Product Y + + + - HQ - - - - + HQ + + + - Closed - - - - + Closed + + + - Problem in Product Y - + + Problem in Product Y + + - , + , ] `; diff --git a/app/views/ChangePasscodeView.tsx b/app/views/ChangePasscodeView.tsx index 39524612710..4088d1f6009 100644 --- a/app/views/ChangePasscodeView.tsx +++ b/app/views/ChangePasscodeView.tsx @@ -3,13 +3,13 @@ import { StyleSheet } from 'react-native'; import useDeepCompareEffect from 'use-deep-compare-effect'; import isEmpty from 'lodash/isEmpty'; import Modal from 'react-native-modal'; -import Touchable from 'react-native-platform-touchable'; import { hasNotch } from '../lib/methods/helpers'; import { PasscodeChoose } from '../containers/Passcode'; import EventEmitter from '../lib/methods/helpers/events'; import { CustomIcon } from '../containers/CustomIcon'; import { CHANGE_PASSCODE_EMITTER } from '../lib/constants/localAuthentication'; +import Touch from '../containers/Touch'; const styles = StyleSheet.create({ modal: { @@ -71,9 +71,9 @@ const ChangePasscodeView = React.memo(() => { {!data?.force ? ( - + - + ) : null} ); diff --git a/app/views/DiscussionsView/Item.tsx b/app/views/DiscussionsView/Item.tsx index 143b4da6841..abebf61d220 100644 --- a/app/views/DiscussionsView/Item.tsx +++ b/app/views/DiscussionsView/Item.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import dayjs from '../../lib/dayjs'; import { useTheme } from '../../theme'; @@ -10,6 +9,7 @@ import { MarkdownPreview } from '../../containers/markdown'; import { formatDateThreads, makeThreadName } from '../../lib/methods/helpers/room'; import DiscussionDetails from './DiscussionDetails'; import { type IMessageFromServer } from '../../definitions'; +import Touch from '../../containers/Touch'; const styles = StyleSheet.create({ container: { @@ -63,10 +63,7 @@ const Item = ({ item, onPress }: IItem): React.ReactElement => { } return ( - onPress(item)} - testID={`discussions-view-${item.msg}`} - style={{ backgroundColor: colors.surfaceRoom }}> + onPress(item)} testID={`discussions-view-${item.msg}`} style={{ backgroundColor: colors.surfaceRoom }}> @@ -82,7 +79,7 @@ const Item = ({ item, onPress }: IItem): React.ReactElement => { {messageDate ? : null} - + ); }; diff --git a/app/views/DiscussionsView/__snapshots__/Item.test.tsx.snap b/app/views/DiscussionsView/__snapshots__/Item.test.tsx.snap index dcca4852073..b2d3f5a30ac 100644 --- a/app/views/DiscussionsView/__snapshots__/Item.test.tsx.snap +++ b/app/views/DiscussionsView/__snapshots__/Item.test.tsx.snap @@ -16,332 +16,355 @@ exports[`Story Snapshots: Content should match snapshot 1`] = ` ] } /> - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Message content + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - + - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - - November 10, 2020 - - - - - - - + +  + + + + + +  + + + November 10, 2020 + + + + + + + + - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Message content + + + - -  - - - +999 - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + +999 + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - + - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Attachment title - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - - -  - - - + Attachment title + + + - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - + - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Message content + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - + - + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - - + rocket.cat + + + 10:00 AM + + + + + Message content + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - - + + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Message content + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - - + + - - - - - rocket.cat - - - 10:00 AM - + transition={null} + width={36} + /> - - Message content - - - + "justifyContent": "space-between", + "marginBottom": 2, + } + } + > + + rocket.cat + + + 10:00 AM + + - + Message content + + + - -  - - - + "marginTop": 8, + }, + ] + } + > - -  - - +  + + + + - November 10, 2020 - + +  + + + November 10, 2020 + + - + - + - + ); }) diff --git a/app/views/RoomView/LoadMore/__snapshots__/LoadMore.test.tsx.snap b/app/views/RoomView/LoadMore/__snapshots__/LoadMore.test.tsx.snap index 642a5d044af..024d83bbc1a 100644 --- a/app/views/RoomView/LoadMore/__snapshots__/LoadMore.test.tsx.snap +++ b/app/views/RoomView/LoadMore/__snapshots__/LoadMore.test.tsx.snap @@ -89,7 +89,7 @@ exports[`Story Snapshots: Basic should match snapshot 1`] = ` activeOpacity={1} collapsable={false} delayLongPress={600} - enabled={false} + enabled={true} handlerTag={2} handlerType="NativeViewGestureHandler" innerRef={null} @@ -454,324 +454,390 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Hey! + + Hey! + - + - - + + @@ -816,141 +882,155 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - - - + /> + + + @@ -995,141 +1075,155 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Older message + + Older message + - + - - - - + /> + + + @@ -1139,7 +1233,7 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={6} + handlerTag={8} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -1222,7 +1316,7 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={7} + handlerTag={9} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -1340,324 +1434,390 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - + + @@ -1702,141 +1862,155 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the third message + + This is the third message + - + - - - - + /> + + + @@ -1881,141 +2055,155 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the second message + + This is the second message + - + - - - - + /> + + + @@ -2060,324 +2248,390 @@ exports[`Story Snapshots: BlackTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is the first message + + This is the first message + - + - - + + @@ -2400,7 +2654,7 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={8} + handlerTag={14} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -2518,324 +2772,390 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Hey! + + Hey! + - + - - + + @@ -2880,141 +3200,155 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - - - + /> + + + @@ -3059,141 +3393,155 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Older message + + Older message + - + - - - - + /> + + + @@ -3203,7 +3551,7 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={9} + handlerTag={17} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -3286,7 +3634,7 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={10} + handlerTag={18} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -3404,324 +3752,390 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - + + @@ -3766,141 +4180,155 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the third message + + This is the third message + - + - - - - + /> + + + @@ -3945,141 +4373,155 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the second message + + This is the second message + - + - - - - + /> + + + @@ -4124,324 +4566,390 @@ exports[`Story Snapshots: DarkTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is the first message + + This is the first message + - + - - + + @@ -4464,7 +4972,7 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={11} + handlerTag={23} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -4582,324 +5090,390 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - + - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Hey! + + Hey! + - + - - + + @@ -4944,141 +5518,155 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - - - + /> + + + @@ -5123,141 +5711,155 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - Older message + + Older message + - + - - - - + /> + + + @@ -5267,7 +5869,7 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={12} + handlerTag={26} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -5350,7 +5952,7 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` collapsable={false} delayLongPress={600} enabled={true} - handlerTag={13} + handlerTag={27} handlerType="NativeViewGestureHandler" innerRef={null} onActiveStateChange={[Function]} @@ -5468,324 +6070,390 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries + - + - - + + @@ -5830,141 +6498,155 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the third message + + This is the third message + - + - - - - + /> + + + @@ -6009,141 +6691,155 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + - - This is the second message + + This is the second message + - + - - - - + /> + + + @@ -6188,324 +6884,390 @@ exports[`Story Snapshots: LightTheme should match snapshot 1`] = ` style={ { "backgroundColor": undefined, + "borderRadius": undefined, + "margin": undefined, + "marginBottom": undefined, + "marginEnd": undefined, + "marginHorizontal": undefined, + "marginLeft": undefined, + "marginRight": undefined, + "marginStart": undefined, + "marginTop": undefined, + "marginVertical": undefined, "opacity": 1, } } > - - + - + + /> + + + + - - - - diego.mello - - + + + diego.mello + + + 10:00 AM + + + + - 10:00 AM - + /> - - - - - This is the first message + + This is the first message + - + - - + + diff --git a/app/views/ScreenLockedView.tsx b/app/views/ScreenLockedView.tsx index 672af98113e..0733998516c 100644 --- a/app/views/ScreenLockedView.tsx +++ b/app/views/ScreenLockedView.tsx @@ -2,7 +2,6 @@ import isEmpty from 'lodash/isEmpty'; import React, { useEffect, useState } from 'react'; import { StyleSheet } from 'react-native'; import Modal from 'react-native-modal'; -import Touchable from 'react-native-platform-touchable'; import useDeepCompareEffect from 'use-deep-compare-effect'; import { PasscodeEnter } from '../containers/Passcode'; @@ -10,6 +9,7 @@ import { LOCAL_AUTHENTICATE_EMITTER } from '../lib/constants/localAuthentication import { CustomIcon } from '../containers/CustomIcon'; import { hasNotch } from '../lib/methods/helpers'; import EventEmitter from '../lib/methods/helpers/events'; +import Touch from '../containers/Touch'; interface IData { submit?: () => void; @@ -75,9 +75,9 @@ const ScreenLockedView = (): JSX.Element => { animationOut='fadeOut'> {data?.force ? ( - + - + ) : null} ); diff --git a/app/views/ThreadMessagesView/Item.tsx b/app/views/ThreadMessagesView/Item.tsx index edeea31e46a..46d4c13102e 100644 --- a/app/views/ThreadMessagesView/Item.tsx +++ b/app/views/ThreadMessagesView/Item.tsx @@ -1,6 +1,5 @@ import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; -import Touchable from 'react-native-platform-touchable'; import { useTheme } from '../../theme'; import Avatar from '../../containers/Avatar'; @@ -10,6 +9,7 @@ import { MarkdownPreview } from '../../containers/markdown'; import { formatDateThreads, makeThreadName } from '../../lib/methods/helpers/room'; import ThreadDetails from '../../containers/ThreadDetails'; import { type TThreadModel } from '../../definitions'; +import Touch from '../../containers/Touch'; const styles = StyleSheet.create({ container: { @@ -74,7 +74,7 @@ const Item = ({ item, useRealName, user, badgeColor, onPress, toggleFollowThread } return ( - onPress(item)} testID={`thread-messages-view-${item.msg}`} style={{ backgroundColor: themes[theme].surfaceRoom }}> @@ -94,7 +94,7 @@ const Item = ({ item, useRealName, user, badgeColor, onPress, toggleFollowThread - + ); }; diff --git a/app/views/ThreadMessagesView/__snapshots__/Item.test.tsx.snap b/app/views/ThreadMessagesView/__snapshots__/Item.test.tsx.snap index abad0d4166c..ac9fa0f75d2 100644 --- a/app/views/ThreadMessagesView/__snapshots__/Item.test.tsx.snap +++ b/app/views/ThreadMessagesView/__snapshots__/Item.test.tsx.snap @@ -16,424 +16,471 @@ exports[`Story Snapshots: Badge should match snapshot 1`] = ` ] } /> - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + + - -  - - - 1 - - - - -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - - + + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + + - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - -  - - - 1 - - - - - - -  - + "backgroundColor": "#E4E7EA", + "borderBottomLeftRadius": undefined, + "borderBottomRightRadius": undefined, + "borderRadius": undefined, + "borderTopLeftRadius": undefined, + "borderTopRightRadius": undefined, + "bottom": 0, + "left": 0, + "opacity": 0, + "position": "absolute", + "right": 0, + "top": 0, + } + } + /> + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + - + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - + - - + height={36} + nativeViewRef={"[React.ref]"} + onError={[Function]} + onLoad={[Function]} + onLoadStart={[Function]} + onProgress={[Function]} + placeholder={[]} + priority="high" + source={ + [ + { + "headers": { + "User-Agent": "RC Mobile; ios unknown; vunknown (unknown)", + }, + "uri": "https://open.rocket.chat/avatar/rocket.cat?format=png&size=72", + }, + ] + } + style={ + { + "borderRadius": 4, + "height": 36, + "width": 36, + } + } + transition={null} + width={36} + /> + - - rocket.cat - - + rocket.cat + + + November 10, 2020 + + + - November 10, 2020 - - - - + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. + + + - Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. - - - - - + -  - - - 1 - - - - +  + + -  - - + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + - + Message content + + + + - + -  - - - +999 - - - - +  + + -  - - + +999 + + + - +999 - + +  + + + +999 + + - - - -  - + + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Attachment title - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + - + Attachment title + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - - - - - Rocket Cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + Rocket Cat + + + November 10, 2020 + + - + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - + - + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - - + + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - - + + - - - - - rocket.cat - - - November 10, 2020 - + transition={null} + width={36} + /> - - Message content - - - + "marginBottom": 2, + } + } + > + + rocket.cat + + + November 10, 2020 + + + + Message content + + + - -  - - - 1 - - + }, + { + "marginTop": 8, + }, + ] + } + > - + -  - - +  + + + 1 + + + - 1 - + +  + + + 1 + + - - - -  - + + + +  + + + - +