verdnatura-mirror/Rocket.Chat.ReactNative
verdnatura-mirror
/
Rocket.Chat.ReactNative
mirror of https://github.com/RocketChat/Rocket.Chat.ReactNative
2
0
Fork 1
Code Issues Packages Projects Releases Wiki Activity

chore: Merge 4.48.0 into single-server (#5672)

This commit is contained in:
Diego Mello 2024-04-30 13:44:24 -03:00 committed by GitHub
parent c00d768f88 83d433a2d5
commit 29ef8e2af7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
446 changed files with 9175 additions and 1698 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.detoxrc.js
View File

@ -19,13 +19,13 @@ module.exports = {
type: 'ios.app',
binaryPath: 'ios/build/Build/Products/Debug-iphonesimulator/Rocket.Chat Experimental.app',
build:
'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Debug -sdk iphonesimulator -derivedDataPath ios/build'
'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Debug -destination \'generic/platform=iphonesimulator\' -derivedDataPath ios/build'
},
'ios.release': {
type: 'ios.app',
binaryPath: 'ios/build/Build/Products/Release-iphonesimulator/Rocket.Chat Experimental.app',
build:
'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Release -sdk iphonesimulator -derivedDataPath ios/build'
'xcodebuild -workspace ios/RocketChatRN.xcworkspace -scheme RocketChatRN -configuration Release -destination \'generic/platform=iphonesimulator\' -derivedDataPath ios/build'
},
'android.debug': {
type: 'android.apk',

2
.storybook/preview.js
View File

@ -30,7 +30,7 @@ export const decorators = [
onReactionPress: () => {},
onDiscussionPress: () => {},
onReactionLongPress: () => {},
threadBadgeColor: themes.light.tunreadColor
threadBadgeColor: themes.light.fontInfo
}}
>
<Story />

2
__tests__/containers/Avatar/__snapshots__/Avatar.stories.storyshot
View File

@ -12,7 +12,7 @@ exports[`Storyshots Avatar Avatar Url 1`] = `"{\\"type\\":\\"View\\",\\"props\\"
exports[`Storyshots Avatar Channel 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4},null],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/@general?format=png&size=112\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}"`;
exports[`Storyshots Avatar Children 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4},null],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/Avatar?format=png&size=112\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":24,\\"color\\":\\"#f5455c\\"},[{\\"lineHeight\\":24},[{\\"width\\":24,\\"height\\":24,\\"textAlignVertical\\":\\"center\\"},[{\\"position\\":\\"absolute\\",\\"bottom\\":-2,\\"right\\":-2,\\"borderRadius\\":10}]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}"`;
exports[`Storyshots Avatar Children 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4},null],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/Avatar?format=png&size=112\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":24,\\"color\\":\\"#DA1F37\\"},[{\\"lineHeight\\":24},[{\\"width\\":24,\\"height\\":24,\\"textAlignVertical\\":\\"center\\"},[{\\"position\\":\\"absolute\\",\\"bottom\\":-2,\\"right\\":-2,\\"borderRadius\\":10}]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}"`;
exports[`Storyshots Avatar Custom Border Radius 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":28},null],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":56,\\"height\\":56,\\"borderRadius\\":28}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/Avatar?format=png&size=112\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]}"`;

8
__tests__/containers/BackgroundContainer/__snapshots__/index.stories.storyshot
View File

@ -2,13 +2,13 @@
exports[`Storyshots BackgroundContainer Basic 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_light\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]}]}"`;
exports[`Storyshots BackgroundContainer Black Theme Loading 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_black\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},\\"color\\":\\"#f9f9f9\\"},\\"children\\":null}]}"`;
exports[`Storyshots BackgroundContainer Black Theme Loading 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_black\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},\\"color\\":\\"#9EA2A8\\"},\\"children\\":null}]}"`;
exports[`Storyshots BackgroundContainer Black Theme Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_black\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#f9f9f9\\"}]},\\"children\\":[\\"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\\"]}]}"`;
exports[`Storyshots BackgroundContainer Black Theme Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_black\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9EA2A8\\"}]},\\"children\\":[\\"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\\"]}]}"`;
exports[`Storyshots BackgroundContainer Dark Theme Loading 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_dark\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},\\"color\\":\\"#f9f9f9\\"},\\"children\\":null}]}"`;
exports[`Storyshots BackgroundContainer Dark Theme Loading 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_dark\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},\\"color\\":\\"#9EA2A8\\"},\\"children\\":null}]}"`;
exports[`Storyshots BackgroundContainer Dark Theme Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_dark\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#f9f9f9\\"}]},\\"children\\":[\\"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\\"]}]}"`;
exports[`Storyshots BackgroundContainer Dark Theme Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_dark\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9EA2A8\\"}]},\\"children\\":[\\"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\\"]}]}"`;
exports[`Storyshots BackgroundContainer Loading 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessibilityIgnoresInvertColors\\":true,\\"style\\":{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\",\\"position\\":\\"absolute\\"}},\\"children\\":[{\\"type\\":\\"Image\\",\\"props\\":{\\"source\\":{\\"uri\\":\\"message_empty_light\\"},\\"style\\":[{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},{\\"width\\":\\"100%\\",\\"height\\":\\"100%\\"},null]},\\"children\\":null}]},{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"top\\":60,\\"left\\":0,\\"right\\":0,\\"fontSize\\":16,\\"paddingHorizontal\\":24,\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},\\"color\\":\\"#6C727A\\"},\\"children\\":null}]}"`;

12
__tests__/containers/Button/__snapshots__/Button.stories.storyshot
View File

@ -1,13 +1,13 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots Button Custom Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":false},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"purple\\",\\"padding\\":10,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"yellow\\",\\"fontSize\\":18},[{\\"textAlign\\":\\"left\\"}]]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Custom Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"purple\\",\\"padding\\":10,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"yellow\\",\\"fontSize\\":18},[{\\"textAlign\\":\\"left\\"}]]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Disabled Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#1d74f5\\",\\"opacity\\":0.3}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#ffffff\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Disabled Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#D1EBFE\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#CBCED1\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Disabled Loading Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#1d74f5\\",\\"opacity\\":0.3}},\\"children\\":[{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":[{\\"padding\\":16,\\"flex\\":1},null],\\"color\\":\\"#ffffff\\"},\\"children\\":null}]}"`;
exports[`Storyshots Button Disabled Loading Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#D1EBFE\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":[{\\"padding\\":16,\\"flex\\":1},null],\\"color\\":\\"#FFFFFF\\"},\\"children\\":null}]}"`;
exports[`Storyshots Button Loading Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#1d74f5\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":[{\\"padding\\":16,\\"flex\\":1},null],\\"color\\":\\"#ffffff\\"},\\"children\\":null}]}"`;
exports[`Storyshots Button Loading Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":true},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#D1EBFE\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"ActivityIndicator\\",\\"props\\":{\\"style\\":[{\\"padding\\":16,\\"flex\\":1},null],\\"color\\":\\"#FFFFFF\\"},\\"children\\":null}]}"`;
exports[`Storyshots Button Primary Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":false},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#1d74f5\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#ffffff\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Primary Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#156FF5\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#FFFFFF\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Secondary Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"accessibilityState\\":{\\"disabled\\":false},\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#ffffff\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;
exports[`Storyshots Button Secondary Button 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityLabel\\":\\"Press me!\\",\\"testID\\":\\"testButton\\",\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"paddingHorizontal\\":14,\\"justifyContent\\":\\"center\\",\\"height\\":48,\\"borderRadius\\":4,\\"marginBottom\\":12,\\"backgroundColor\\":\\"#E4E7EA\\",\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"textAlign\\":\\"center\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\",\\"fontSize\\":16},null]},\\"children\\":[\\"Press me!\\"]}]}"`;

10
__tests__/containers/Chip/__snapshots__/Chip.stories.storyshot
View File

@ -1,11 +1,11 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots Chip Chip Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Rocket.Cat\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#F2F3F5\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Rocket.Cat\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#2F343D\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip With Short Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Short\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip With Short Text 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#F2F3F5\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Short\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#2F343D\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Avatar 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Avatar\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Avatar 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":false},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#F2F3F5\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Avatar\\"]}]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":16,\\"color\\":\\"#2F343D\\"},[{\\"lineHeight\\":16},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Avatar And Icon 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":true},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Avatar and Icon\\"]}]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Avatar And Icon 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":true},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#F2F3F5\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Avatar and Icon\\"]}]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Icon 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":true},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#efeff4\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2f343d\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Icon\\"]}]}]}]}]}"`;
exports[`Storyshots Chip Chip Without Icon 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"accessibilityState\\":{\\"disabled\\":true},\\"focusable\\":true,\\"style\\":[{\\"paddingHorizontal\\":8,\\"marginRight\\":8,\\"borderRadius\\":4,\\"justifyContent\\":\\"center\\",\\"maxWidth\\":192},{\\"backgroundColor\\":\\"#F2F3F5\\"},null],\\"collapsable\\":false},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4},{\\"marginRight\\":8,\\"marginVertical\\":8}],\\"testID\\":\\"avatar\\"},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"overflow\\":\\"hidden\\"},{\\"width\\":28,\\"height\\":28,\\"borderRadius\\":4}]},\\"children\\":[{\\"type\\":\\"FastImageView\\",\\"props\\":{\\"style\\":{\\"position\\":\\"absolute\\",\\"left\\":0,\\"right\\":0,\\"top\\":0,\\"bottom\\":0},\\"source\\":{\\"uri\\":\\"https://open.rocket.chat/avatar/rocket.cat?format=png&size=56\\",\\"headers\\":{\\"User-Agent\\":\\"RC Mobile; ios unknown; vunknown (unknown)\\"},\\"priority\\":\\"high\\"},\\"resizeMode\\":\\"cover\\"},\\"children\\":null}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"marginRight\\":8,\\"maxWidth\\":120}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#2F343D\\"}],\\"numberOfLines\\":1},\\"children\\":[\\"Without Icon\\"]}]}]}]}]}"`;

2
__tests__/containers/CollapsibleText/__snapshots__/CollapsibleText.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots Collapsible Text Item 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"padding\\":20}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"Lorem ipsum dolor sit amet\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2f343d\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-Lorem ipsum dolor sit amet\\"},\\"children\\":[\\"Lorem ipsum dolor sit amet\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2f343d\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"},\\"children\\":[\\"linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2f343d\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"},\\"children\\":[\\"linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"]}]}"`;
exports[`Storyshots Collapsible Text Item 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"padding\\":20}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"Lorem ipsum dolor sit amet\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2F343D\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-Lorem ipsum dolor sit amet\\"},\\"children\\":[\\"Lorem ipsum dolor sit amet\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2F343D\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"},\\"children\\":[\\"linesToTruncate: 1 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"accessibilityLabel\\":\\"linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\",\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"textAlignVertical\\":\\"center\\"},{\\"color\\":\\"#2F343D\\",\\"height\\":0}],\\"testID\\":\\"collapsible-text-linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"},\\"children\\":[\\"linesToTruncate: 2 - Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam vel vestibulum neque. Proin dignissim neque in urna nec.\\"]}]}"`;

10
__tests__/containers/HeaderButton/__snapshots__/HeaderButtons.stories.storyshot
View File

File diff suppressed because one or more lines are too long

28
__tests__/containers/List/__snapshots__/List.stories.storyshot
View File

File diff suppressed because one or more lines are too long

4
__tests__/containers/LoginServices/__snapshots__/LoginServices.stories.storyshot
View File

File diff suppressed because one or more lines are too long

4
__tests__/containers/ReactionsList/__snapshots__/ReactionsList.stories.storyshot
View File

File diff suppressed because one or more lines are too long

10
__tests__/containers/RoomHeader/__snapshots__/RoomHeader.stories.storyshot
View File

File diff suppressed because one or more lines are too long

22
__tests__/containers/RoomItem/__snapshots__/RoomItem.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/containers/RoomTypeIcon/__snapshots__/RoomTypeIcon.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots RoomTypeIcon All 1`] = `"[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#cbced1\\"},[{\\"lineHeight\\":30},[{\\"width\\":30,\\"height\\":30,\\"textAlignVertical\\":\\"center\\"},[{\\"marginRight\\":4},null]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#2de0a5\\"},[{\\"lineHeight\\":30},[{\\"width\\":30,\\"height\\":30,\\"textAlignVertical\\":\\"center\\"},[{\\"marginRight\\":4},null]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#ffd21f\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#0d0e12\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},{\\"margin\\":10}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]"`;
exports[`Storyshots RoomTypeIcon All 1`] = `"[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":30},[{\\"width\\":30,\\"height\\":30,\\"textAlignVertical\\":\\"center\\"},[{\\"marginRight\\":4},null]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#158D65\\"},[{\\"lineHeight\\":30},[{\\"width\\":30,\\"height\\":30,\\"textAlignVertical\\":\\"center\\"},[{\\"marginRight\\":4},null]]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#AC892F\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":30,\\"color\\":\\"#1F2329\\"},[{\\"lineHeight\\":30},[{\\"marginRight\\":4},{\\"margin\\":10}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]"`;

2
__tests__/containers/SearchBox/__snapshots__/SearchBox.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots SearchBox Basic 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"testID\\":\\"searchbox\\",\\"style\\":{\\"backgroundColor\\":\\"#ffffff\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"marginBottom\\":10},{\\"margin\\":16,\\"marginBottom\\":16}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"relative\\",\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"TextInput\\",\\"props\\":{\\"style\\":[{\\"color\\":\\"#0d0e12\\"},[{\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"height\\":48,\\"fontSize\\":16,\\"paddingHorizontal\\":16,\\"paddingVertical\\":10,\\"borderWidth\\":1,\\"borderRadius\\":4},null,{\\"paddingRight\\":45},{\\"backgroundColor\\":\\"#ffffff\\",\\"borderColor\\":\\"#cbcbcc\\",\\"color\\":\\"#0d0e12\\"},null,null],{\\"textAlign\\":\\"auto\\"}],\\"placeholderTextColor\\":\\"#9ca2a8\\",\\"keyboardAppearance\\":\\"light\\",\\"autoCorrect\\":false,\\"autoCapitalize\\":\\"none\\",\\"underlineColorAndroid\\":\\"transparent\\",\\"accessibilityLabel\\":\\"Search\\",\\"placeholder\\":\\"Search\\",\\"value\\":\\"\\",\\"blurOnSubmit\\":true,\\"returnKeyType\\":\\"search\\"},\\"children\\":null},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#2f343d\\"},[{\\"lineHeight\\":20},[{\\"position\\":\\"absolute\\"},{\\"right\\":12}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;
exports[`Storyshots SearchBox Basic 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"testID\\":\\"searchbox\\",\\"style\\":{\\"backgroundColor\\":\\"#FFFFFF\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"marginBottom\\":10},{\\"margin\\":16,\\"marginBottom\\":16}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"position\\":\\"relative\\",\\"justifyContent\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"TextInput\\",\\"props\\":{\\"style\\":[{\\"color\\":\\"#1F2329\\"},[{\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\",\\"height\\":48,\\"fontSize\\":16,\\"paddingHorizontal\\":16,\\"paddingVertical\\":10,\\"borderWidth\\":1,\\"borderRadius\\":2},null,{\\"paddingRight\\":45},{\\"backgroundColor\\":\\"#FFFFFF\\",\\"borderColor\\":\\"#CBCED1\\",\\"color\\":\\"#1F2329\\"},null,null],{\\"textAlign\\":\\"auto\\"}],\\"placeholderTextColor\\":\\"#9EA2A8\\",\\"keyboardAppearance\\":\\"light\\",\\"autoCorrect\\":false,\\"autoCapitalize\\":\\"none\\",\\"underlineColorAndroid\\":\\"transparent\\",\\"accessibilityLabel\\":\\"Search\\",\\"placeholder\\":\\"Search\\",\\"value\\":\\"\\",\\"blurOnSubmit\\":true,\\"returnKeyType\\":\\"search\\"},\\"children\\":null},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":20,\\"color\\":\\"#2F343D\\"},[{\\"lineHeight\\":20},[{\\"position\\":\\"absolute\\"},{\\"right\\":12}]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}"`;

6
__tests__/containers/ServerItem/__snapshots__/ServerItem.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/containers/Status/__snapshots__/Status.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots Status All 1`] = `"[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#2de0a5\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#f5455c\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#ffd21f\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#9ea2a8\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#F38C39\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#cbced1\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#cbced1\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":60,\\"color\\":\\"#2de0a5\\"},[{\\"lineHeight\\":60},[{\\"width\\":60,\\"height\\":60,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]"`;
exports[`Storyshots Status All 1`] = `"[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#158D65\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#DA1F37\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#AC892F\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#F38C39\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":32,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":32},[{\\"width\\":32,\\"height\\":32,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":60,\\"color\\":\\"#158D65\\"},[{\\"lineHeight\\":60},[{\\"width\\":60,\\"height\\":60,\\"textAlignVertical\\":\\"center\\"},null]],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]"`;

10
__tests__/containers/TextInput/__snapshots__/TextInput.stories.storyshot
View File

File diff suppressed because one or more lines are too long

10
__tests__/containers/UnreadBadge/__snapshots__/UnreadBadge.stories.storyshot
View File

File diff suppressed because one or more lines are too long

24
__tests__/containers/markdown/__snapshots__/Markdown.stories.storyshot
View File

File diff suppressed because one or more lines are too long

24
__tests__/containers/markdown/new/__snapshots__/NewMarkdown.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/containers/message/Components/CollapsibleQuote/__snapshots__/CollapsibleQuote.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots CollapsibleQuote Item 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"padding\\":10}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"testID\\":\\"collapsibleQuoteTouchable-Engineering (9 today)\\",\\"hitSlop\\":{\\"top\\":4,\\"right\\":4,\\"bottom\\":4,\\"left\\":4},\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"marginTop\\":6,\\"borderWidth\\":1,\\"borderRadius\\":4,\\"minHeight\\":40,\\"backgroundColor\\":\\"#f3f4f5\\",\\"borderLeftColor\\":\\"#CBCED1\\",\\"borderTopColor\\":\\"#e1e5e8\\",\\"borderRightColor\\":\\"#e1e5e8\\",\\"borderBottomColor\\":\\"#e1e5e8\\",\\"borderLeftWidth\\":2,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"borderRadius\\":4,\\"padding\\":8}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"Engineering (9 today)\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"width\\":20,\\"height\\":20,\\"right\\":8,\\"top\\":8,\\"justifyContent\\":\\"center\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#6C727A\\"},[{\\"lineHeight\\":22},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}]}"`;
exports[`Storyshots CollapsibleQuote Item 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"padding\\":10}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"accessible\\":true,\\"testID\\":\\"collapsibleQuoteTouchable-Engineering (9 today)\\",\\"hitSlop\\":{\\"top\\":4,\\"right\\":4,\\"bottom\\":4,\\"left\\":4},\\"focusable\\":true,\\"collapsable\\":false,\\"style\\":{\\"flexDirection\\":\\"row\\",\\"alignItems\\":\\"center\\",\\"marginTop\\":6,\\"borderWidth\\":1,\\"borderRadius\\":4,\\"minHeight\\":40,\\"backgroundColor\\":\\"#F7F8FA\\",\\"borderLeftColor\\":\\"#CBCED1\\",\\"borderTopColor\\":\\"#EBECEF\\",\\"borderRightColor\\":\\"#EBECEF\\",\\"borderBottomColor\\":\\"#EBECEF\\",\\"borderLeftWidth\\":2,\\"opacity\\":1}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"borderRadius\\":4,\\"padding\\":8}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flexDirection\\":\\"row\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":16,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"Engineering (9 today)\\"]}]}]},{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"width\\":20,\\"height\\":20,\\"right\\":8,\\"top\\":8,\\"justifyContent\\":\\"center\\",\\"alignItems\\":\\"center\\"}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"selectable\\":false,\\"allowFontScaling\\":false,\\"style\\":[{\\"fontSize\\":22,\\"color\\":\\"#9EA2A8\\"},[{\\"lineHeight\\":22},null],{\\"fontFamily\\":\\"custom\\",\\"fontWeight\\":\\"normal\\",\\"fontStyle\\":\\"normal\\"},{}]},\\"children\\":[\\"\\"]}]}]}]}]}"`;

86
__tests__/containers/message/__snapshots__/Message.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/views/CannedResponsesListView/__snapshots__/CannedResponseItem.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
__tests__/views/CreateChannelView/RoomSettings/__snapshots__/SwitchItem.stories.storyshot
View File

@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Storyshots SwitchItem Switch 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"minHeight\\":54,\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"space-between\\",\\"flexDirection\\":\\"row\\",\\"maxHeight\\":80,\\"marginBottom\\":12},{\\"backgroundColor\\":\\"#ffffff\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"marginRight\\":8}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#0d0e12\\"}]},\\"children\\":[\\"[missing \\\\\\"en.Onboarding_title\\\\\\" translation]\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"testID\\":\\"create-channel-switch-id-hint\\",\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#9ca2a8\\"}]},\\"children\\":[\\"Only authorized users can write new messages\\"]}]},{\\"type\\":\\"RCTSwitch\\",\\"props\\":{\\"testID\\":\\"create-channel-switch-id\\",\\"disabled\\":false,\\"onTintColor\\":\\"#2de0a5\\",\\"style\\":{\\"height\\":31,\\"width\\":51},\\"tintColor\\":\\"#f5455c\\",\\"value\\":false,\\"accessibilityRole\\":\\"switch\\"},\\"children\\":null}]}]}"`;
exports[`Storyshots SwitchItem Switch 1`] = `"{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"alignItems\\":\\"flex-start\\",\\"padding\\":16}},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":[{\\"minHeight\\":54,\\"alignItems\\":\\"center\\",\\"justifyContent\\":\\"space-between\\",\\"flexDirection\\":\\"row\\",\\"maxHeight\\":80,\\"marginBottom\\":12},{\\"backgroundColor\\":\\"#FFFFFF\\"}]},\\"children\\":[{\\"type\\":\\"View\\",\\"props\\":{\\"style\\":{\\"flex\\":1,\\"marginRight\\":8}},\\"children\\":[{\\"type\\":\\"Text\\",\\"props\\":{\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"500\\"},{\\"color\\":\\"#1F2329\\"}]},\\"children\\":[\\"[missing \\\\\\"en.Onboarding_title\\\\\\" translation]\\"]},{\\"type\\":\\"Text\\",\\"props\\":{\\"testID\\":\\"create-channel-switch-id-hint\\",\\"style\\":[{\\"fontSize\\":14,\\"textAlign\\":\\"left\\",\\"backgroundColor\\":\\"transparent\\",\\"fontFamily\\":\\"Inter\\",\\"fontWeight\\":\\"400\\"},{\\"color\\":\\"#6C727A\\"}]},\\"children\\":[\\"Only authorized users can write new messages\\"]}]},{\\"type\\":\\"RCTSwitch\\",\\"props\\":{\\"testID\\":\\"create-channel-switch-id\\",\\"disabled\\":false,\\"onTintColor\\":\\"#0D5940\\",\\"style\\":{\\"height\\":31,\\"width\\":51},\\"tintColor\\":\\"#BB0B21\\",\\"value\\":false,\\"accessibilityRole\\":\\"switch\\"},\\"children\\":null}]}]}"`;

4
__tests__/views/DiscussionsView/__snapshots__/Item.stories.storyshot
View File

File diff suppressed because one or more lines are too long

8
__tests__/views/RoomView/LoadMore/__snapshots__/LoadMore.stories.storyshot
View File

File diff suppressed because one or more lines are too long

6
__tests__/views/ThreadMessagesView/__snapshots__/Item.stories.storyshot
View File

File diff suppressed because one or more lines are too long

2
android/app/build.gradle
View File

@ -147,7 +147,7 @@ android {
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode VERSIONCODE as Integer
versionName "4.47.2"
versionName "4.48.0"
vectorDrawables.useSupportLibrary = true
if (!isFoss) {
manifestPlaceholders = [BugsnagAPIKey: BugsnagAPIKey as String]

2
app/containers/ActionSheet/ActionSheet.tsx
View File

@ -161,7 +161,7 @@ const ActionSheet = React.memo(
handleComponent={renderHandle}
enablePanDownToClose
style={{ ...styles.container, ...bottomSheet }}
backgroundStyle={{ backgroundColor: colors.focusedBackground }}
backgroundStyle={{ backgroundColor: colors.surfaceLight }}
onChange={index => index === -1 && onClose()}
// We need this to allow horizontal swipe gesture inside the bottom sheet like in reaction picker
enableContentPanningGesture={data?.enableContentPanningGesture ?? true}

12
app/containers/ActionSheet/ActionSheetContentWithInputAndSubmit/index.tsx
View File

@ -48,13 +48,13 @@ const FooterButtons = ({
return (
<View style={styles.footerButtonsContainer}>
<Button
style={[styles.buttonSeparator, { flex: 1, backgroundColor: cancelBackgroundColor || colors.cancelButton }]}
style={[styles.buttonSeparator, { flex: 1, backgroundColor: cancelBackgroundColor || colors.buttonBackgroundSecondaryDefault }]}
color={colors.backdropColor}
title={cancelTitle}
onPress={cancelAction}
/>
<Button
style={{ flex: 1, backgroundColor: confirmBackgroundColor || colors.dangerColor }}
style={{ flex: 1, backgroundColor: confirmBackgroundColor || colors.buttonBackgroundDangerDefault }}
title={confirmTitle}
onPress={confirmAction}
disabled={disabled}
@ -100,12 +100,12 @@ const ActionSheetContentWithInputAndSubmit = ({
<View style={sharedStyles.containerScrollView} testID='action-sheet-content-with-input-and-submit'>
<>
<View style={styles.titleContainer}>
{iconName ? <CustomIcon name={iconName} size={32} color={iconColor || colors.dangerColor} /> : null}
<Text style={[styles.titleContainerText, { color: colors.passcodePrimary, paddingLeft: iconName ? 16 : 0 }]}>
{iconName ? <CustomIcon name={iconName} size={32} color={iconColor || colors.buttonBackgroundDangerDefault} /> : null}
<Text style={[styles.titleContainerText, { color: colors.fontDefault, paddingLeft: iconName ? 16 : 0 }]}>
{title}
</Text>
</View>
<Text style={[styles.subtitleText, { color: colors.titleText }]}>{description}</Text>
<Text style={[styles.subtitleText, { color: colors.fontTitlesLabels }]}>{description}</Text>
{customText}
</>
{showInput ? (
@ -126,7 +126,7 @@ const ActionSheetContentWithInputAndSubmit = ({
/>
) : null}
<FooterButtons
confirmBackgroundColor={confirmBackgroundColor || colors.actionTintColor}
confirmBackgroundColor={confirmBackgroundColor || colors.fontHint}
cancelAction={onCancel || hideActionSheet}
confirmAction={() => onSubmit(inputValue)}
cancelTitle={i18n.t('Cancel')}

8
app/containers/ActionSheet/BottomSheetContent.tsx
View File

@ -27,10 +27,10 @@ const BottomSheetContent = React.memo(({ options, hasCancel, hide, children, onL
hasCancel ? (
<Touch
onPress={hide}
style={[styles.button, { backgroundColor: colors.auxiliaryBackground }]}
style={[styles.button, { backgroundColor: colors.surfaceHover }]}
accessibilityLabel={I18n.t('Cancel')}
>
<Text style={[styles.text, { color: colors.bodyText }]}>{I18n.t('Cancel')}</Text>
<Text style={[styles.text, { color: colors.fontDefault }]}>{I18n.t('Cancel')}</Text>
</Touch>
) : null;
@ -45,10 +45,10 @@ const BottomSheetContent = React.memo(({ options, hasCancel, hide, children, onL
keyExtractor={item => item.title}
bounces={false}
renderItem={renderItem}
style={{ backgroundColor: colors.focusedBackground }}
style={{ backgroundColor: colors.strokeExtraDark }}
keyboardDismissMode='interactive'
indicatorStyle='black'
contentContainerStyle={{ paddingBottom: bottom }}
contentContainerStyle={{ paddingBottom: bottom, backgroundColor: colors.surfaceLight }}
ItemSeparatorComponent={List.Separator}
ListHeaderComponent={List.Separator}
ListFooterComponent={renderFooter}

2
app/containers/ActionSheet/Handle.tsx
View File

@ -9,7 +9,7 @@ export const Handle = React.memo(() => {
const { theme } = useTheme();
return (
<View style={styles.handle} testID='action-sheet-handle'>
<View style={[styles.handleIndicator, { backgroundColor: themes[theme].auxiliaryText }]} />
<View style={[styles.handleIndicator, { backgroundColor: themes[theme].fontSecondaryInfo }]} />
</View>
);
});

12
app/containers/ActionSheet/Item.tsx
View File

@ -27,19 +27,19 @@ export const Item = React.memo(({ item, hide }: IActionSheetItem) => {
}
};
let textColor = colors.bodyText;
let color = colors.fontDefault;
if (item.danger) {
textColor = colors.dangerColor;
color = colors.fontDanger;
}
if (!enabled) {
textColor = colors.fontDisabled;
color = colors.fontDisabled;
}
return (
<Touch onPress={onPress} style={[styles.item, { backgroundColor: colors.focusedBackground }]} testID={item.testID}>
{item.icon ? <CustomIcon name={item.icon} size={20} color={textColor} /> : null}
<Touch onPress={onPress} style={[styles.item, { backgroundColor: colors.surfaceLight }]} testID={item.testID}>
{item.icon ? <CustomIcon name={item.icon} size={20} color={color} /> : null}
<View style={styles.titleContainer}>
<Text numberOfLines={1} style={[styles.title, { color: textColor, marginLeft: item.icon ? 16 : 0 }]}>
<Text numberOfLines={1} style={[styles.title, { color, marginLeft: item.icon ? 16 : 0 }]}>
{item.title}
</Text>
</View>

2
app/containers/ActivityIndicator.tsx
View File

@ -27,7 +27,7 @@ const styles = StyleSheet.create({
const RCActivityIndicator = ({ absolute, ...props }: IActivityIndicator): React.ReactElement => {
const { theme } = useTheme();
return (
<ActivityIndicator style={[styles.indicator, absolute && styles.absolute]} color={themes[theme].auxiliaryText} {...props} />
<ActivityIndicator style={[styles.indicator, absolute && styles.absolute]} color={themes[theme].fontSecondaryInfo} {...props} />
);
};

2
app/containers/AppVersion.tsx
View File

@ -23,7 +23,7 @@ const styles = StyleSheet.create({
const AppVersion = React.memo(({ theme }: { theme: TSupportedThemes }) => (
<View style={styles.container}>
<Text style={[styles.text, { color: themes[theme].auxiliaryText }]}>
<Text style={[styles.text, { color: themes[theme].fontSecondaryInfo }]}>
{I18n.t('Version_no', { version: '' })}
<Text style={styles.bold}>{getReadableVersion}</Text>
</Text>

4
app/containers/AudioPlayer/PlayButton.tsx
View File

@ -31,10 +31,10 @@ const Icon = ({ audioState, disabled }: { audioState: TAudioState; disabled: boo
customIconName = 'play-shape-filled';
}
return <CustomIcon name={customIconName} size={24} color={disabled ? colors.tintDisabled : colors.buttonFontPrimary} />;
return <CustomIcon name={customIconName} size={24} color={disabled ? colors.buttonBackgroundPrimaryDisabled : colors.buttonFontPrimary} />;
};
const PlayButton = ({ onPress, disabled = false, audioState }: IButton) => {
const PlayButton = ({ onPress, disabled = false, audioState }: IButton): React.ReactElement => {
const { colors } = useTheme();
return (

2
app/containers/AudioPlayer/Seek.tsx
View File

@ -101,7 +101,7 @@ const Seek = ({ currentTime, duration, loaded = false, onChangeTime }: ISeek) =>
} as TextInputProps;
}, [timeLabel, duration, currentTime]);
const thumbColor = loaded ? colors.buttonBackgroundPrimaryDefault : colors.tintDisabled;
const thumbColor = loaded ? colors.buttonBackgroundPrimaryDefault : colors.buttonBackgroundPrimaryDisabled;
// TouchableNativeFeedback is avoiding do a long press message when seeking the audio
return (

3
app/containers/Avatar/AvatarWithEdit.tsx
View File

@ -69,12 +69,11 @@ const AvatarWithEdit = ({
<Button
title={I18n.t('Edit')}
type='secondary'
backgroundColor={colors.editAndUploadButtonAvatar}
onPress={handleEdit}
testID='avatar-edit-button'
style={styles.editAvatarButton}
styleText={styles.textButton}
color={colors.titleText}
color={colors.fontTitlesLabels}
hitSlop={BUTTON_HIT_SLOP}
/>
) : null}

4
app/containers/BackgroundContainer/index.tsx
View File

@ -36,8 +36,8 @@ const BackgroundContainer = ({ text, loading }: IBackgroundContainer): React.Rea
return (
<View style={styles.container}>
<ImageBackground source={{ uri: `message_empty_${theme}` }} style={styles.image} />
{text && !loading ? <Text style={[styles.text, { color: themes[theme].auxiliaryTintColor }]}>{text}</Text> : null}
{loading ? <ActivityIndicator style={styles.text} color={themes[theme].auxiliaryTintColor} /> : null}
{text && !loading ? <Text style={[styles.text, { color: themes[theme].fontHint }]}>{text}</Text> : null}
{loading ? <ActivityIndicator style={styles.text} color={themes[theme].fontHint} /> : null}
</View>
);
};

48
app/containers/Button/index.tsx
View File

@ -9,7 +9,7 @@ import ActivityIndicator from '../ActivityIndicator';
interface IButtonProps extends PlatformTouchableProps {
title: string;
onPress: () => void;
type?: string;
type?: string; // primary | secondary
backgroundColor?: string;
loading?: boolean;
color?: string;
@ -34,10 +34,10 @@ const styles = StyleSheet.create({
}
});
const Button = ({
const Button: React.FC<IButtonProps> = ({
type = 'primary',
disabled = false,
loading = false,
disabled,
loading,
fontSize = 16,
title,
onPress,
@ -46,33 +46,29 @@ const Button = ({
style,
styleText,
...otherProps
}: IButtonProps): React.ReactElement => {
}) => {
const { colors } = useTheme();
const isPrimary = type === 'primary';
const isDisabled = disabled || loading;
let textColor = isPrimary ? colors.buttonText : colors.bodyText;
if (color) {
textColor = color;
}
const defaultBackgroundColor = isPrimary ? colors.buttonBackgroundPrimaryDefault : colors.buttonBackgroundSecondaryDefault;
const disabledBackgroundColor = isPrimary ? colors.buttonBackgroundPrimaryDisabled : colors.buttonBackgroundSecondaryDisabled;
const resolvedBackgroundColor = backgroundColor || defaultBackgroundColor;
const resolvedTextColor = color || (isPrimary ? colors.fontWhite : colors.fontDefault);
const containerStyle = [
styles.container,
{ backgroundColor: isDisabled ? disabledBackgroundColor : resolvedBackgroundColor },
isDisabled && backgroundColor ? styles.disabled : {},
style
];
const textStyle = [styles.text, { color: isDisabled ? colors.fontDisabled : resolvedTextColor, fontSize }, styleText];
return (
<Touchable
onPress={onPress}
disabled={disabled || loading}
style={[
styles.container,
backgroundColor ? { backgroundColor } : { backgroundColor: isPrimary ? colors.actionTintColor : colors.backgroundColor },
disabled && styles.disabled,
style
]}
accessibilityLabel={title}
{...otherProps}
>
{loading ? (
<ActivityIndicator color={textColor} />
) : (
<Text style={[styles.text, { color: textColor, fontSize }, styleText]}>{title}</Text>
)}
<Touchable onPress={onPress} disabled={isDisabled} style={containerStyle} accessibilityLabel={title} {...otherProps}>
{loading ? <ActivityIndicator color={resolvedTextColor} /> : <Text style={textStyle}>{title}</Text>}
</Touchable>
);
};

12
app/containers/CallHeader.tsx
View File

@ -30,11 +30,11 @@ export const CallHeader = ({ mic, cam, setCam, setMic, title, avatar, uid, name,
const handleColors = (enabled: boolean) => {
if (calling) {
if (enabled) return { button: colors.conferenceCallCallBackButton, icon: colors.gray300 };
return { button: 'transparent', icon: colors.gray100 };
if (enabled) return { button: colors.buttonBackgroundSecondaryDisabled, icon: colors.strokeExtraDark };
return { button: 'transparent', icon: colors.strokeLight };
}
if (enabled) return { button: colors.conferenceCallEnabledIconBackground, icon: colors.conferenceCallEnabledIcon };
return { button: 'transparent', icon: colors.conferenceCallDisabledIcon };
if (enabled) return { button: colors.strokeHighlight, icon: colors.surfaceLight };
return { button: 'transparent', icon: colors.strokeExtraDark };
};
return (
@ -81,7 +81,7 @@ function useStyle() {
actionSheetHeaderTitle: {
fontSize: 14,
...sharedStyles.textBold,
color: colors.n900
color: colors.fontDefault
},
actionSheetHeaderButtons: { flex: 1, alignItems: 'center', flexDirection: 'row', justifyContent: 'flex-end' },
iconCallContainer: {
@ -97,7 +97,7 @@ function useStyle() {
actionSheetUsername: {
fontSize: 16,
...sharedStyles.textBold,
color: colors.passcodePrimary,
color: colors.fontDefault,
flexShrink: 1
},
rowContainer: { flexDirection: 'row' },

2
app/containers/Check.tsx
View File

@ -15,7 +15,7 @@ const styles = StyleSheet.create({
const Check = React.memo(() => {
const { theme } = useTheme();
return <CustomIcon style={styles.icon} color={themes[theme].tintColor} size={22} name='check' />;
return <CustomIcon style={styles.icon} color={themes[theme].badgeBackgroundLevel2} size={22} name='check' />;
});
export default Check;

8
app/containers/Chip/index.tsx
View File

@ -49,24 +49,24 @@ const Chip = ({ avatar, text, onPress, testID, style }: IChip) => {
style={({ pressed }) => [
styles.pressable,
{
backgroundColor: pressed ? colors.bannerBackground : colors.auxiliaryBackground
backgroundColor: pressed ? colors.surfaceNeutral : colors.surfaceHover
},
style
]}
disabled={!onPress}
onPress={() => onPress?.()}
android_ripple={{
color: colors.bannerBackground
color: colors.surfaceNeutral
}}
>
<View style={styles.container}>
{avatar ? <Avatar text={avatar} size={28} style={styles.avatar} /> : null}
<View style={styles.textContainer}>
<Text style={[styles.name, { color: colors.bodyText }]} numberOfLines={1}>
<Text style={[styles.name, { color: colors.fontDefault }]} numberOfLines={1}>
{text}
</Text>
</View>
{onPress ? <CustomIcon name='close' size={16} color={colors.auxiliaryTintColor} /> : null}
{onPress ? <CustomIcon name='close' size={16} /> : null}
</View>
</Pressable>
);

8
app/containers/CollapsibleText/index.tsx
View File

@ -39,10 +39,10 @@ const CollapsibleText = ({ msg, style = [], linesToTruncate = 1 }: ICollapsibleT
if (truncatedText && showTruncated) {
return (
<Text testID={`collapsible-text-truncated-${m}`}>
<Text accessibilityLabel={truncatedText} style={[styles.text, { color: colors.bodyText }, ...style]}>
<Text accessibilityLabel={truncatedText} style={[styles.text, { color: colors.fontDefault }, ...style]}>
{`${truncatedText}... `}
</Text>
<Text onPress={() => setShowTruncated(false)} style={[styles.textInfo, { color: colors.actionTintColor }]}>
<Text onPress={() => setShowTruncated(false)} style={[styles.textInfo, { color: colors.fontHint }]}>
{I18n.t('Show_more')}
</Text>
</Text>
@ -52,7 +52,7 @@ const CollapsibleText = ({ msg, style = [], linesToTruncate = 1 }: ICollapsibleT
return (
<Text
accessibilityLabel={m}
style={[styles.text, { color: colors.bodyText, height: !showTruncated ? undefined : 0 }, ...style]}
style={[styles.text, { color: colors.fontDefault, height: !showTruncated ? undefined : 0 }, ...style]}
testID={`collapsible-text-${m}`}
onTextLayout={event => {
const { lines } = event.nativeEvent;
@ -74,7 +74,7 @@ const CollapsibleText = ({ msg, style = [], linesToTruncate = 1 }: ICollapsibleT
<Text
testID='collapsible-text-show-less'
onPress={() => setShowTruncated(true)}
style={[styles.textInfo, { color: colors.actionTintColor }]}
style={[styles.textInfo, { color: colors.fontHint }]}
>
{` ${I18n.t('Show_less')}`}
</Text>

16
app/containers/CustomIcon/index.tsx
View File

@ -1,8 +1,9 @@
import React from 'react';
import { createIconSetFromIcoMoon } from 'react-native-vector-icons';
import { TextProps } from 'react-native';
import type { IconProps } from 'react-native-vector-icons/Icon';
import { mappedIcons } from './mappedIcons';
import { useTheme } from '../../theme';
const icoMoonConfig = require('./selection.json');
@ -10,14 +11,15 @@ export const IconSet = createIconSetFromIcoMoon(icoMoonConfig, 'custom', 'custom
export type TIconsName = keyof typeof mappedIcons;
export interface ICustomIcon extends TextProps {
export interface ICustomIcon extends IconProps {
name: TIconsName;
size: number;
color: string;
color?: string;
}
const CustomIcon = ({ name, size, color, style, ...props }: ICustomIcon) => (
// @ts-ignore TODO remove this after update @types/react-native to 0.65.0
<IconSet name={name} size={size} color={color} style={[{ lineHeight: size }, style]} {...props} />
);
const CustomIcon = ({ name, size, color, style, ...props }: ICustomIcon): React.ReactElement => {
const { colors } = useTheme();
return <IconSet name={name} size={size} color={color || colors.fontDefault} style={[{ lineHeight: size }, style]} {...props} />;
};
export { CustomIcon };

8
app/containers/DirectoryItem/index.tsx
View File

@ -33,7 +33,7 @@ const DirectoryItemLabel = React.memo(({ text, theme }: IDirectoryItemLabel) =>
if (!text) {
return null;
}
return <Text style={[styles.directoryItemLabel, { color: themes[theme].auxiliaryText }]}>{text}</Text>;
return <Text style={[styles.directoryItemLabel, { color: themes[theme].fontSecondaryInfo }]}>{text}</Text>;
});
const DirectoryItem = ({
@ -50,20 +50,20 @@ const DirectoryItem = ({
}: IDirectoryItem): React.ReactElement => {
const { theme } = useTheme();
return (
<Touch onPress={onPress} style={{ backgroundColor: themes[theme].backgroundColor }} testID={testID}>
<Touch onPress={onPress} style={{ backgroundColor: themes[theme].surfaceRoom }} testID={testID}>
<View style={[styles.directoryItemContainer, styles.directoryItemButton, style]}>
<Avatar text={avatar} size={30} type={type} rid={rid} style={styles.directoryItemAvatar} />
<View style={styles.directoryItemTextContainer}>
<View style={styles.directoryItemTextTitle}>
{type !== 'd' ? <RoomTypeIcon type={type} teamMain={teamMain} /> : null}
<Text style={[styles.directoryItemName, { color: themes[theme].titleText }]} numberOfLines={1}>
<Text style={[styles.directoryItemName, { color: themes[theme].fontTitlesLabels }]} numberOfLines={1}>
{title}
</Text>
</View>
{description ? (
<MarkdownPreview
msg={description}
style={[styles.directoryItemUsername, { color: themes[theme].auxiliaryText }]}
style={[styles.directoryItemUsername, { color: themes[theme].fontSecondaryInfo }]}
numberOfLines={1}
/>
) : null}

2
app/containers/DotsLoader/index.tsx
View File

@ -31,7 +31,7 @@ function Dot({ active }: { active: boolean }): JSX.Element {
width: SIZE,
borderRadius: SIZE / 2,
marginHorizontal: MARGIN,
backgroundColor: active ? colors.dotActiveBg : colors.dotBg
backgroundColor: active ? colors.badgeBackgroundLevel2 : colors.badgeBackgroundLevel1
};
return <Animated.View style={[style, animatedStyle]} />;

4
app/containers/EmojiPicker/Footer.tsx
View File

@ -20,7 +20,7 @@ const Footer = ({ onSearchPressed, onBackspacePressed }: IFooterProps): React.Re
]}
testID='emoji-picker-search'
>
<CustomIcon color={colors.auxiliaryTintColor} size={24} name='search' />
<CustomIcon size={24} name='search' />
</Pressable>
<Pressable
@ -32,7 +32,7 @@ const Footer = ({ onSearchPressed, onBackspacePressed }: IFooterProps): React.Re
]}
testID='emoji-picker-backspace'
>
<CustomIcon color={colors.auxiliaryTintColor} size={24} name='backspace' />
<CustomIcon size={24} name='backspace' />
</Pressable>
</View>
);

4
app/containers/FormContainer.tsx
View File

@ -31,7 +31,7 @@ const FormContainer = ({ children, testID, ...props }: IFormContainer) => {
return (
<KeyboardView
style={{ backgroundColor: themes[theme].backgroundColor }}
style={{ backgroundColor: themes[theme].surfaceRoom }}
contentContainerStyle={sharedStyles.container}
keyboardVerticalOffset={128}
>
@ -42,7 +42,7 @@ const FormContainer = ({ children, testID, ...props }: IFormContainer) => {
{...scrollPersistTaps}
{...props}
>
<SafeAreaView testID={testID} style={{ backgroundColor: themes[theme].backgroundColor }}>
<SafeAreaView testID={testID} style={{ backgroundColor: themes[theme].surfaceRoom }}>
{children}
<AppVersion theme={theme} />
</SafeAreaView>

12
app/containers/HeaderButton/Common.tsx
View File

@ -5,19 +5,21 @@ import I18n from '../../i18n';
import { isIOS } from '../../lib/methods/helpers';
import Container from './HeaderButtonContainer';
import Item, { IHeaderButtonItem } from './HeaderButtonItem';
import { useTheme } from '../../theme';
interface IHeaderButtonCommon extends IHeaderButtonItem {
navigation?: any; // TODO: Evaluate proper type
}
// Left
export const Drawer = React.memo(
({ navigation, testID, onPress = () => navigation?.toggleDrawer(), ...props }: IHeaderButtonCommon) => (
export const Drawer = ({ navigation, testID, onPress = () => navigation?.toggleDrawer(), ...props }: IHeaderButtonCommon) => {
const { colors } = useTheme();
return (
<Container left>
<Item iconName='hamburguer' onPress={onPress} testID={testID} {...props} />
<Item iconName='hamburguer' onPress={onPress} testID={testID} color={colors.fontDefault} {...props} />
</Container>
)
);
);
};
export const CloseModal = React.memo(({ testID, onPress, ...props }: IHeaderButtonCommon) => {
const { dispatch } = useNavigation();

8
app/containers/HeaderButton/HeaderButtonItem.tsx
View File

@ -2,11 +2,11 @@ import React from 'react';
import { Platform, StyleSheet, Text } from 'react-native';
import { PlatformPressable } from '@react-navigation/elements';
import { CustomIcon, ICustomIcon, TIconsName } from '../CustomIcon';
import { CustomIcon, TIconsName } from '../CustomIcon';
import { useTheme } from '../../theme';
import sharedStyles from '../../views/Styles';
export interface IHeaderButtonItem extends Omit<ICustomIcon, 'name' | 'size' | 'color'> {
export interface IHeaderButtonItem {
title?: string;
iconName?: TIconsName;
onPress?: <T>(arg: T) => void;
@ -57,9 +57,9 @@ const Item = ({ title, iconName, onPress, testID, badge, color, disabled, ...pro
>
<>
{iconName ? (
<CustomIcon name={iconName} size={24} color={color || colors.headerTintColor} {...props} />
<CustomIcon name={iconName} size={24} color={color} {...props} />
) : (
<Text style={[styles.title, { color: color || colors.headerTintColor }]} {...props}>
<Text style={[styles.title, { color: color || colors.fontDefault }]} {...props}>
{title}
</Text>
)}

4
app/containers/HeaderButton/HeaderButtons.stories.tsx
View File

@ -33,7 +33,7 @@ const HeaderExample = ({ left, right, colors, title = '' }: IHeader) => (
title={title}
headerLeft={left}
headerRight={right}
headerBackground={() => <HeaderBackground style={{ backgroundColor: colors?.headerBackground }} />}
headerBackground={() => <HeaderBackground style={{ backgroundColor: colors?.surfaceNeutral }} />}
/>
);
@ -120,7 +120,7 @@ const ThemeStory = ({ theme }: { theme: TSupportedThemes }) => (
<HeaderExample
left={() => (
<HeaderButton.Container left>
<HeaderButton.Drawer badge={() => <HeaderButton.BadgeWarn color={colors[theme].dangerColor} />} />
<HeaderButton.Drawer badge={() => <HeaderButton.BadgeWarn color={colors[theme].buttonBackgroundDangerDefault} />} />
<HeaderButton.Item iconName='threads' />
</HeaderButton.Container>
)}

2
app/containers/ImageViewer/ImageViewer.tsx
View File

@ -114,7 +114,7 @@ export const ImageViewer = ({ uri = '', imageComponentType, width, height, ...pr
const { colors } = useTheme();
return (
<View style={[styles.flex, { width, height, backgroundColor: colors.previewBackground }]}>
<View style={[styles.flex, { width, height, backgroundColor: colors.surfaceNeutral }]}>
<GestureDetector gesture={gesture}>
<Animated.View onLayout={onLayout} style={[styles.flex, style]}>
<Component

4
app/containers/InAppNotification/IncomingCallNotification/index.tsx
View File

@ -10,7 +10,6 @@ import i18n from '../../../i18n';
import { useAppSelector } from '../../../lib/hooks';
import { useEndpointData } from '../../../lib/hooks/useEndpointData';
import { hideNotification } from '../../../lib/methods/helpers/notifications';
import { useTheme } from '../../../theme';
import { CustomIcon } from '../../CustomIcon';
import { CallHeader } from '../../CallHeader';
import { useStyle } from './style';
@ -41,7 +40,6 @@ const IncomingCallHeader = React.memo(
const isMasterDetail = useAppSelector(state => state.app.isMasterDetail);
const styles = useStyle();
const insets = useSafeAreaInsets();
const { colors } = useTheme();
return (
<View
@ -73,7 +71,7 @@ const IncomingCallHeader = React.memo(
}}
style={styles.closeButton}
>
<CustomIcon name='close' size={20} color={colors.gray300} />
<CustomIcon name='close' size={20} />
</Touchable>
<Touchable
hitSlop={BUTTON_HIT_SLOP}

10
app/containers/InAppNotification/IncomingCallNotification/style.tsx
View File

@ -13,8 +13,8 @@ export const useStyle = () => {
marginHorizontal: 10,
borderWidth: StyleSheet.hairlineWidth,
borderRadius: 4,
backgroundColor: colors.focusedBackground,
borderColor: colors.separatorColor,
backgroundColor: colors.surfaceLight,
borderColor: colors.strokeLight,
flex: 1
},
small: {
@ -26,7 +26,7 @@ export const useStyle = () => {
marginTop: 12
},
closeButton: {
backgroundColor: colors.passcodeButtonActive,
backgroundColor: colors.buttonBackgroundSecondaryDefault,
marginRight: 8,
alignItems: 'center',
justifyContent: 'center',
@ -36,7 +36,7 @@ export const useStyle = () => {
},
cancelButton: {
borderRadius: 4,
backgroundColor: colors.cancelCallButton,
backgroundColor: colors.buttonBackgroundDangerDefault,
marginRight: 8,
flex: 2,
alignItems: 'center',
@ -48,7 +48,7 @@ export const useStyle = () => {
},
acceptButton: {
borderRadius: 4,
backgroundColor: colors.acceptCallButton,
backgroundColor: colors.buttonBackgroundSuccessDefault,
flex: 2,
alignItems: 'center',
justifyContent: 'center'

10
app/containers/InAppNotification/NotifierComponent.tsx
View File

@ -103,8 +103,8 @@ const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifie
styles.container,
isMasterDetail && styles.small,
{
backgroundColor: themes[theme].focusedBackground,
borderColor: themes[theme].separatorColor,
backgroundColor: themes[theme].surfaceLight,
borderColor: themes[theme].strokeLight,
marginTop: insets.top
}
]}
@ -119,17 +119,17 @@ const NotifierComponent = React.memo(({ notification, isMasterDetail }: INotifie
<>
<Avatar text={avatar} size={AVATAR_SIZE} type={type} rid={rid} style={styles.avatar} />
<View style={styles.inner}>
<Text style={[styles.roomName, { color: themes[theme].titleText }]} numberOfLines={1}>
<Text style={[styles.roomName, { color: themes[theme].fontTitlesLabels }]} numberOfLines={1}>
{title}
</Text>
<Text style={[styles.message, { color: themes[theme].titleText }]} numberOfLines={1}>
<Text style={[styles.message, { color: themes[theme].fontTitlesLabels }]} numberOfLines={1}>
{text}
</Text>
</View>
</>
</Touchable>
<Touchable onPress={hideNotification} hitSlop={BUTTON_HIT_SLOP} background={Touchable.SelectableBackgroundBorderless()}>
<CustomIcon name='close' size={20} color={themes[theme].titleText} style={styles.close} />
<CustomIcon name='close' size={20} style={styles.close} />
</Touchable>
</View>
);

2
app/containers/List/ListHeader.tsx
View File

@ -28,7 +28,7 @@ const ListHeader = React.memo(({ title, translateTitle = true }: IListHeader) =>
return (
<View style={styles.container}>
<Text style={[styles.title, { color: themes[theme].infoText }]} numberOfLines={1}>
<Text style={[styles.title, { color: themes[theme].fontHint }]} numberOfLines={1}>
{translateTitle ? I18n.t(title) : title}
</Text>
</View>

18
app/containers/List/ListIcon.tsx
View File

@ -1,14 +1,12 @@
import React from 'react';
import { StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
import { themes } from '../../lib/constants';
import { CustomIcon, TIconsName } from '../CustomIcon';
import { useTheme } from '../../theme';
import { ICON_SIZE } from './constants';
interface IListIcon {
name: TIconsName;
color?: string | null;
color?: string;
style?: StyleProp<ViewStyle>;
testID?: string;
size?: number;
@ -21,15 +19,11 @@ const styles = StyleSheet.create({
}
});
const ListIcon = React.memo(({ name, color, style, testID, size }: IListIcon) => {
const { theme } = useTheme();
return (
<View style={[styles.icon, style]}>
<CustomIcon name={name} color={color ?? themes[theme].auxiliaryText} size={size ?? ICON_SIZE} testID={testID} />
</View>
);
});
const ListIcon = ({ name, color, style, testID, size }: IListIcon): React.ReactElement => (
<View style={[styles.icon, style]}>
<CustomIcon name={name} color={color} size={size ?? ICON_SIZE} testID={testID} />
</View>
);
ListIcon.displayName = 'List.Icon';

2
app/containers/List/ListInfo.tsx
View File

@ -27,7 +27,7 @@ const ListInfo = React.memo(({ info, translateInfo = true }: IListInfo) => {
const { theme } = useTheme();
return (
<View style={styles.container}>
<Text style={[styles.text, { color: themes[theme].infoText }]}>{translateInfo ? I18n.t(info) : info}</Text>
<Text style={[styles.text, { color: themes[theme].fontHint }]}>{translateInfo ? I18n.t(info) : info}</Text>
</View>
);
});

10
app/containers/List/ListItem.tsx
View File

@ -97,15 +97,15 @@ const Content = React.memo(
{left ? <View style={styles.leftContainer}>{left()}</View> : null}
<View style={styles.textContainer}>
<View style={styles.textAlertContainer}>
<Text style={[styles.title, styleTitle, { color: color || themes[theme].titleText }]} numberOfLines={1}>
<Text style={[styles.title, styleTitle, { color: color || themes[theme].fontTitlesLabels }]} numberOfLines={1}>
{translateTitle && title ? I18n.t(title) : title}
</Text>
{alert ? (
<CustomIcon name='info' size={ICON_SIZE} color={themes[theme].dangerColor} style={styles.alertIcon} />
<CustomIcon name='info' size={ICON_SIZE} color={themes[theme].buttonBackgroundDangerDefault} style={styles.alertIcon} />
) : null}
</View>
{subtitle ? (
<Text style={[styles.subtitle, { color: themes[theme].auxiliaryText }]} numberOfLines={1}>
<Text style={[styles.subtitle, { color: themes[theme].fontSecondaryInfo }]} numberOfLines={1}>
{translateSubtitle ? I18n.t(subtitle) : subtitle}
</Text>
) : null}
@ -136,7 +136,7 @@ interface IListItemButton {
const Button = React.memo(({ onPress, backgroundColor, underlayColor, ...props }: IListButtonPress) => (
<Touch
onPress={() => onPress(props.title)}
style={{ backgroundColor: backgroundColor || themes[props.theme].backgroundColor }}
style={{ backgroundColor: backgroundColor || themes[props.theme].surfaceRoom }}
underlayColor={underlayColor}
enabled={!props.disabled}
>
@ -157,7 +157,7 @@ const ListItem = React.memo(({ ...props }: IListItem) => {
return <Button {...props} theme={theme} onPress={onPress} />;
}
return (
<View style={{ backgroundColor: props.backgroundColor || themes[theme].backgroundColor }}>
<View style={{ backgroundColor: props.backgroundColor || themes[theme].surfaceRoom }}>
<Content {...props} theme={theme} />
</View>
);

2
app/containers/List/ListSeparator.tsx
View File

@ -17,7 +17,7 @@ interface IListSeparator {
const ListSeparator = React.memo(({ style }: IListSeparator) => {
const { theme } = useTheme();
return <View style={[styles.separator, style, { backgroundColor: themes[theme].separatorColor }]} />;
return <View style={[styles.separator, style, { backgroundColor: themes[theme].strokeLight }]} />;
});
ListSeparator.displayName = 'List.Separator';

6
app/containers/LoginServices/ButtonService.tsx
View File

@ -16,13 +16,13 @@ const ButtonService = ({ name, authType, onPress, backgroundColor, buttonText, i
onPress={onPress}
style={[styles.serviceButton, { backgroundColor }]}
activeOpacity={0.5}
underlayColor={colors.buttonText}
underlayColor={colors.fontWhite}
>
<View style={styles.serviceButtonContainer}>
{authType === 'oauth' || authType === 'apple' ? (
<CustomIcon name={icon} size={24} color={colors.titleText} style={styles.serviceIcon} />
<CustomIcon name={icon} size={24} style={styles.serviceIcon} />
) : null}
<Text style={[styles.serviceText, { color: colors.titleText }]}>{buttonText}</Text>
<Text style={[styles.serviceText, { color: colors.fontTitlesLabels }]}>{buttonText}</Text>
</View>
</Touch>
);

2
app/containers/LoginServices/LoginServices.stories.tsx
View File

@ -84,7 +84,7 @@ export const ServiceList = () => (
<ButtonService
key={service._id}
onPress={() => {}}
backgroundColor={colors[theme].chatComponentBackground}
backgroundColor={colors[theme].surfaceTint}
buttonText={buttonText}
icon={icon}
name={service.name}

2
app/containers/LoginServices/Service.tsx
View File

@ -86,7 +86,7 @@ const Service = React.memo(
);
}
const backgroundColor = isSaml && service.buttonColor ? service.buttonColor : colors.chatComponentBackground;
const backgroundColor = isSaml && service.buttonColor ? service.buttonColor : colors.buttonBackgroundSecondaryDefault;
return (
<ButtonService

2
app/containers/LoginServices/ServicesSeparator.tsx
View File

@ -20,7 +20,7 @@ const ServicesSeparator = ({ services, separator, collapsed, onPress }: IService
type='secondary'
onPress={onPress}
style={styles.options}
color={colors.actionTintColor}
color={colors.fontHint}
/>
<OrSeparator theme={theme} />
</>

10
app/containers/MessageActions/Header.tsx
View File

@ -65,7 +65,7 @@ const HeaderItem = ({ item, onReaction, theme }: THeaderItem) => (
<Touch
testID={`message-actions-emoji-${item}`}
onPress={() => onReaction({ emoji: item })}
style={[styles.headerItem, { backgroundColor: themes[theme].auxiliaryBackground }]}
style={[styles.headerItem, { backgroundColor: themes[theme].surfaceHover }]}
>
{typeof item === 'string' ? (
<Text style={styles.headerIcon}>{shortnameToUnicode(`:${item}:`)}</Text>
@ -79,9 +79,9 @@ const HeaderFooter = ({ onReaction, theme }: THeaderFooter) => (
<Touch
testID='add-reaction'
onPress={(param: any) => onReaction(param)}
style={[styles.headerItem, { backgroundColor: themes[theme].auxiliaryBackground }]}
style={[styles.headerItem, { backgroundColor: themes[theme].surfaceHover }]}
>
<CustomIcon name='reaction-add' size={24} color={themes[theme].bodyText} />
<CustomIcon name='reaction-add' size={24} />
</Touch>
);
@ -108,12 +108,12 @@ const Header = React.memo(({ handleReaction, message, isMasterDetail }: IHeader)
}
return (
<View style={[styles.container, { backgroundColor: themes[theme].focusedBackground }]}>
<View style={[styles.container, { backgroundColor: themes[theme].surfaceLight }]}>
<FlatList
data={frequentlyUsed.slice(0, quantity)}
renderItem={renderItem}
ListFooterComponent={renderFooter}
style={{ backgroundColor: themes[theme].focusedBackground }}
style={{ backgroundColor: themes[theme].surfaceLight }}
keyExtractor={item => (typeof item === 'string' ? item : item.name)}
showsHorizontalScrollIndicator={false}
scrollEnabled={false}

2
app/containers/MessageActions/index.tsx
View File

@ -131,7 +131,7 @@ const MessageActions = React.memo(
}
const editOwn = isOwn(message);
if (!(permissions.hasEditPermission || (Message_AllowEditing && editOwn))) {
if (!(permissions.hasEditPermission || (Message_AllowEditing !== false && editOwn))) {
return false;
}
const blockEditInMinutes = Message_AllowEditing_BlockEditInMinutes;

228
app/containers/MessageComposer/__snapshots__/MessageComposer.test.tsx.snap
View File

@ -119,7 +119,7 @@ exports[`MessageComposer Audio tap record 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -311,7 +311,7 @@ exports[`MessageComposer Quote Add quote \`abc\` 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -421,7 +421,7 @@ exports[`MessageComposer Quote Add quote \`abc\` 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -627,7 +627,7 @@ exports[`MessageComposer Quote Add quote \`abc\` 1`] = `
"textAlign": "left",
},
Object {
"color": "#2f343d",
"color": "#2F343D",
},
Object {
"backgroundColor": "transparent",
@ -728,7 +728,7 @@ exports[`MessageComposer Quote Add quote \`def\` 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -838,7 +838,7 @@ exports[`MessageComposer Quote Add quote \`def\` 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -1045,7 +1045,7 @@ exports[`MessageComposer Quote Add quote \`def\` 1`] = `
"textAlign": "left",
},
Object {
"color": "#2f343d",
"color": "#2F343D",
},
Object {
"backgroundColor": "transparent",
@ -1222,7 +1222,7 @@ exports[`MessageComposer Quote Add quote \`def\` 1`] = `
"textAlign": "left",
},
Object {
"color": "#2f343d",
"color": "#2F343D",
},
Object {
"backgroundColor": "transparent",
@ -1323,7 +1323,7 @@ exports[`MessageComposer Quote Remove a quote 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -1433,7 +1433,7 @@ exports[`MessageComposer Quote Remove a quote 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -1640,7 +1640,7 @@ exports[`MessageComposer Quote Remove a quote 1`] = `
"textAlign": "left",
},
Object {
"color": "#2f343d",
"color": "#2F343D",
},
Object {
"backgroundColor": "transparent",
@ -1817,7 +1817,7 @@ exports[`MessageComposer Quote Remove a quote 1`] = `
"textAlign": "left",
},
Object {
"color": "#2f343d",
"color": "#2F343D",
},
Object {
"backgroundColor": "transparent",
@ -1953,7 +1953,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2024,7 +2024,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2095,7 +2095,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2166,7 +2166,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2237,7 +2237,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2308,7 +2308,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2379,7 +2379,7 @@ exports[`MessageComposer Toolbar Markdown tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2517,7 +2517,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2588,7 +2588,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2659,7 +2659,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2730,7 +2730,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2801,7 +2801,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2872,7 +2872,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -2943,7 +2943,7 @@ exports[`MessageComposer Toolbar Markdown tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3081,7 +3081,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3152,7 +3152,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3223,7 +3223,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3294,7 +3294,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3365,7 +3365,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3436,7 +3436,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3507,7 +3507,7 @@ exports[`MessageComposer Toolbar Markdown tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3645,7 +3645,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3716,7 +3716,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3787,7 +3787,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3858,7 +3858,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -3929,7 +3929,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4000,7 +4000,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4071,7 +4071,7 @@ exports[`MessageComposer Toolbar Markdown tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4209,7 +4209,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4280,7 +4280,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4351,7 +4351,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4422,7 +4422,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4493,7 +4493,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4564,7 +4564,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4635,7 +4635,7 @@ exports[`MessageComposer Toolbar Markdown tap markdown 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4773,7 +4773,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4844,7 +4844,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4915,7 +4915,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -4986,7 +4986,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5057,7 +5057,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5128,7 +5128,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5199,7 +5199,7 @@ exports[`MessageComposer Toolbar Markdown tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5337,7 +5337,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5408,7 +5408,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5479,7 +5479,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5550,7 +5550,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5621,7 +5621,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5692,7 +5692,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5763,7 +5763,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap bold 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5901,7 +5901,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -5972,7 +5972,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6043,7 +6043,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6114,7 +6114,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6185,7 +6185,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6256,7 +6256,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6327,7 +6327,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6465,7 +6465,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6536,7 +6536,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6607,7 +6607,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6678,7 +6678,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6749,7 +6749,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6820,7 +6820,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -6891,7 +6891,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap code-block 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7029,7 +7029,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7100,7 +7100,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7171,7 +7171,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7242,7 +7242,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7313,7 +7313,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7384,7 +7384,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7455,7 +7455,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap italic 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7593,7 +7593,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7664,7 +7664,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7735,7 +7735,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7806,7 +7806,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7877,7 +7877,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -7948,7 +7948,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8019,7 +8019,7 @@ exports[`MessageComposer Toolbar Markdown type test and tap strike 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8157,7 +8157,7 @@ exports[`MessageComposer Toolbar tap actions 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8228,7 +8228,7 @@ exports[`MessageComposer Toolbar tap actions 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8299,7 +8299,7 @@ exports[`MessageComposer Toolbar tap actions 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8370,7 +8370,7 @@ exports[`MessageComposer Toolbar tap actions 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8441,7 +8441,7 @@ exports[`MessageComposer Toolbar tap actions 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8579,7 +8579,7 @@ exports[`MessageComposer Toolbar tap emoji 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8650,7 +8650,7 @@ exports[`MessageComposer Toolbar tap emoji 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8721,7 +8721,7 @@ exports[`MessageComposer Toolbar tap emoji 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8860,7 +8860,7 @@ Array [
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -8931,7 +8931,7 @@ Array [
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9002,7 +9002,7 @@ Array [
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9073,7 +9073,7 @@ Array [
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9144,7 +9144,7 @@ Array [
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9580,7 +9580,7 @@ exports[`MessageComposer renders correctly 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9690,7 +9690,7 @@ exports[`MessageComposer renders correctly 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9794,7 +9794,7 @@ exports[`MessageComposer renders correctly with audio recorder disabled 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -9943,7 +9943,7 @@ exports[`MessageComposer renders correctly with audio recorder disabled and with
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10092,7 +10092,7 @@ exports[`MessageComposer renders correctly without audio upload permissions 1`]
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10276,7 +10276,7 @@ exports[`MessageComposer renders toolbar when focused 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10347,7 +10347,7 @@ exports[`MessageComposer renders toolbar when focused 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10418,7 +10418,7 @@ exports[`MessageComposer renders toolbar when focused 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10489,7 +10489,7 @@ exports[`MessageComposer renders toolbar when focused 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10560,7 +10560,7 @@ exports[`MessageComposer renders toolbar when focused 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10663,7 +10663,7 @@ exports[`MessageComposer send message 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [
@ -10773,7 +10773,7 @@ exports[`MessageComposer send message 1`] = `
style={
Array [
Object {
"color": "#6C727A",
"color": "#2F343D",
"fontSize": 24,
},
Array [

4
app/containers/MessageComposer/components/Autocomplete/AutocompleteCannedResponse.tsx
View File

@ -9,7 +9,7 @@ import { NO_CANNED_RESPONSES } from '../../constants';
import { useStyle } from './styles';
export const AutocompleteCannedResponse = ({ item }: { item: IAutocompleteCannedResponse }) => {
const [styles, colors] = useStyle();
const [styles] = useStyle();
if (item.id === NO_CANNED_RESPONSES) {
return (
<View style={styles.canned}>
@ -17,7 +17,7 @@ export const AutocompleteCannedResponse = ({ item }: { item: IAutocompleteCanned
<Text style={styles.cannedTitleText}>
{I18n.t('No_match_found')} <Text style={sharedStyles.textSemibold}>{I18n.t('Check_canned_responses')}</Text>
</Text>
<CustomIcon name='chevron-right' size={24} color={colors.fontHint} />
<CustomIcon name='chevron-right' size={24} />
</View>
</View>
);

2
app/containers/MessageComposer/components/Autocomplete/AutocompletePreview.tsx
View File

@ -19,7 +19,7 @@ export const AutocompletePreview = ({ item, onPress }: IAutocompleteItemProps) =
item.preview.type === 'image' ? (
<FastImage style={styles.previewImage} source={{ uri: item.preview.value }} resizeMode={FastImage.resizeMode.cover} />
) : (
<CustomIcon name='attach' size={36} color={colors.fontInfo} />
<CustomIcon name='attach' size={36} />
);
}

18
app/containers/MessageComposer/components/Buttons/BaseButton.tsx
View File

@ -4,7 +4,6 @@ import { View, StyleSheet } from 'react-native';
import I18n from '../../../../i18n';
import { CustomIcon, TIconsName } from '../../../CustomIcon';
import { useTheme } from '../../../../theme';
export interface IBaseButton {
testID: string;
@ -21,16 +20,13 @@ export const hitSlop = {
left: 16
};
export const BaseButton = ({ accessibilityLabel, icon, color, testID, onPress }: IBaseButton) => {
const { colors } = useTheme();
return (
<BorderlessButton style={styles.button} onPress={() => onPress()} testID={testID} hitSlop={hitSlop}>
<View accessible accessibilityLabel={I18n.t(accessibilityLabel)} accessibilityRole='button'>
<CustomIcon name={icon} size={24} color={color || colors.fontSecondaryInfo} />
</View>
</BorderlessButton>
);
};
export const BaseButton = ({ accessibilityLabel, icon, color, testID, onPress }: IBaseButton) => (
<BorderlessButton style={styles.button} onPress={() => onPress()} testID={testID} hitSlop={hitSlop}>
<View accessible accessibilityLabel={I18n.t(accessibilityLabel)} accessibilityRole='button'>
<CustomIcon name={icon} size={24} color={color} />
</View>
</BorderlessButton>
);
const styles = StyleSheet.create({
button: {

2
app/containers/MessageComposer/components/EmojiSearchbar.tsx
View File

@ -66,7 +66,7 @@ export const EmojiSearchbar = (): React.ReactElement | null => {
hitSlop={BUTTON_HIT_SLOP}
testID='openback-emoji-keyboard'
>
<CustomIcon name='chevron-left' size={24} color={colors.fontHint} />
<CustomIcon name='chevron-left' size={24} />
</Pressable>
<View style={styles.inputContainer}>
<EmojiSearch onBlur={closeEmojiKeyboard} onChangeText={handleTextChange} />

4
app/containers/MessageComposer/components/SendThreadToChannel.tsx
View File

@ -76,9 +76,9 @@ export const SendThreadToChannel = (): React.ReactElement | null => {
testID={alsoSendThreadToChannel ? 'send-to-channel-checked' : 'send-to-channel-unchecked'}
name={alsoSendThreadToChannel ? 'checkbox-checked' : 'checkbox-unchecked'}
size={24}
color={alsoSendThreadToChannel ? colors.buttonBackgroundPrimaryDefault : colors.strokeDark}
color={alsoSendThreadToChannel ? colors.buttonBackgroundPrimaryDefault : colors.fontDefault}
/>
<Text style={[styles.text, { color: colors.fontSecondaryInfo }]}>{I18n.t('Message_composer_Send_to_channel')}</Text>
<Text style={[styles.text, { color: colors.fontDefault }]}>{I18n.t('Message_composer_Send_to_channel')}</Text>
</TouchableWithoutFeedback>
);
};

32
app/containers/MessageComposer/hooks/useAutoSaveDraft.ts
View File

@ -1,24 +1,28 @@
import { useRoute } from '@react-navigation/native';
import { useCallback, useEffect, useRef } from 'react';
import { saveDraftMessage } from '../../../lib/methods/draftMessage';
import { useRoomContext } from '../../../views/RoomView/context';
import { useFocused } from '../context';
import { saveDraftMessage } from '../../../lib/methods/draftMessage';
export const useAutoSaveDraft = (text = '') => {
const route = useRoute();
const { rid, tmid, action, selectedMessages } = useRoomContext();
const focused = useFocused();
const oldText = useRef('');
const intervalRef = useRef();
const saveMessageDraft = useCallback(() => {
if (action === 'edit') return;
const mounted = useRef(true);
const saveMessageDraft = useCallback(() => {
if (route.name === 'ShareView') return;
if (action === 'edit') return;
const draftMessage = selectedMessages?.length ? JSON.stringify({ quotes: selectedMessages, msg: text }) : text;
if (oldText.current !== draftMessage) {
if (oldText.current !== draftMessage || (oldText.current === '' && draftMessage === '')) {
oldText.current = draftMessage;
saveDraftMessage({ rid, tmid, draftMessage });
}
}, [action, rid, tmid, text, selectedMessages?.length]);
}, [action, rid, tmid, text, selectedMessages?.length, route.name]);
useEffect(() => {
if (focused) {
@ -29,7 +33,23 @@ export const useAutoSaveDraft = (text = '') => {
return () => {
clearInterval(intervalRef.current);
saveMessageDraft();
};
}, [focused, saveMessageDraft]);
// hack to call saveMessageDraft when component is unmounted
useEffect(() => {
() => {};
return () => {
mounted.current = false;
};
}, []);
useEffect(
() => () => {
if (!mounted.current) {
saveMessageDraft();
}
},
[saveMessageDraft]
);
};

4
app/containers/OrSeparator.tsx
View File

@ -29,8 +29,8 @@ interface IOrSeparator {
}
const OrSeparator = React.memo(({ theme }: IOrSeparator) => {
const line = { backgroundColor: themes[theme].borderColor };
const text = { color: themes[theme].auxiliaryText };
const line = { backgroundColor: themes[theme].strokeLight };
const text = { color: themes[theme].fontSecondaryInfo };
return (
<View style={styles.container}>
<View style={[styles.line, line]} />

13
app/containers/Passcode/Base/Button.tsx
View File

@ -2,7 +2,6 @@ import React from 'react';
import { Text, StyleProp, ViewStyle } from 'react-native';
import styles from './styles';
import { themes } from '../../../lib/constants';
import Touch from '../../Touch';
import { CustomIcon, TIconsName } from '../../CustomIcon';
import { useTheme } from '../../../theme';
@ -16,23 +15,19 @@ interface IPasscodeButton {
}
const Button = React.memo(({ style, text, disabled, onPress, icon }: IPasscodeButton) => {
const { theme } = useTheme();
const { colors } = useTheme();
const press = () => onPress && onPress(text);
return (
<Touch
style={[styles.buttonView, { backgroundColor: 'transparent' }, style]}
underlayColor={themes[theme].passcodeButtonActive}
rippleColor={themes[theme].passcodeButtonActive}
underlayColor={colors.buttonBackgroundSecondaryDefault}
rippleColor={colors.buttonBackgroundSecondaryPress}
enabled={!disabled}
onPress={press}
>
{icon ? (
<CustomIcon name={icon} size={36} color={themes[theme].passcodePrimary} />
) : (
<Text style={[styles.buttonText, { color: themes[theme].passcodePrimary }]}>{text}</Text>
)}
{icon ? <CustomIcon name={icon} size={36} /> : <Text style={[styles.buttonText, { color: colors.fontDefault }]}>{text}</Text>}
</Touch>
);
});

7
app/containers/Passcode/Base/Dots.tsx
View File

@ -3,7 +3,6 @@ import { View } from 'react-native';
import range from 'lodash/range';
import styles from './styles';
import { themes } from '../../../lib/constants';
import { useTheme } from '../../../theme';
const SIZE_EMPTY = 12;
@ -15,7 +14,7 @@ interface IPasscodeDots {
}
const Dots = React.memo(({ passcode, length }: IPasscodeDots) => {
const { theme } = useTheme();
const { colors } = useTheme();
return (
<View style={styles.dotsContainer}>
@ -25,9 +24,9 @@ const Dots = React.memo(({ passcode, length }: IPasscodeDots) => {
const width = lengthSup ? SIZE_FULL : SIZE_EMPTY;
let backgroundColor = '';
if (lengthSup && passcode.length > 0) {
backgroundColor = themes[theme].passcodeDotFull;
backgroundColor = colors.strokeDark;
} else {
backgroundColor = themes[theme].passcodeDotEmpty;
backgroundColor = colors.strokeLight;
}
const borderRadius = lengthSup ? SIZE_FULL / 2 : SIZE_EMPTY / 2;
const marginRight = lengthSup ? 10 - (SIZE_FULL - SIZE_EMPTY) / 2 : 10;

9
app/containers/Passcode/Base/LockIcon.tsx
View File

@ -3,20 +3,19 @@ import { View } from 'react-native';
import { Row } from 'react-native-easy-grid';
import styles from './styles';
import { themes } from '../../../lib/constants';
import { CustomIcon } from '../../CustomIcon';
import { useTheme } from '../../../theme';
const LockIcon = React.memo(() => {
const { theme } = useTheme();
const LockIcon = () => {
const { colors } = useTheme();
return (
<Row style={styles.row}>
<View style={styles.iconView}>
<CustomIcon name='auth' size={40} color={themes[theme].passcodeLockIcon} />
<CustomIcon name='auth' size={40} color={colors.fontSecondaryInfo} />
</View>
</Row>
);
});
};
export default LockIcon;

5
app/containers/Passcode/Base/Locked.tsx
View File

@ -1,7 +1,6 @@
import React, { useEffect, useState } from 'react';
import { Grid } from 'react-native-easy-grid';
import { themes } from '../../../lib/constants';
import { resetAttempts } from '../../../lib/methods/helpers/localAuthentication';
import { TYPE } from '../constants';
import { getDiff, getLockedUntil } from '../utils';
@ -50,7 +49,7 @@ const Timer = React.memo(({ time, setStatus }: IPasscodeTimer) => {
const Locked = React.memo(({ setStatus }: IPasscodeLocked) => {
const [lockedUntil, setLockedUntil] = useState<Date | null>(null);
const { theme } = useTheme();
const { colors } = useTheme();
const readItemFromStorage = async () => {
const l = await getLockedUntil();
@ -62,7 +61,7 @@ const Locked = React.memo(({ setStatus }: IPasscodeLocked) => {
}, []);
return (
<Grid style={[styles.grid, { backgroundColor: themes[theme].passcodeBackground }]}>
<Grid style={[styles.grid, { backgroundColor: colors.strokeExtraLight }]}>
<LockIcon />
<Title text={I18n.t('Passcode_app_locked_title')} />
<Timer time={lockedUntil} setStatus={setStatus} />

2
app/containers/Passcode/Base/Subtitle.tsx
View File

@ -16,7 +16,7 @@ const Subtitle = React.memo(({ text }: IPasscodeSubtitle) => {
return (
<Row style={styles.row}>
<View style={styles.subtitleView}>
<Text style={[styles.textSubtitle, { color: themes[theme].passcodeSecondary }]}>{text}</Text>
<Text style={[styles.textSubtitle, { color: themes[theme].fontDanger }]}>{text}</Text>
</View>
</Row>
);

5
app/containers/Passcode/Base/Title.tsx
View File

@ -3,7 +3,6 @@ import { Text, View } from 'react-native';
import { Row } from 'react-native-easy-grid';
import styles from './styles';
import { themes } from '../../../lib/constants';
import { useTheme } from '../../../theme';
interface IPasscodeTitle {
@ -11,12 +10,12 @@ interface IPasscodeTitle {
}
const Title = React.memo(({ text }: IPasscodeTitle) => {
const { theme } = useTheme();
const { colors } = useTheme();
return (
<Row style={styles.row}>
<View style={styles.titleView}>
<Text style={[styles.textTitle, { color: themes[theme].passcodePrimary }]}>{text}</Text>
<Text style={[styles.textTitle, { color: colors.fontTitlesLabels }]}>{text}</Text>
</View>
</Row>
);

6
app/containers/Passcode/Base/index.tsx
View File

@ -9,7 +9,7 @@ import styles from './styles';
import Button from './Button';
import Dots from './Dots';
import { TYPE } from '../constants';
import { PASSCODE_LENGTH, themes } from '../../../lib/constants';
import { PASSCODE_LENGTH } from '../../../lib/constants';
import { useTheme } from '../../../theme';
import LockIcon from './LockIcon';
import Title from './Title';
@ -35,7 +35,7 @@ export interface IBase {
const Base = forwardRef<IBase, IPasscodeBase>(
({ type, onEndProcess, previousPasscode, title, subtitle, onError, showBiometry, onBiometryPress }, ref) => {
const { theme } = useTheme();
const { colors } = useTheme();
const { height } = useDimensions();
// 206 is the height of the header calculating the margins, icon size height, title font size and subtitle height.
@ -101,7 +101,7 @@ const Base = forwardRef<IBase, IPasscodeBase>(
return (
<Animatable.View ref={rootRef} style={styles.container}>
<Grid style={[styles.grid, { backgroundColor: themes[theme].passcodeBackground }]}>
<Grid style={[styles.grid, { backgroundColor: colors.surfaceNeutral }]}>
<LockIcon />
<Title text={title} />
{subtitle ? <Subtitle text={subtitle} /> : null}

2
app/containers/RadioButton/index.tsx
View File

@ -10,7 +10,7 @@ export const RadioButton = ({ check, testID, size }: { check: boolean; testID?:
testID={testID}
selected={check}
size={size || 20}
color={check ? colors.tintActive : colors.auxiliaryTintColor}
color={check ? colors.buttonBackgroundPrimaryDefault : colors.buttonBackgroundPrimaryDisabled}
/>
);
};

4
app/containers/ReactionsList/AllTab.tsx
View File

@ -52,10 +52,10 @@ const AllReactionsListItem = ({ item, getCustomEmoji }: IAllReactionsListItemPro
getCustomEmoji={getCustomEmoji}
/>
<View style={styles.textContainer}>
<Text style={[styles.allListNPeopleReacted, { color: colors.bodyText }]}>
<Text style={[styles.allListNPeopleReacted, { color: colors.fontDefault }]}>
{count === 1 ? I18n.t('1_person_reacted') : I18n.t('N_people_reacted', { n: count })}
</Text>
<Text style={[styles.allListWhoReacted, { color: colors.auxiliaryText }]}>{displayNames}</Text>
<Text style={[styles.allListWhoReacted, { color: colors.fontSecondaryInfo }]}>{displayNames}</Text>
</View>
</View>
);

6
app/containers/ReactionsList/ReactionsTabBar.tsx
View File

@ -37,7 +37,7 @@ const TabBarItem = ({ tab, index, goToPage, getCustomEmoji }: ITabBarItem) => {
>
<View style={styles.tabBarItem}>
{tab._id === 'All' ? (
<Text style={[styles.allTabItem, { color: colors.auxiliaryTintColor }]}>{I18n.t('All')}</Text>
<Text style={[styles.allTabItem, { color: colors.fontHint }]}>{I18n.t('All')}</Text>
) : (
<>
<Emoji
@ -46,7 +46,7 @@ const TabBarItem = ({ tab, index, goToPage, getCustomEmoji }: ITabBarItem) => {
customEmojiStyle={styles.customEmojiStyle}
getCustomEmoji={getCustomEmoji}
/>
<Text style={[styles.reactionCount, { color: colors.auxiliaryTintColor }]}>{tab.usernames.length}</Text>
<Text style={[styles.reactionCount, { color: colors.fontHint }]}>{tab.usernames.length}</Text>
</>
)}
</View>
@ -68,7 +68,7 @@ const ReactionsTabBar = ({ tabs, activeTab, goToPage, getCustomEmoji }: IReactio
style={{
width: tabWidth,
borderBottomWidth: isActiveTab ? 2 : 1,
borderColor: isActiveTab ? colors.tintActive : colors.separatorColor
borderColor: isActiveTab ? colors.strokeHighlight : colors.strokeLight
}}
key={tab.emoji}
>

4
app/containers/ReactionsList/UsersList.tsx
View File

@ -23,7 +23,7 @@ const UsersList = ({ tabLabel }: { tabLabel: IReaction }): React.ReactElement =>
contentContainerStyle={styles.listContainer}
ListHeaderComponent={
<View style={styles.emojiNameContainer}>
<Text style={[styles.emojiName, { color: colors.auxiliaryText }]} testID='usersListEmojiName'>
<Text style={[styles.emojiName, { color: colors.fontSecondaryInfo }]} testID='usersListEmojiName'>
{emoji}
</Text>
</View>
@ -32,7 +32,7 @@ const UsersList = ({ tabLabel }: { tabLabel: IReaction }): React.ReactElement =>
<View style={styles.listItemContainer} testID='userItem'>
<Avatar text={item.username} size={36} />
<View style={styles.textContainer}>
<Text style={[styles.usernameText, { color: colors.bodyText }]} numberOfLines={1}>
<Text style={[styles.usernameText, { color: colors.fontDefault }]} numberOfLines={1}>
{useRealName && item.name ? item.name : item.username}
</Text>
</View>

2
app/containers/RoomHeader/RoomHeader.stories.tsx
View File

@ -14,7 +14,7 @@ export default {
const HeaderExample = ({ title, theme = 'light' }: { title: Function; theme?: TSupportedThemes }) => (
// Using View directly instead of Header from react-navigation because it's easier to test.
<View style={{ flex: 1, maxHeight: 48, backgroundColor: themes[theme].headerBackground }}>{title()}</View>
<View style={{ flex: 1, maxHeight: 48, backgroundColor: themes[theme].surfaceNeutral }}>{title()}</View>
);
const RoomHeader = ({ ...props }) => (

8
app/containers/RoomHeader/RoomHeader.tsx
View File

@ -88,7 +88,7 @@ const SubTitle = React.memo(({ usersTyping, subtitle, renderFunc, scale }: TRoom
usersText = usersTyping.join(', ');
}
return (
<Text style={[styles.subtitle, { fontSize, color: colors.auxiliaryText }]} numberOfLines={1}>
<Text style={[styles.subtitle, { fontSize, color: colors.fontSecondaryInfo }]} numberOfLines={1}>
<Text style={styles.typingUsers}>{usersText} </Text>
{usersTyping.length > 1 ? I18n.t('are_typing') : I18n.t('is_typing')}...
</Text>
@ -102,7 +102,7 @@ const SubTitle = React.memo(({ usersTyping, subtitle, renderFunc, scale }: TRoom
// subtitle
if (subtitle) {
return <MarkdownPreview msg={subtitle} style={[styles.subtitle, { fontSize, color: colors.auxiliaryText }]} />;
return <MarkdownPreview msg={subtitle} style={[styles.subtitle, { fontSize, color: colors.fontSecondaryInfo }]} />;
}
return null;
@ -110,7 +110,7 @@ const SubTitle = React.memo(({ usersTyping, subtitle, renderFunc, scale }: TRoom
const HeaderTitle = React.memo(({ title, tmid, prid, scale, testID }: TRoomHeaderHeaderTitle) => {
const { colors } = useTheme();
const titleStyle = { fontSize: TITLE_SIZE * scale, color: colors.headerTitleColor };
const titleStyle = { fontSize: TITLE_SIZE * scale, color: colors.fontTitlesLabels };
if (!tmid && !prid) {
return (
<Text style={[styles.title, titleStyle]} numberOfLines={1} testID={testID}>
@ -163,7 +163,7 @@ const Header = React.memo(
status={status}
teamMain={teamMain}
/>
<Text style={[styles.subtitle, { color: colors.auxiliaryText }]} numberOfLines={1}>
<Text style={[styles.subtitle, { color: colors.fontSecondaryInfo }]} numberOfLines={1}>
{parentTitle}
</Text>
</View>

16
app/containers/RoomItem/Actions.tsx
View File

@ -36,7 +36,7 @@ export const LeftActions = React.memo(({ transX, isRead, width, onToggleReadPres
<Animated.View
style={[
styles.actionLeftButtonContainer,
{ width: width * 2, backgroundColor: colors.tintColor, right: '100%' },
{ width: width * 2, backgroundColor: colors.badgeBackgroundLevel2, right: '100%' },
viewHeight,
animatedStyles
]}
@ -46,7 +46,7 @@ export const LeftActions = React.memo(({ transX, isRead, width, onToggleReadPres
<CustomIcon
size={isCondensed ? CONDENSED_ICON_SIZE : EXPANDED_ICON_SIZE}
name={isRead ? 'flag' : 'check'}
color={colors.buttonText}
color={colors.fontWhite}
/>
</RectButton>
</View>
@ -118,18 +118,18 @@ export const RightActions = React.memo(({ transX, favorite, width, toggleFav, on
styles.actionRightButtonContainer,
{
width,
backgroundColor: colors.favoriteBackground,
backgroundColor: colors.statusFontWarning,
left: '100%'
},
viewHeight,
animatedFavStyles
]}
>
<RectButton style={[styles.actionButton, { backgroundColor: colors.favoriteBackground }]} onPress={toggleFav}>
<RectButton style={[styles.actionButton, { backgroundColor: colors.statusFontWarning }]} onPress={toggleFav}>
<CustomIcon
size={isCondensed ? CONDENSED_ICON_SIZE : EXPANDED_ICON_SIZE}
name={favorite ? 'star-filled' : 'star'}
color={colors.buttonText}
color={colors.fontWhite}
/>
</RectButton>
</Animated.View>
@ -138,18 +138,18 @@ export const RightActions = React.memo(({ transX, favorite, width, toggleFav, on
styles.actionRightButtonContainer,
{
width: width * 2,
backgroundColor: colors.hideBackground,
backgroundColor: colors.buttonBackgroundSecondaryPress,
left: '100%'
},
isCondensed && { height: ROW_HEIGHT_CONDENSED },
animatedHideStyles
]}
>
<RectButton style={[styles.actionButton, { backgroundColor: colors.hideBackground }]} onPress={onHidePress}>
<RectButton style={[styles.actionButton, { backgroundColor: colors.buttonBackgroundSecondaryPress }]} onPress={onHidePress}>
<CustomIcon
size={isCondensed ? CONDENSED_ICON_SIZE : EXPANDED_ICON_SIZE}
name='unread-on-top-disabled'
color={colors.buttonText}
color={colors.fontWhite}
/>
</RectButton>
</Animated.View>

2
app/containers/RoomItem/LastMessage.tsx
View File

@ -75,7 +75,7 @@ const LastMessage = React.memo(({ lastMessage, type, showLastMessage, username,
username,
useRealName
})}
style={[styles.markdownText, { color: alert ? colors.bodyText : colors.auxiliaryText }, alignSelf]}
style={[styles.markdownText, { color: alert ? colors.fontDefault : colors.fontSecondaryInfo }, alignSelf]}
numberOfLines={2}
/>
);

4
app/containers/RoomItem/Tag.tsx
View File

@ -14,8 +14,8 @@ const Tag = React.memo(({ name, testID }: ITag) => {
const { theme } = useTheme();
return (
<View style={[styles.tagContainer, { backgroundColor: themes[theme].borderColor }]}>
<Text style={[styles.tagText, { color: themes[theme].infoText }]} numberOfLines={1} testID={testID}>
<View style={[styles.tagContainer, { backgroundColor: themes[theme].strokeLight }]}>
<Text style={[styles.tagText, { color: themes[theme].fontHint }]} numberOfLines={1} testID={testID}>
{name}
</Text>
</View>

2
app/containers/RoomItem/Title.tsx
View File

@ -9,7 +9,7 @@ const Title = React.memo(({ name, hideUnreadStatus, alert }: ITitleProps) => {
const { colors } = useTheme();
return (
<Text
style={[styles.title, alert && !hideUnreadStatus && styles.alert, { color: colors.titleText }]}
style={[styles.title, alert && !hideUnreadStatus && styles.alert, { color: colors.fontTitlesLabels }]}
ellipsizeMode='tail'
numberOfLines={1}
>

2
app/containers/RoomItem/Touchable.tsx
View File

@ -223,7 +223,7 @@ const Touchable = ({
onPress={handlePress}
testID={testID}
style={{
backgroundColor: isFocused ? colors.chatComponentBackground : colors.backgroundColor
backgroundColor: isFocused ? colors.surfaceTint : colors.surfaceRoom
}}
>
{children}

4
app/containers/RoomItem/UpdatedAt.tsx
View File

@ -17,13 +17,13 @@ const UpdatedAt = React.memo(({ date, hideUnreadStatus, alert }: IUpdatedAtProps
style={[
styles.date,
{
color: colors.auxiliaryText
color: colors.fontSecondaryInfo
},
alert &&
!hideUnreadStatus && [
styles.updateAlert,
{
color: colors.tintColor
color: colors.badgeBackgroundLevel2
}
]
]}

2
app/containers/RoomItem/Wrapper.tsx
View File

@ -19,7 +19,7 @@ const Wrapper = ({ accessibilityLabel, children, displayMode, ...props }: IWrapp
style={[
styles.centerContainer,
{
borderColor: colors.separatorColor
borderColor: colors.strokeLight
}
]}
>

18
app/containers/RoomTypeIcon/OmnichannelRoomIcon.tsx
View File

@ -2,10 +2,10 @@ import React, { useState } from 'react';
import { StyleProp, ViewStyle } from 'react-native';
import { SvgUri } from 'react-native-svg';
import { OmnichannelSourceType, IOmnichannelSource } from '../../definitions';
import { STATUS_COLORS } from '../../lib/constants';
import { OmnichannelSourceType, IOmnichannelSource, TUserStatus } from '../../definitions';
import { useAppSelector } from '../../lib/hooks';
import { CustomIcon, TIconsName } from '../CustomIcon';
import { useUserStatusColor } from '../../lib/hooks/useUserStatusColor';
interface IIconMap {
[key: string]: TIconsName;
@ -24,7 +24,7 @@ interface IOmnichannelRoomIconProps {
size: number;
type: string;
style?: StyleProp<ViewStyle>;
status?: string;
status?: TUserStatus;
sourceType?: IOmnichannelSource;
}
@ -33,15 +33,9 @@ export const OmnichannelRoomIcon = ({ size, style, sourceType, status }: IOmnich
const [svgError, setSvgError] = useState(false);
const baseUrl = useAppSelector(state => state.server?.server);
const connected = useAppSelector(state => state.meteor?.connected);
const userStatusColor = useUserStatusColor(status || 'offline');
const customIcon = (
<CustomIcon
name={iconMap[sourceType?.type || 'other']}
size={size}
style={style}
color={STATUS_COLORS[status || 'offline']}
/>
);
const customIcon = <CustomIcon name={iconMap[sourceType?.type || 'other']} size={size} style={style} color={userStatusColor} />;
if (!svgError && sourceType?.type === OmnichannelSourceType.APP && sourceType.id && sourceType.sidebarIcon && connected) {
return (
@ -49,7 +43,7 @@ export const OmnichannelRoomIcon = ({ size, style, sourceType, status }: IOmnich
<SvgUri
height={size}
width={size}
color={STATUS_COLORS[status || 'offline']}
color={userStatusColor}
uri={`${baseUrl}/api/apps/public/${sourceType.id}/get-sidebar-icon?icon=${sourceType.sidebarIcon}`}
style={style}
onError={() => setSvgError(true)}

2
app/containers/RoomTypeIcon/index.tsx
View File

@ -55,7 +55,7 @@ const RoomTypeIcon = React.memo(
icon = 'message';
}
return <CustomIcon name={icon} size={size} color={themes[theme].titleText} style={iconStyle} />;
return <CustomIcon name={icon} size={size} color={themes[theme].fontTitlesLabels} style={iconStyle} />;
}
);

2
app/containers/SafeAreaView.tsx
View File

@ -23,7 +23,7 @@ const SafeAreaView = React.memo(({ style, children, vertical = true, ...props }:
const { theme } = useTheme();
return (
<SafeAreaContext
style={[styles.view, { backgroundColor: themes[theme].auxiliaryBackground }, style]}
style={[styles.view, { backgroundColor: themes[theme].surfaceHover }, style]}
edges={vertical ? ['right', 'left'] : undefined}
{...props}
>

2
app/containers/SearchBox/index.tsx
View File

@ -23,7 +23,7 @@ const SearchBox = ({ onChangeText, onSubmitEditing, testID }: TextInputProps): J
}, []);
return (
<View testID='searchbox' style={{ backgroundColor: colors.backgroundColor }}>
<View testID='searchbox' style={{ backgroundColor: colors.surfaceRoom }}>
<FormTextInput
autoCapitalize='none'
autoCorrect={false}

Some files were not shown because too many files have changed in this diff Show More