diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap
index d5231909aa..46237d3a71 100644
--- a/__tests__/__snapshots__/Storyshots.test.js.snap
+++ b/__tests__/__snapshots__/Storyshots.test.js.snap
@@ -1038,287 +1038,120 @@ exports[`Storyshots Avatar list Avatar 1`] = `
`;
-exports[`Storyshots List header 1`] = `
-
-
-
-
- Chats
-
-
-
-
- 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 List icon 1`] = `
-
-
-
-
-
-
-
-
-
-`;
-
-exports[`Storyshots List pressable 1`] = `
-
-
-
- View
-
- View
-
-
-
-`;
-
-exports[`Storyshots List separator 1`] = `
-
-
-
-
-
-`;
-
-exports[`Storyshots List title and subtitle 1`] = `
-
-
+ >
-
+
+
+
- Chats
+ 1
-
-
-
-
+
+
+
- Chats
+ 1
+
+
+
+
+
+
+
- All
+ 1
+
+
+
+`;
+
+exports[`Storyshots Header Buttons common 1`] = `
+Array [
+
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
+
+
+ ,
+
+
+
+
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+ ,
+
-
-
-`;
-
-exports[`Storyshots List with FlatList 1`] = `
-
-
-
+ >
-
-
-
-
-
-
- 0
-
-
-
+ Cancel
+
-
+
+ ,
+
+
+
+
-
-
-
- 1
-
-
-
+
+
-
+
+ ,
+
+
+
-
-
-
- 2
-
-
-
+
+
-
+
+ ,
+
+
+
-
-
-
- 3
-
-
-
+
+
-
+
+ ,
+
+
+
-
-
-
- 4
-
-
-
+
+
-
+
+ ,
+]
+`;
+
+exports[`Storyshots Header Buttons icons 1`] = `
+Array [
+
+
-
-
-
- 5
-
-
-
+
+
-
+
-
-
-
- 6
-
-
-
+
+
-
+
+ ,
+
+
-
-
-
- 7
-
-
-
+
+
-
-
-
-
-
-
- 8
-
-
-
+
+
-
+
-
-
-
- 9
-
-
-
+
+
-
-
-
-
-
-
-
-
-`;
-
-exports[`Storyshots List with bigger font 1`] = `
-
-
-
-
-
- Chats
+
+
+
+ ,
+]
+`;
+
+exports[`Storyshots Header Buttons themes 1`] = `
+Array [
+
+
+
- View
-
- View
-
-
- Chats
+
+
- Chats
+ Threads
- View
-
- View
-
-
- Chats
+
-
-
-`;
-
-exports[`Storyshots List with black theme 1`] = `
-
- ,
+
-
+
-
- Chats
-
-
-
- View
-
- View
-
-
- Chats
+
+
- Chats
+ Threads
- View
-
- View
-
-
- Chats
+
-
-
-`;
-
-exports[`Storyshots List with custom color 1`] = `
-,
+
-
+ >
-
- Chats
+
-
-
-
-
-`;
-
-exports[`Storyshots List with dark theme 1`] = `
-
-
-
+
- Chats
+ Threads
- View
-
- View
-
-
- Chats
+
+
+ ,
+]
+`;
+
+exports[`Storyshots Header Buttons title 1`] = `
+Array [
+
+
-
- Chats
-
-
-
- View
-
- View
-
-
@@ -3187,402 +3214,633 @@ exports[`Storyshots List with dark theme 1`] = `
Object {
"backgroundColor": "transparent",
"fontFamily": "System",
- "fontSize": 14,
+ "fontSize": 17,
"fontWeight": "400",
},
Object {
- "color": "#6D6D72",
+ "color": "#6C727A",
},
]
}
>
- Chats
+ threads
-
-
-
-`;
-
-exports[`Storyshots List with icon 1`] = `
-
-
-
-
+ />
-
-
-
-
-
-
-
- Icon Left
+ threads
+ ,
+
-
- Icon Right
+ threads
-
-
-
-
-
+ search
+
-
-
-
+ />
-
-
-
-
-
-
-
- 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
+ threads
+
+
- 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
+ search
-
-
-
-
-
-
+
+
+ ,
+]
+`;
+
+exports[`Storyshots List header 1`] = `
+
+
+
+
+ Chats
+
+
+
+
+ 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 List icon 1`] = `
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots List pressable 1`] = `
+
+
+
+ View
+
+ View
+
+
+
+`;
+
+exports[`Storyshots List separator 1`] = `
+
+
+
+
+
+`;
+
+exports[`Storyshots List title and subtitle 1`] = `
+
+
+
+
+
+
+
+ Chats
+
@@ -3647,45 +3905,111 @@ exports[`Storyshots List with icon 1`] = `
]
}
>
- Show Action Indicator
+ Chats
+
+
+ All
+
+
+
+
+
-
-
-
-
-
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
@@ -3706,7 +4030,7 @@ exports[`Storyshots List with icon 1`] = `
`;
-exports[`Storyshots List with section and info 1`] = `
+exports[`Storyshots List with FlatList 1`] = `
+
+
- Section Item
+ 0
@@ -3828,6 +4203,11 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
+
+
- Section Item
+ 1
@@ -3896,25 +4276,9 @@ exports[`Storyshots List with section and info 1`] = `
/>
-
- Section Item
+ 2
@@ -3981,6 +4345,11 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
+
+
- Section Item
+ 3
@@ -4049,38 +4418,61 @@ exports[`Storyshots List with section and info 1`] = `
/>
-
- Chats
-
+
+
+ 4
+
+
+
+
+
- Section Item
+ 5
@@ -4161,6 +4558,11 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
+
+
- Section Item
+ 6
@@ -4227,66 +4629,63 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
-
-
- Chats
-
-
-
- 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
-
+
+
+ 7
+
+
+
+
+
- Section Item
+ 8
@@ -4367,6 +4771,11 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
+
+
- Section Item
+ 9
@@ -4433,39 +4842,37 @@ exports[`Storyshots List with section and info 1`] = `
]
}
/>
+
+
+
-
- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
-
-
+ />
`;
-exports[`Storyshots List with small font 1`] = `
+exports[`Storyshots List with bigger font 1`] = `
`;
-exports[`Storyshots Markdown list Markdown 1`] = `
-
-
-
- Short Text
-
-
-
+
+
-
+
+ Chats
+
+
+
+ View
+
+ View
+
+
+
+ Chats
+
+
+
+
+
+
+ Chats
+
+
+
+ View
+
+ View
+
+
- This is Rocket.Chat
-
-
+
+ Chats
+
+
+
-
+
+`;
+
+exports[`Storyshots List with custom color 1`] = `
+
+
+
- Long Text
-
+ />
-
-
+
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
+ Object {
+ "color": "red",
+ },
+ ]
+ }
+ >
+ Chats
+
+
+
-
- Line Break Text
-
-
+
+
+`;
+
+exports[`Storyshots List with dark theme 1`] = `
+
+
-
+
+
-
+
- a
-
-
-
-
-
-
+ Chats
+
+
+
- b
-
-
-
-
-
-
+ View
+
- c
-
-
-
-
-
-
-
-
-
-
+ View
+
+
+
+ Chats
+
+
+
+
+
- d
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+ Chats
+
+
+
- e
-
-
-
-
- Edited
-
-
-
-
+ View
+
- This is edited
-
-
+ View
+
+
- (
- edited
- )
-
-
+
+ Chats
+
+
+
-
+
+`;
+
+exports[`Storyshots List with icon 1`] = `
+
+
+
- Preview
-
+ />
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
- a b c d e
-
-
- @rocket.cat @name1 @all @here @unknown #general #unknown
-
-
+
+
+
+
+
+
+
- Testing: 😃 👍 :marioparty:
-
+ "flex": 1,
+ "justifyContent": "center",
+ }
+ }
+ >
+
+ Icon Left
+
+
+
-
- Mentions
-
+ />
-
-
- rocket.cat
-
-
-
-
-
+ Icon Right
+
+
+
- name1
-
-
+
+
+
+
+
+
+
+
+
+
+
-
-
-
+
+
+
+
+
+
- all
-
-
-
-
-
- here
-
-
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
-
-
-
+ Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industrys standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+
+
+
- @unknown
-
-
+
+
+
+
+
+
+
-
- Mentions with Real Name
-
+ />
-
-
- Rocket Cat
-
-
-
-
-
- Name
-
-
-
-
-
+ Show Action Indicator
+
+
+
- all
-
-
-
-
-
- here
-
-
-
-
-
- @unknown
-
-
+ "alignItems": "center",
+ "justifyContent": "center",
+ }
+ }
+ >
+
+
+
+
+
+
-
- Hashtag
-
-
+
+
+`;
+
+exports[`Storyshots List with section and info 1`] = `
+
+
-
+
+
-
- #test-channel
-
-
+
+
-
-
-
+
+
+ Section Item
+
+
+
+
+
- #unknown
-
-
-
-
- Emoji
-
-
-
-
+
- Unicode: 😃😇👍
-
-
-
-
- Shortnames:
-
-
- 😂
-
-
+
+
+ Section Item
+
+
+
+
+
- 👍
-
-
-
+
+
-
- Custom emojis:
-
+ />
+
-
+
+ >
+
+ Section Item
+
+
+
-
-
-
+ />
-
-
-
-
-
+ undefined,
+ Object {
+ "height": 92,
+ },
+ ]
+ }
+ >
+
+
+ Section Item
+
+
+
+
-
-
-
-
+
+
-
+
- 😃
-
-
+ Chats
+
+
+
- 👍
-
-
+
+
-
-
-
-
+
+ >
+
+ Section Item
+
+
+
-
-
-
- Block Quote
-
-
-
-
-
+
- This is block quote
-
-
+ Object {
+ "color": "#0d0e12",
+ },
+ ]
+ }
+ >
+ Section Item
+
+
+
-
-
-
+
- this is a normal line
-
-
-
-
- Links
-
-
-
+ Chats
+
+
+
+
-
- Markdown link
+ 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
-
-
+
+
+
+
+
+ Section Item
+
+
+
+
+
+
- :
-
-
+
+
+ Section Item
+
+
+
+
+
+
- [description](url)
-
-
-
+ 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 List with small font 1`] = `
+
+
+
+
-
- Formatted Link
+ Chats
-
-
+
- :
-
-
+ View
+
- <url|description>
-
-
-
-
- Image
-
-
-
-
+ View
+
+
-
-
-
- Headers
-
-
-
-
+
- Header 1
-
-
-
+ Chats
+
+
+
+
-
+
- Header 2
-
-
-
-
+ Chats
+
+
+
- Header 3
-
-
-
-
+ View
+
- Header 4
-
-
-
-
+ View
+
+
+
- Header 5
-
-
+ Object {
+ "color": "#6d6d72",
+ },
+ ]
+ }
+ >
+ Chats
+
+
+
+
+
+
+`;
+
+exports[`Storyshots Markdown list Markdown 1`] = `
+
+
+
+ Short Text
+
+
- Header 6
+ This is Rocket.Chat
@@ -6943,7 +7312,7 @@ exports[`Storyshots Markdown list Markdown 1`] = `
]
}
>
- Inline Code
+ Long Text
- This is
-
-
- inline code
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
@@ -7026,7 +7378,7 @@ exports[`Storyshots Markdown list Markdown 1`] = `
]
}
>
- Code Block
+ Line Break Text
- Inline
+ a
+
+
+
+
- code
+ b
+
+
+
+
- has
+ c
+
+
+
+
+
+
+
+
- back-ticks around
+ d
+
+
+
+
+
+
+
+
+
+
+
+
- it.
+ e
-
- Code block
-
-
- Lists
+ Edited
-
-
-
- •
-
-
-
+
-
-
- Open Source
-
-
-
-
-
-
-
- •
-
-
-
-
-
- Rocket.Chat
-
-
-
-
-
- ◦
-
-
-
-
-
- nodejs
-
-
-
-
-
-
-
- ◦
-
-
-
-
-
- ReactNative
-
-
-
-
-
-
+ (
+ edited
+ )
+
+
- Numbered Lists
+ Preview
-
-
-
- 1.
-
-
-
+
-
-
- Open Source
-
-
-
-
-
+ a b c d e
+
+
-
-
- 2.
-
-
-
+
-
-
- Rocket.Chat
-
-
-
-
+ "backgroundColor": "transparent",
+ "fontFamily": "System",
+ "fontSize": 16,
+ "fontWeight": "400",
+ },
+ Object {
+ "color": "#2f343d",
+ },
+ ]
+ }
+ >
+ Testing: 😃 👍 :marioparty:
+
- Emphasis
+ Mentions
+ rocket.cat
+
+
- Strong emphasis, aka bold, with
+
+ name1
+
+
+
+
+
+ all
+
+
- asterisks
+
+ here
+
+
- or
+
+ @unknown
+
+
+
+
+ Mentions with Real Name
+
+
+
+
+ Rocket Cat
+
+
+
+
+
+ Name
+
+
+
+
+
+ all
+
+
- underscores
+
+
+
+ here
+
+
+
+
+
+ @unknown
@@ -7883,7 +8228,7 @@ exports[`Storyshots Markdown list Markdown 1`] = `
]
}
>
- Table
+ Hashtag
-
+
+ #test-channel
+
+
+
+
+
+ #unknown
+
+
+
+
+ Emoji
+
+
+
-
+ Unicode: 😃😇👍
+
+
+
+
+ Shortnames:
+
+
-
-
-
-
-
-
- First Header
-
-
-
-
-
-
- Second Header
-
-
-
-
-
-
-
-
- Content from cell 1
-
-
-
-
-
-
- Content from cell 2
-
-
-
-
-
-
-
-
- Content in the first column
-
-
-
-
-
-
- Content in the second column
-
-
-
-
-
-
-
+ 😂
+
+ 👍
+
+
+
+
- Click to see full table
+ Custom emojis:
-
-
-
-
-`;
-
-exports[`Storyshots Message list message 1`] = `
-
-
-
- Simple
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
-
-
-
-
+ }
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
-
+
+
+
+
+
+
+
+
+
+ 😃
+
+
+ 👍
+
+
+
+
+
+
+
+
- Long message
+ Block Quote
-
+
+
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
-
-
+ This is block quote
+
+
+
+
+ this is a normal line
+
+
- Grouped messages
+ Links
-
-
+
-
-
-
-
-
-
-
-
-
+ Markdown link
+
+
+
+ :
+
+
+ [description](url)
+
+
+
+
+
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- ...
-
-
-
-
-
-
-
-
-
-
-
+ Formatted Link
+
+
+
-
+
-
-
-
-
-
-
-
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
- 10:00 AM
-
-
-
-
-
- Different user
-
-
-
-
-
-
-
+ "backgroundColor": "#f1f2f4",
+ "borderColor": "#f1f2f4",
+ "borderRadius": 4,
+ "borderWidth": 1,
+ "color": "#2f343d",
+ "fontFamily": "Courier New",
+ "fontWeight": "400",
+ },
+ ]
+ }
+ >
+ <url|description>
+
+
+
+ Image
+
-
-
+
-
-
-
-
-
- This is the third message
-
-
-
-
-
-
-
+ }
+ />
+
+
+ Headers
+
-
-
+
-
+
+
+
-
-
-
-
- This is the second message
-
-
-
-
-
-
-
-
-
+ Header 2
+
+
+
-
-
+
-
+
+
+
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- This is the first message
-
-
-
-
-
-
-
+ "backgroundColor": "transparent",
+ "fontFamily": "System",
+ "fontSize": 16,
+ "fontWeight": "400",
+ },
+ Array [
+ Object {},
+ Object {
+ "backgroundColor": "transparent",
+ "fontFamily": "System",
+ "fontSize": 18,
+ "fontWeight": "600",
+ },
+ ],
+ ]
+ }
+ >
+ Header 4
+
+
+
+
+ Header 5
+
+
+
+
+ Header 6
+
+
- Without header
+ Inline Code
-
-
+
-
-
-
-
-
- Message
-
-
-
-
-
-
-
+ Array [
+ Object {},
+ Object {
+ "alignItems": "flex-start",
+ "flexDirection": "row",
+ "flexWrap": "wrap",
+ "justifyContent": "flex-start",
+ "marginBottom": 0,
+ "marginTop": 0,
+ },
+ ],
+ ]
+ }
+ >
+ This is
+
+
+ inline code
+
+
- With alias
+ Code Block
-
+
+
+ Inline
+
+
+ code
+
+
+ has
+
+
+ back-ticks around
+
+
+ it.
+
+
+
+ Code block
+
+
+
+
+ Lists
+
+
+
-
-
+
+
+
+
+ Open Source
+
+
+
+
+
+
+
+ •
+
+
+
+
+
-
-
-
-
-
-
+ Rocket.Chat
+
+
+
-
-
+
+
+
-
- Diego Mello
-
- @
- diego.mello
-
-
-
+ "color": "#2f343d",
+ },
+ ]
+ }
+ >
- 10:00 AM
-
-
-
-
-
- Message
-
+ ],
+ ]
+ }
+ >
+ nodejs
-
+
-
-
-
-
-
-
-
-
-
-
-
+ ◦
+
-
-
-
- Diego Mello
-
- @
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
+ ],
+ ]
+ }
+ >
+ ReactNative
-
+
@@ -10398,241 +10042,177 @@ exports[`Storyshots Message list message 1`] = `
"color": "#0d0e12",
},
Object {
- "marginBottom": 0,
- "marginTop": 30,
+ "marginHorizontal": 10,
+ "marginVertical": 10,
},
]
}
>
- Edited
+ Numbered Lists
-
+
-
-
+
+
+
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+ 2.
+
+
+
+
+
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
-
-
-
-
+ Rocket.Chat
+
+
@@ -10649,306 +10229,652 @@ exports[`Storyshots Message list message 1`] = `
"color": "#0d0e12",
},
Object {
- "marginBottom": 0,
- "marginTop": 30,
+ "marginHorizontal": 10,
+ "marginVertical": 10,
},
]
}
>
- Encrypted
+ Emphasis
-
-
+
-
+
+ asterisks
+
+
+ or
+
+
+ underscores
+
+
+
+
+ Table
+
+
+
+
+ }
+ scrollEnabled={false}
+ showsVerticalScrollIndicator={false}
+ style={
+ Array [
+ Object {
+ "borderBottomWidth": 1,
+ "borderRightWidth": 1,
+ },
+ Object {
+ "borderColor": "#e1e5e8",
+ "maxHeight": 300,
+ "maxWidth": 200,
+ },
+ ]
+ }
+ >
+
-
-
-
-
-
-
-
- diego.mello
+
+ First Header
+
-
- 10:00 AM
-
+
+
+ Second Header
+
+
+
-
-
+
-
-
+
+
+
+
+
- Message
-
+ undefined,
+ undefined,
+ ],
+ ]
+ }
+ >
+ Content from cell 2
-
-
+
+
+
+
+
+ Content in the first column
+
+
+
+
+
+
-
+ Content in the second column
-
+
-
+
+
+ Click to see full table
+
+
+
+`;
+
+exports[`Storyshots Message list message 1`] = `
+
+
+
+ Simple
+
+
+
+
+
+
+
+
-
+
-
-
-
- Message Encrypted without Header
-
-
-
-
+
+
-
+ 10:00 AM
+
+
+
+
+
-
-
-
-
+ ],
+ ]
+ }
+ >
+ Message
+
+
+
+ Long message
+
-
-
-
-
- Message Encrypted with Reactions
-
-
-
-
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+
+
+ Grouped messages
+
+
+
+
+
+
+
+
+
-
-
-
-
+ />
+
+
-
-
- 😂
-
-
- 1
-
-
+ diego.mello
+
-
-
-
-
-
-
- 1
-
-
-
-
-
-
- 🤔
-
-
- 1
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Thread with emoji🙂 😂
-
-
-
-
-
-
-
-
-
-
-
-
-
+ 10:00 AM
+
-
-
- Thread reply encrypted
+
+ ...
+
@@ -12054,7 +11694,7 @@ exports[`Storyshots Message list message 1`] = `
Object {
"headers": undefined,
"priority": "high",
- "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=100",
+ "uri": "https://open.rocket.chat/avatar/Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.?format=png&size=100",
}
}
style={
@@ -12128,7 +11768,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- diego.mello
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
+
-
-
-
- Temp message encrypted
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ This is the third message
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-
+ ],
+ ]
+ }
+ >
+ This is the second message
+
+
@@ -12450,220 +12210,236 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- Message Edited encrypted
-
-
-
-
-
-
-
-
-
+ This is the first message
+
+
-
-
+ Without header
+
+
+ }
+ >
+
-
-
+
+ >
+
+ Message
+
+
+
+
+
+
+ With alias
+
+
+
+
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
-
+
+ Diego Mello
- This message has error and is encrypted
+ @
+ diego.mello
-
+ 10:00 AM
+
+
+
+
-
+ Message
-
+
@@ -12966,7 +12726,7 @@ exports[`Storyshots Message list message 1`] = `
Object {
"headers": undefined,
"priority": "high",
- "uri": "https://open.rocket.chat/avatar/diego.mello?format=png&size=100",
+ "uri": "https://open.rocket.chat/avatar/Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.?format=png&size=100",
}
}
style={
@@ -13040,7 +12800,25 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- diego.mello
+ Diego Mello
+
+ @
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
-
-
-
-
- Read Receipt encrypted with Header
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- Read Receipt encrypted without Header
-
-
-
-
-
-
-
-
-
+ Message
+
+
-
-
-
@@ -13390,7 +12906,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Block Quote
+ Edited
-
-
-
-
-
- Testing block quote
-
-
-
-
+ ],
+ ]
+ }
+ >
+ Message
+
+
+
+ Encrypted
+
-
- Testing block quote
+ Message
-
-
-
+
- Testing block quote
-
-
+ undefined,
+ Object {
+ "fontFamily": "custom",
+ "fontStyle": "normal",
+ "fontWeight": "normal",
+ },
+ Object {},
+ ]
+ }
+ >
+
+
+
+
-
- Lists
-
-
+
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
- •
-
-
-
@@ -14211,7 +13526,7 @@ exports[`Storyshots Message list message 1`] = `
}
>
- Dogs
+ Message Encrypted without Header
-
+
-
-
- ◦
-
-
-
-
-
- cats
-
-
-
-
-
+
-
-
- ◦
-
-
-
-
-
- cats
-
-
-
-
+
+
@@ -14414,27 +13607,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Numerated lists
-
-
-
- 1.
-
-
- Dogs
+ Message Encrypted with Reactions
+
+
+
+
+
+
+
- 2.
+ 😂
-
-
-
+
+
+
+
+
+
- Cats
-
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+ 1
+
+
+
+
+
+
+ 🤔
+
+
+ 1
+
+
+
+
+
+
+
@@ -14788,27 +14237,238 @@ exports[`Storyshots Message list message 1`] = `
-
- Numerated lists in separated messages
-
+
+
+
+
+
+
+
+ Thread with emoji🙂 😂
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Thread reply encrypted
+
+
+
+
+
+
+
-
+
-
-
- 1.
-
-
- Dogs
+ Temp message encrypted
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- 2.
-
-
-
-
- Cats
-
+
@@ -15217,27 +14767,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Static avatar
-
-
-
+
+
+ Message Edited encrypted
+
+
+
+
- Message
-
-
+
+
+
+
+
-
- Full name
-
-
+
-
+ >
+
+
+
+
+
+
+
-
-
-
+ diego.mello
+
-
-
+ 10:00 AM
+
+
+ "opacity": 1,
+ "paddingLeft": 10,
+ "paddingVertical": 5,
+ }
+ }
+ >
+
+
+
+
+
+
- Diego Mello
+
+ This message has error and is encrypted
+
-
- 10:00 AM
-
-
-
-
- Message
+
-
+
-
- Mentions
-
-
-
- rocket.cat
-
-
+
+ Read Receipt encrypted with Header
+
+
+
+
-
-
-
- diego.mello
-
-
-
-
-
- all
-
-
-
-
-
- here
-
-
-
-
-
- #general
-
-
+ ]
+ }
+ >
+
+
+
+
-
-
-
-
-
+
+
+
+
+
+
+
-
-
-
-
-
-
-
-
+
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- rocket.cat
-
-
- Lorem ipsum dolor
-
-
- diego.mello
-
-
+
+ Read Receipt encrypted without Header
+
+
+
+
- sit amet,
-
-
- all
-
-
- consectetur adipiscing
-
-
- here
-
-
- elit, sed do eiusmod tempor
-
-
- #general
-
-
- incididunt ut labore et dolore magna aliqua.
-
-
+ ]
+ }
+ >
+
+
+
+
+
+
+
@@ -16584,7 +15892,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Emojis
+ Block Quote
-
-
+
- 👊🤙👏
-
-
+
+
+ Testing block quote
+
+
+
+
-
- Single Emoji
-
+
+
+
+
+
+ Testing block quote
+
+
+
+
- 👏
+ Testing block quote
@@ -17096,7 +16476,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Custom Emojis
+ Lists
-
-
+ >
+ •
+
-
-
-
-
-
+
+ Dogs
+
+
+
-
-
-
-
-
+
+
+ ◦
+
+
+
-
+
+
+ cats
+
+
+
+
+
-
-
-
-
-
-
-
-
-
- Single Custom Emojis
-
-
-
-
+
+
+ ◦
+
+
+
+
+
+ cats
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Numerated lists
+
+
+
+
-
+
+ 1.
+
+
+
+
+
+ Dogs
+
+
+
+
+
+
-
+ 2.
+
+
+
+
+ >
+
+ Cats
+
+
-
+
@@ -17748,7 +17309,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Normal Emoji + Custom Emojis
+ Numerated lists in separated messages
-
-
- 🤙
-
-
-
+ 1.
+
+
+
+
+ >
+
+ Dogs
+
+
-
+
-
- Four emoji
-
-
+
-
-
-
-
-
+
+ 2.
+
+
+
+
+
+ Cats
+
+
+
+
+
+
+
+
+
+
+
+ Static avatar
+
+
+
+
+
+
+
+
+
+
+
+
+
- 🤙
-
-
-
-
-
- 🤙🤙
+ Message
@@ -18352,7 +17989,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Time format
+ Full name
- diego.mello
+ Diego Mello
- 10 November 2017
+ 10:00 AM
@@ -18551,7 +18188,7 @@ exports[`Storyshots Message list message 1`] = `
}
>
- Testing
+ Message
@@ -18603,7 +18240,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Reactions
+ Mentions
+ rocket.cat
+
+
- Reactions
+
-
-
-
-
-
-
+
- 😂
-
-
- 3
-
-
-
-
-
+
+
+
-
-
-
-
+
- 13
-
-
-
-
-
+
+
+
-
+
- 🤔
-
-
- 1
-
-
-
-
-
+
+
+
-
-
-
-
-
+ #general
+
+
-
- Multiple reactions
-
+ rocket.cat
+
+
- Multiple Reactions
+ Lorem ipsum dolor
-
-
-
-
-
-
+
-
-
-
+ sit amet,
+
+
+ all
+
+
- 1
-
-
-
-
-
+ consectetur adipiscing
+
+
-
+
-
-
-
+ elit, sed do eiusmod tempor
+
+
+ #general
+
+
+ incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+
+
+ Emojis
+
+
+
+
+
+
+
+
+
- 1
-
-
+ }
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+
+
-
-
+
+
+ 10:00 AM
+
+
+
+
+
-
-
-
+ 👊🤙👏
+
+
+
+
+
+
+
+
+
+ Single Emoji
+
+
+
+
+
+
+
+
+
- 1
-
-
+ }
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+
+
-
-
+
+
+ 10:00 AM
+
+
+
+
+
- ❤️
-
-
+ 👏
+
+
+
+
+
+
+
+
+
+ Custom Emojis
+
+
+
+
+
+
+
+
+
- 1
-
-
+ }
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
+
+
+
+
-
-
- 🐶
-
-
- 1
-
-
+ diego.mello
+
-
+ 10:00 AM
+
+
+
+
-
- 😀
-
-
- 1
-
+ />
-
-
-
-
- 😬
-
-
- 1
-
-
-
-
+ >
+
+
-
- 😁
-
-
+
+
- 1
-
-
-
-
+ >
+
+
-
+
-
-
+ style={
+ Object {
+ "bottom": 0,
+ "left": 0,
+ "position": "absolute",
+ "right": 0,
+ "top": 0,
+ }
+ }
+ />
-
+
@@ -20220,7 +19991,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Intercalated users
+ Single Custom Emojis
- rocket.cat
+ diego.mello
-
- Fourth message
-
+
+
@@ -20452,6 +20231,27 @@ exports[`Storyshots Message list message 1`] = `
+
+ Normal Emoji + Custom Emojis
+
- Third message
+ 🤙
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
-
- 10:00 AM
-
-
-
-
-
- Second message
-
+
+
@@ -20912,6 +20522,27 @@ exports[`Storyshots Message list message 1`] = `
+
+ Four emoji
+
- First message
+ 🤙
+
+
+
+
+
+ 🤙🤙
@@ -21161,7 +20854,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Date and Unread separators
+ Time format
- rocket.cat
+ diego.mello
- 10:00 AM
+ 10 November 2017
@@ -21360,7 +21053,7 @@ exports[`Storyshots Message list message 1`] = `
}
>
- Fourth message
+ Testing
@@ -21393,68 +21086,27 @@ exports[`Storyshots Message list message 1`] = `
-
-
- unread
-
-
-
- Nov 10, 2017
-
-
+ Reactions
+
- Third message
+ Reactions
-
-
-
-
-
-
-
- unread
-
-
-
-
-
-
-
-
-
-
+
-
+
+ 😂
+
+
+ 3
+
+
+
+
+
- Second message
-
-
+
+
+
+
+ 13
+
+
+
+
+
+
+ 🤔
+
+
+ 1
+
+
+
+
+
+
+
+
+
+
+
+ Multiple reactions
+
- rocket.cat
+ diego.mello
- Second message
+ Multiple Reactions
-
-
-
-
-
-
-
-
- Nov 10, 2017
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- First message
-
-
-
-
-
-
-
-
-
- With image
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
- This is a description
+ 1
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
-
-
- This is a description
+ 1
+
+
+
+
@@ -22991,163 +22212,117 @@ exports[`Storyshots Message list message 1`] = `
}
/>
-
+
+ 1
+
+
-
-
-
-
-
-
-
- With video
-
-
-
-
-
-
-
-
+ >
+
+ ❤️
+
+
+ 1
+
+
-
-
-
-
-
- diego.mello
-
+
+ 🐶
+
+
+ 1
+
+
-
- 10:00 AM
-
-
-
-
-
-
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+ 😀
+
+
+ >
+ 1
+
+
-
-
-
-
-
- diego.mello
-
-
-
+ 😬
+
+
+ 1
+
+
+
+
- 10:00 AM
-
-
-
-
+
+ 😁
+
+
+ 1
+
+
+
+
-
-
-
+
+
+
+
+
+
@@ -23579,7 +22722,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- With audio
+ Intercalated users
- diego.mello
+ rocket.cat
-
-
-
-
-
-
-
- 00:00
-
-
-
-
- This is a description
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- First message
+ Fourth message
@@ -24104,44 +22995,93 @@ exports[`Storyshots Message list message 1`] = `
style={
Array [
Object {
- "flex": 1,
- "marginLeft": 46,
+ "borderRadius": 4,
+ "height": 36,
+ "width": 36,
+ },
+ Object {
+ "marginTop": 4,
},
- false,
]
}
>
-
+
+
+
+
+
+
+
-
+ >
+ diego.mello
+
-
- 00:00
+ 10:00 AM
-
+
- This is a description
+
+ Third message
+
-
+
@@ -24317,6 +23221,72 @@ exports[`Storyshots Message list message 1`] = `
}
}
>
+
+
+
+
+
+
+
-
-
+ >
+ rocket.cat
+
-
+ >
+ 10:00 AM
+
+
+
- 00:00
+
+ Second message
+
@@ -24501,130 +23455,139 @@ exports[`Storyshots Message list message 1`] = `
style={
Array [
Object {
- "flex": 1,
- "marginLeft": 46,
+ "borderRadius": 4,
+ "height": 36,
+ "width": 36,
+ },
+ Object {
+ "marginTop": 4,
},
- false,
]
}
>
-
-
-
-
+
+
+
+
+
+
+ >
+
+ diego.mello
+
+
- 00:00
+ 10:00 AM
+
+
+
+
+
+ First message
+
@@ -24659,7 +23663,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Message with reply
+ Date and Unread separators
- diego.mello
+ rocket.cat
- I'm fine!
+ Fourth message
-
-
-
-
- I'm a very long long title and I'll break
-
-
- 10:00 AM
-
-
-
-
- How are you?
-
-
-
-
+
+
+ unread
+
+
+
+ Nov 10, 2017
+
+
- I'm fine!
+ Third message
-
+
+
+
+
+
+
+ unread
+
+
+
+
+
+
+
+
-
+
+
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
-
-
- How are you?
-
-
-
-
+ Second message
-
+
-
- Message with read receipt
-
- diego.mello
+ rocket.cat
- I'm fine!
+ Second message
@@ -25648,98 +24557,49 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
-
-
-
- I'm fine!
-
-
-
-
-
-
-
+
+
+ Nov 10, 2017
+
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- I'm fine!
+ First message
-
-
-
@@ -26128,7 +24850,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Message with thread
+ With image
-
-
-
- How are you?
-
-
-
+
-
-
+
-
-
-
+
+
+
+
- 1 reply
+
+ This is a description
+
-
- Nov 10
-
@@ -26639,147 +25343,185 @@ exports[`Storyshots Message list message 1`] = `
10:00 AM
-
-
-
- How are you?
-
-
-
+
-
-
+
-
-
+
+
+
+
- +999 replies
+
+ This is a description
+
+
+
+
-
- Nov 10
-
+
+ With video
+
-
-
-
-
- How are you?
-
-
-
-
-
-
-
-
-
+
+
+
+ diego.mello
+
+
- I'm fine!
+ 10:00 AM
+
+
+
+
+
+
+
+
+ This is a description
+
+
+
+
+
@@ -27045,110 +25861,20 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- Thread with emoji🙂 😂
-
-
-
-
-
-
-
-
-
+
+
+
+ diego.mello
+
+
- I'm fine!
+ 10:00 AM
+
+
+
+
+
+
@@ -27244,6 +26062,27 @@ exports[`Storyshots Message list message 1`] = `
+
+ With audio
+
-
-
-
-
- Markdown: link block code
-
-
-
-
-
-
-
-
-
+
+
+
+ diego.mello
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
- I'm fine!
+ 00:00
+
+
+ This is a description
+
+
+
+
+
@@ -27509,166 +26504,10 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- I'm fine!
+
+ First message
+
@@ -27741,200 +26598,185 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- How are you?
-
-
-
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
+ }
+ thumbTintColor={false}
+ value={0}
+ />
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ 00:00
+
+
+ This is a description
+
+
@@ -27973,198 +26815,146 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
+ }
+ thumbTintColor={false}
+ value={0}
+ />
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ 00:00
@@ -28205,196 +26995,146 @@ exports[`Storyshots Message list message 1`] = `
-
-
-
-
- Thread with attachment
-
-
-
+
-
-
-
-
-
-
-
+
+
+
-
-
-
-
-
-
+ }
+ thumbTintColor={false}
+ value={0}
+ />
- Sent an attachment
+ 00:00
@@ -28421,7 +27161,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Sequential thread messages following thread button
+ Message with reply
- How are you?
+ I'm fine!
-
+
-
-
+ ]
+ }
+ >
+ I'm a very long long title and I'll break
+
+
+ 10:00 AM
+
+
- 1 reply
+
+ How are you?
+
-
- Nov 10
-
@@ -28780,26 +27545,21 @@ exports[`Storyshots Message list message 1`] = `
>
-
+
+
+
+ diego.mello
+
+
+ 10:00 AM
+
+
+
+
- I'm fine!
+
+ I'm fine!
+
-
-
-
-
-
-
-
-
-
-
-
+
+ rocket.cat
+
+
+ 10:00 AM
+
+
+
+ >
+
+ How are you?
+
+
+
+
+
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
+
+ Message with read receipt
+
-
+
+
+
+ diego.mello
+
+
+ 10:00 AM
+
+
+
+
- Sent an attachment
+
+ I'm fine!
+
@@ -29187,27 +28149,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Sequential thread messages following thread reply
-
-
-
-
-
- How are you?
-
-
-
-
-
+
+
+
+ I'm fine!
+
+
+
+
+
+
+
+
+
-
-
- I'm fine!
-
-
-
-
-
-
-
-
-
-
-
-
-
+ >
+ diego.mello
+
-
-
-
-
- Cool!
+ 10:00 AM
-
-
-
-
-
-
-
-
-
-
-
-
+
-
-
+ >
+ I'm fine!
+
+
-
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
+
+
@@ -29766,115 +28527,86 @@ exports[`Storyshots Message list message 1`] = `
>
-
-
+
-
-
+ >
+ I'm fine!
+
+
-
-
-
- Sent an attachment
-
-
-
+
+
@@ -29898,7 +28630,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Discussion
+ Message with thread
-
- Started a discussion:
-
-
- This is a discussion
-
+
+
+
+ How are you?
+
+
+
-
+
- No messages yet
+ 1 reply
+ >
+ Nov 10
+
@@ -30407,42 +29141,47 @@ exports[`Storyshots Message list message 1`] = `
10:00 AM
-
- Started a discussion:
-
-
- This is a discussion
-
+
+
+
+ How are you?
+
+
+
-
+
- 1 message
+ +999 replies
+
+
+
+
+ How are you?
+
+
+
+
+
+
+
+
-
-
-
- diego.mello
-
-
+
- 10:00 AM
+ I'm fine!
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Thread with emoji🙂 😂
+
+
- Started a discussion:
-
-
- Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
-
-
-
-
-
-
- 10 messages
-
-
-
- Nov 10
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
- Started a discussion:
-
-
- This is a discussion
-
-
-
-
-
-
-
- +999 messages
-
-
+
- Nov 10
+ I'm fine!
@@ -31198,27 +29746,6 @@ exports[`Storyshots Message list message 1`] = `
-
- URL
-
+
+
+
+
+ Markdown: link block code
+
+
+
+
+
+
+
+
-
-
-
- diego.mello
-
-
+
- 10:00 AM
+ I'm fine!
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+
+
-
-
- Rocket.Chat - Free, Open Source, Enterprise Team Chat
-
-
- Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting.
-
-
-
+
-
+
+
-
- Google
-
-
- Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
-
-
+ I'm fine!
+
@@ -31619,20 +30243,110 @@ exports[`Storyshots Message list message 1`] = `
+
+
+
+
+ How are you?
+
+
+
+
+
+
+
+
-
-
+
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
-
- Message
-
-
-
-
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
-
-
-
- Google
-
-
- Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
-
-
-
@@ -31956,22 +30475,114 @@ exports[`Storyshots Message list message 1`] = `
-
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+
+
+
-
-
- Google
-
-
- Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
-
+ />
+
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
-
- Custom fields
-
+
+
+
+
+ Thread with attachment
+
+
+
+
+
+
+
+
-
-
-
- diego.mello
-
-
+
- 10:00 AM
-
-
-
-
-
- Message
-
+ Sent an attachment
-
-
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
-
-
- Custom fields
-
-
-
-
-
- Field 1
-
-
- Value 1
-
-
-
-
- Field 2
-
-
- Value 2
-
-
-
-
- Field 3
-
-
- Value 3
-
-
-
-
- Field 4
-
-
- Value 4
-
-
-
-
- Field 5
-
-
- Value 5
-
-
-
-
-
@@ -32689,7 +30923,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Two short custom fields
+ Sequential thread messages following thread button
- Message
+ How are you?
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
+ "height": 44,
+ "justifyContent": "center",
+ "paddingHorizontal": 15,
+ },
+ Object {
+ "height": 30,
+ },
+ Object {
+ "backgroundColor": "#1d74f5",
+ },
+ ]
+ }
+ testID="message-thread-button-How are you?"
+ >
-
- Custom fields
-
-
-
-
-
- Field 1
-
-
- Value 1
-
-
-
-
- Field 2
-
-
- Value 2
-
-
-
-
-
-
-
-
-
- rocket.cat
-
-
- 10:00 AM
-
-
+
+
-
- Custom fields 2
-
+ 1 reply
-
-
-
- Field 1
-
-
- Value 1
-
-
-
-
- Field 2
-
-
- Value 2
-
-
-
+
+ Nov 10
+
-
- Broadcast
-
-
-
-
- diego.mello
-
-
-
+
- 10:00 AM
-
-
-
-
-
- Broadcasted message
-
+ I'm fine!
-
-
-
-
-
-
- Reply
-
-
-
-
- Archived
-
-
-
-
- diego.mello
-
-
+
- 10:00 AM
-
-
-
-
-
- This message is inside an archived room
-
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
@@ -33957,134 +31544,60 @@ exports[`Storyshots Message list message 1`] = `
-
- Error
-
-
-
+
-
-
-
-
-
-
-
+
+
+
+
+
+
+
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
+ Sent an attachment
-
-
-
- This message has error
-
-
-
-
-
+ Sequential thread messages following thread reply
+
+
+ }
+ >
+
+
+
+
+
+ How are you?
+
-
-
- diego.mello
-
-
- 10:00 AM
+
+
+
+
+
-
-
-
+
+
-
-
+
+
- This message has error too
+ I'm fine!
-
+
-
- Temp
-
-
-
-
- diego.mello
-
-
+
- 10:00 AM
-
-
-
-
-
- Temp message
-
+ Cool!
@@ -34687,27 +32089,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Editing
-
-
-
-
- diego.mello
-
-
+
- 10:00 AM
-
-
-
-
-
- Message being edited
-
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
@@ -34938,27 +32236,6 @@ exports[`Storyshots Message list message 1`] = `
-
- Removed
-
-
- Message removed
-
+
+
+ Sent an attachment
+
+
@@ -35123,7 +32400,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Joined
+ Discussion
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
- Has joined the channel
+ Started a discussion:
+
+ This is a discussion
+
+
+
+
+
+
+
+ No messages yet
+
+
+
+
-
- Room name changed
-
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
- Room name changed to: New name by diego.mello
+ Started a discussion:
+
+
+ This is a discussion
+
+
+
+
+
+
+ 1 message
+
+
+
+ Nov 10
+
+
-
- Message pinned
-
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
- Message pinned
+ Started a discussion:
+
+
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+
+
+
+
+
+
+ 10 messages
+
+
+
+ Nov 10
+
+
-
- Has left the channel
-
-
- Has left the channel
-
-
-
-
-
-
-
- User removed
-
-
-
-
-
-
-
+
+ diego.mello
+
+
+
-
-
+ 10:00 AM
+
-
-
- User rocket.cat removed by diego.mello
+ Started a discussion:
+
+
+ This is a discussion
+
+
+
+
+
+
+ +999 messages
+
+
+
+ Nov 10
+
+
@@ -35953,7 +33719,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- User added
+ URL
-
- User rocket.cat added by diego.mello
-
-
-
-
-
-
-
- User muted
-
-
-
-
-
-
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
-
-
-
-
+
+ Rocket.Chat - Free, Open Source, Enterprise Team Chat
+
+
+ Rocket.Chat is the leading open source team chat software solution. Free, unlimited and completely customizable with on-premises and SaaS cloud hosting.
+
+
+
+
- User rocket.cat muted by diego.mello
-
+
+
+ Google
+
+
+ Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
+
+
+
-
- User unmuted
-
-
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
- User rocket.cat unmuted by diego.mello
-
+
+
+ Google
+
+
+ Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
+
+
+
-
- Role added
-
+
-
-
-
-
-
-
- rocket.cat was set admin by diego.mello
-
+ >
+ Google
+
+
+ Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.
+
+
+
@@ -36617,7 +34570,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Role removed
+ Custom fields
-
- rocket.cat is no longer admin by diego.mello
-
-
-
-
-
-
-
- Changed description
-
-
-
-
-
-
+
+ diego.mello
+
+
+
-
+
+
+
+
-
+ >
+ Message
+
+
-
-
-
- Room description changed to: new description by diego.mello
-
-
-
-
-
-
-
- Changed announcement
-
-
-
-
-
-
-
+
+ rocket.cat
+
+
+ 10:00 AM
+
+
+
-
-
-
-
-
- Room announcement changed to: new announcement by diego.mello
-
+ >
+
+ Custom fields
+
+
+
+
+
+ Field 1
+
+
+ Value 1
+
+
+
+
+ Field 2
+
+
+ Value 2
+
+
+
+
+ Field 3
+
+
+ Value 3
+
+
+
+
+ Field 4
+
+
+ Value 4
+
+
+
+
+ Field 5
+
+
+ Value 5
+
+
+
+
+
@@ -37115,7 +35191,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Changed topic
+ Two short custom fields
-
- Room topic changed to: new topic by diego.mello
-
-
-
-
-
-
-
- Changed type
-
-
-
-
-
-
+
+ diego.mello
+
+
+
-
-
-
-
-
-
- Room type changed to: public by diego.mello
-
-
-
-
-
-
-
- Custom style
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
- diego.mello
-
-
-
- 10:00 AM
-
-
-
-
+
+
+
-
-
-
-
-
-
- Markdown emphasis
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+ rocket.cat
+
+
+ 10:00 AM
+
+
- diego.mello
+
+ Custom fields
+
-
-
- 10:00 AM
-
-
-
-
-
- Italic with single
-
-
- underscore
-
-
- or double
-
-
+
+ Field 1
+
+
+ Value 1
+
+
+
+
+ Field 2
+
+
+ Value 2
+
+
+
+
+
+
+
- underscores
-
-
+
- . Bold with single
-
-
- asterisk
-
-
- or double
-
-
+ rocket.cat
+
+
- asterisks
-
+ ]
+ }
+ >
+ 10:00 AM
+
+
- . Strikethrough with single
-
-
- Strikethrough
+ Array [
+ Object {},
+ Object {
+ "alignItems": "flex-start",
+ "flexDirection": "row",
+ "flexWrap": "wrap",
+ "justifyContent": "flex-start",
+ "marginBottom": 0,
+ "marginTop": 0,
+ },
+ ],
+ ]
+ }
+ >
+ Custom fields 2
+
-
- or double
-
-
+
+ Field 1
+
+
+ Value 1
+
+
+
- Strikethrough
-
-
+ ]
+ }
+ >
+
+ Field 2
+
+
+ Value 2
+
+
+
+
@@ -38272,7 +35894,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown headers
+ Broadcast
- H1
+ Broadcasted message
-
+
-
+
- H2
-
-
-
- H3
-
-
-
-
- H4
-
-
-
-
- H5
+
-
-
- H6
+ Reply
-
+
@@ -38706,7 +36227,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown links
+ Archived
- Support
-
-
-
- Google
-
-
-
-
-
-
-
- I\`m an inline-style link
-
-
-
-
-
-
-
- https://google.com
-
+ This message is inside an archived room
@@ -39152,57 +36478,115 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown image
+ Error
-
+
-
+ >
+
+
+
+
+
+
+
-
-
-
+ diego.mello
+
-
-
+
+ 10:00 AM
+
-
-
- diego.mello
-
-
- 10:00 AM
+
-
+
+
+
-
+ This message has error
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ "backgroundColor": "transparent",
+ "fontFamily": "System",
+ "fontSize": 16,
+ "fontWeight": "500",
+ "lineHeight": 22,
+ },
+ Object {
+ "color": "#0d0e12",
+ },
+ ]
+ }
+ >
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+ This message has error too
+
+
+
@@ -39390,7 +36951,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown code
+ Temp
-
+
- Inline
-
-
- code
-
-
- has
-
-
- back-ticks around
-
-
- it.
+ Temp message
-
- Code block
-
-
@@ -39748,7 +37208,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown quote
+ Editing
-
-
-
-
-
- Quote
-
-
-
-
+ ],
+ ]
+ }
+ >
+ Message being edited
+
+
@@ -40031,7 +37459,7 @@ exports[`Storyshots Message list message 1`] = `
]
}
>
- Markdown table
+ Removed
-
-
-
- diego.mello
-
-
-
+
+
+
+
+
+
+ Joined
+
+
+
+
+
+
+
+
- 10:00 AM
-
+
+
-
+
+
+
+ Has joined the channel
+
+
+
+
+
+
+
+ Room name changed
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room name changed to: New name by diego.mello
+
+
+
+
+
+
+
+ Message pinned
+
+
+
+
+
+
+
+
-
-
-
-
-
-
-
- First Header
-
-
-
-
-
-
- Second Header
-
-
-
-
-
-
-
-
- Content from cell 1
-
-
-
-
-
-
- Content from cell 2
-
-
-
-
-
-
-
-
- Content in the first column
-
-
-
-
-
-
- Content in the second column
-
-
-
-
-
-
-
-
- Click to see full table
-
+ />
+
+
+ Message pinned
+
+
-
-
+
+ Has left the channel
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Has left the channel
+
+
+
+
+
+
+
+ User removed
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat removed by diego.mello
+
+
+
+
+
+
+
+ User added
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat added by diego.mello
+
+
+
+
+
+
+
+ User muted
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat muted by diego.mello
+
+
+
+
+
+
+
+ User unmuted
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ User rocket.cat unmuted by diego.mello
+
+
+
+
+
+
+
+ Role added
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat was set admin by diego.mello
+
+
+
+
+
+
+
+ Role removed
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ rocket.cat is no longer admin by diego.mello
+
+
+
+
+
+
+
+ Changed description
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room description changed to: new description by diego.mello
+
+
+
+
+
+
+
+ Changed announcement
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room announcement changed to: new announcement by diego.mello
+
+
+
+
+
+
+
+ Changed topic
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room topic changed to: new topic by diego.mello
+
+
+
+
+
+
+
+ Changed type
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Room type changed to: public by diego.mello
+
+
+
+
+
+
+
+ Custom style
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Message
+
+
+
+
+
+
+
+
+
+ Markdown emphasis
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Italic with single
+
+
+ underscore
+
+
+ or double
+
+
+ underscores
+
+
+ . Bold with single
+
+
+ asterisk
+
+
+ or double
+
+
+ asterisks
+
+
+ . Strikethrough with single
+
+
+ Strikethrough
+
+
+ or double
+
+
+ Strikethrough
+
+
+
+
+
+
+
+
+
+ Markdown headers
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ H1
+
+
+
+
+ H2
+
+
+
+
+ H3
+
+
+
+
+ H4
+
+
+
+
+ H5
+
+
+
+
+ H6
+
+
+
+
+
+
+
+
+
+ Markdown links
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Support
+
+
+
+ Google
+
+
+
+
+
+
+
+ I\`m an inline-style link
+
+
+
+
+
+
+
+ https://google.com
+
+
+
+
+
+
+
+
+
+
+ Markdown image
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Markdown code
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+ Inline
+
+
+ code
+
+
+ has
+
+
+ back-ticks around
+
+
+ it.
+
+
+
+ Code block
+
+
+
+
+
+
+
+
+
+ Markdown quote
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+ Quote
+
+
+
+
+
+
+
+
+
+
+
+ Markdown table
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ diego.mello
+
+
+
+ 10:00 AM
+
+
+
+
+
+
+
+
+
+
+
+ First Header
+
+
+
+
+
+
+ Second Header
+
+
+
+
+
+
+
+
+ Content from cell 1
+
+
+
+
+
+
+ Content from cell 2
+
+
+
+
+
+
+
+
+ Content in the first column
+
+
+
+
+
+
+ Content in the second column
+
+
+
+
+
+
+
+
+ Click to see full table
+
+
+
+
+
+
+
+
+
+
+`;
+
+exports[`Storyshots RoomItem list roomitem 1`] = `
+
+
+
+ Basic
+
+ View
+
+ User
+
+ View
+ View
+
+ Type
+
+ View
+ View
+ View
+ View
+ View
+ View
+ View
+
+ User status
+
+ View
+ View
+ View
+ View
+ View
+
+ Alerts
+
+ View
+ View
+ View
+ View
+ View
+ View
+ View
+
+ Last Message
+
+ View
+ View
+ View
+ View
+ View
+ View
+ View
+
+
+`;
+
+exports[`Storyshots UiKitMessage list uikitmessage 1`] = `
+
+
+
+
+ Section
+
+
+ Section + Markdown List
+
+
+ Section + Overflow
+
+
+ Section + image
+
+
+ Section + button
+
+
+ Section + Select
+
+
+ Section + DatePicker
+
+
+ Section + Multi Select
+
+
+ Image
+
+
+ Context
+
+
+ Action - Buttons
+
+
+ Fields
+
+
+ Action - Select
+
+
+
+
+`;
+
+exports[`Storyshots UiKitModal list UiKitModal 1`] = `
+
+
+
+
+ Modal - Section and Selects
+
+
+ Modal - Section Accessories
+
+
+ Modal - Form Input
+
+
+ Modal - Form TextArea
+
+
+ Modal - Images
+
+
+ Modal - Actions
+
+
+ Modal - Contexts and Dividers
+
+
+ Modal - Input with error
+
+
+ Modal - Multilne with error
+
+
+ Modal - DatePicker with error
+
+
+
+
`;
-exports[`Storyshots RoomItem list roomitem 1`] = `
-
-
+
+ 9
+
+
+
+
+ +99
+
+
+
+
- Basic
+ 9
- View
+
+
+ +999
+
+
+
+
- User
+ 9
- View
- View
+
+
+ 9
+
+
+
+
- Type
+ 9
- View
- View
- View
- View
- View
- View
- View
+
+
+`;
+
+exports[`Storyshots Unread Badge different mention types 1`] = `
+
+
+ 1
+
+
+
+
- User status
+ 1
- View
- View
- View
- View
- View
+
+
+ 1
+
+
+
+
- Alerts
+ 1
- View
- View
- View
- View
- View
- View
- View
- View
+
+
+ 1
+
+
+
+
- Last Message
+ 1
- View
- View
- View
- View
- View
- View
- View
-
+
+
+ 1
+
+
+
`;
-exports[`Storyshots UiKitMessage list uikitmessage 1`] = `
-
-
+
+ 9
+
+
+
+
+ +999
+
+
+
+`;
+
+exports[`Storyshots Unread Badge small 1`] = `
+
+
+
+ 9
+
+
+
-
+
+ +99
+
+
+
+`;
+
+exports[`Storyshots Unread Badge themes 1`] = `
+Array [
+
+
- Section
-
-
- Section + Markdown List
+ 1
+
+
- Section + Overflow
-
-
- Section + image
+ 1
+
+
- Section + button
-
-
- Section + Select
+ 1
+
+
- Section + DatePicker
-
-
- Section + Multi Select
+ 1
+
+ ,
+
+
- Image
-
-
- Context
+ 1
+
+
- Action - Buttons
+ 1
+
+
- Fields
+ 1
+
+
- Action - Select
+ 1
-
-
-`;
-
-exports[`Storyshots UiKitModal list UiKitModal 1`] = `
-
- ,
+
-
-
- Modal - Section and Selects
-
-
- Modal - Section Accessories
-
+
- Modal - Form Input
-
-
- Modal - Form TextArea
+ 1
+
+
- Modal - Images
-
-
- Modal - Actions
+ 1
+
+
- Modal - Contexts and Dividers
-
-
- Modal - Input with error
+ 1
+
+
- Modal - Multilne with error
-
-
- Modal - DatePicker with error
+ 1
-
-
+ ,
+]
`;
diff --git a/app/constants/colors.js b/app/constants/colors.js
index a6b3314f89..0e6e784380 100644
--- a/app/constants/colors.js
+++ b/app/constants/colors.js
@@ -12,6 +12,7 @@ export const SWITCH_TRACK_COLOR = {
const mentions = {
unreadBackground: '#6C727A',
+ tunreadBackground: '#1d74f5',
mentionMeColor: '#DB0C27',
mentionMeBackground: '#F5455C',
mentionGroupColor: '#E26D0E',
diff --git a/app/containers/Header/index.js b/app/containers/Header/index.js
index 2137a71ad5..95ba8c7a20 100644
--- a/app/containers/Header/index.js
+++ b/app/containers/Header/index.js
@@ -5,6 +5,7 @@ import { View, StyleSheet } from 'react-native';
import { themes } from '../../constants/colors';
import { themedHeader } from '../../utils/navigation';
import { isIOS, isTablet } from '../../utils/deviceInfo';
+import { withTheme } from '../../theme';
// Get from https://github.com/react-navigation/react-navigation/blob/master/packages/stack/src/views/Header/HeaderSegment.tsx#L69
export const headerHeight = isIOS ? 44 : 56;
@@ -53,4 +54,4 @@ Header.propTypes = {
headerRight: PropTypes.element
};
-export default Header;
+export default withTheme(Header);
diff --git a/app/containers/HeaderButton.js b/app/containers/HeaderButton.js
deleted file mode 100644
index 4dc72f8ccb..0000000000
--- a/app/containers/HeaderButton.js
+++ /dev/null
@@ -1,107 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { HeaderButtons, HeaderButton, Item } from 'react-navigation-header-buttons';
-
-import { CustomIcon } from '../lib/Icons';
-import { isIOS } from '../utils/deviceInfo';
-import { themes } from '../constants/colors';
-import I18n from '../i18n';
-import { withTheme } from '../theme';
-
-export const headerIconSize = 23;
-
-const CustomHeaderButton = React.memo(withTheme(({ theme, ...props }) => (
-
-)));
-
-export const CustomHeaderButtons = React.memo(props => (
-
-));
-
-export const DrawerButton = React.memo(({ navigation, testID, ...otherProps }) => (
-
- - navigation.toggleDrawer()} testID={testID} {...props} />
+
+));
+
+export const CloseModal = React.memo(({
+ navigation, testID, onPress = () => navigation.pop(), ...props
+}) => (
+
+ -
+
-
+
) : null,
headerRight: submit ? () => (
-
- -
+
-
+
) : null
});
}
diff --git a/app/views/NewMessageView.js b/app/views/NewMessageView.js
index c012cd406f..a471500693 100644
--- a/app/views/NewMessageView.js
+++ b/app/views/NewMessageView.js
@@ -17,7 +17,7 @@ import I18n from '../i18n';
import log, { logEvent, events } from '../utils/log';
import SearchBox from '../containers/SearchBox';
import { CustomIcon } from '../lib/Icons';
-import { CloseModalButton } from '../containers/HeaderButton';
+import * as HeaderButton from '../containers/HeaderButton';
import StatusBar from '../containers/StatusBar';
import { themes } from '../constants/colors';
import { withTheme } from '../theme';
@@ -51,7 +51,7 @@ const styles = StyleSheet.create({
class NewMessageView extends React.Component {
static navigationOptions = ({ navigation }) => ({
- headerLeft: () => ,
+ headerLeft: () => ,
title: I18n.t('New_Message')
})
diff --git a/app/views/NewServerView/index.js b/app/views/NewServerView/index.js
index 5d5e470440..9548e0082a 100644
--- a/app/views/NewServerView/index.js
+++ b/app/views/NewServerView/index.js
@@ -26,7 +26,7 @@ import log, { logEvent, events } from '../../utils/log';
import { animateNextTransition } from '../../utils/layoutAnimation';
import { withTheme } from '../../theme';
import { setBasicAuth, BASIC_AUTH_KEY } from '../../utils/fetch';
-import { CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import { showConfirmationAlert } from '../../utils/info';
import database from '../../lib/database';
import ServerInput from './ServerInput';
@@ -111,7 +111,7 @@ class NewServerView extends React.Component {
const { adding, navigation } = this.props;
if (adding) {
navigation.setOptions({
- headerLeft: () =>
+ headerLeft: () =>
});
}
}
diff --git a/app/views/ProfileView/index.js b/app/views/ProfileView/index.js
index 95555c4ee5..62280bb126 100644
--- a/app/views/ProfileView/index.js
+++ b/app/views/ProfileView/index.js
@@ -24,7 +24,7 @@ import Button from '../../containers/Button';
import Avatar from '../../containers/Avatar';
import { setUser as setUserAction } from '../../actions/login';
import { CustomIcon } from '../../lib/Icons';
-import { DrawerButton, PreferencesButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import StatusBar from '../../containers/StatusBar';
import { themes } from '../../constants/colors';
import { withTheme } from '../../theme';
@@ -37,10 +37,10 @@ class ProfileView extends React.Component {
title: I18n.t('Profile')
};
if (!isMasterDetail) {
- options.headerLeft = () => ;
+ options.headerLeft = () => ;
}
options.headerRight = () => (
- navigation.navigate('UserPreferencesView')} testID='preferences-view-open' />
+ navigation.navigate('UserPreferencesView')} testID='preferences-view-open' />
);
return options;
}
diff --git a/app/views/ReadReceiptView/index.js b/app/views/ReadReceiptView/index.js
index ba704dea36..b7456c77a9 100644
--- a/app/views/ReadReceiptView/index.js
+++ b/app/views/ReadReceiptView/index.js
@@ -8,7 +8,7 @@ import { connect } from 'react-redux';
import Avatar from '../../containers/Avatar';
import styles from './styles';
import ActivityIndicator from '../../containers/ActivityIndicator';
-import { CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import I18n from '../../i18n';
import RocketChat from '../../lib/rocketchat';
import StatusBar from '../../containers/StatusBar';
@@ -22,7 +22,7 @@ class ReadReceiptView extends React.Component {
title: I18n.t('Read_Receipt')
};
if (isMasterDetail) {
- options.headerLeft = () => ;
+ options.headerLeft = () => ;
}
return options;
}
diff --git a/app/views/RegisterView.js b/app/views/RegisterView.js
index 23711a7cd0..750944fed8 100644
--- a/app/views/RegisterView.js
+++ b/app/views/RegisterView.js
@@ -10,7 +10,7 @@ import log, { logEvent, events } from '../utils/log';
import sharedStyles from './Styles';
import Button from '../containers/Button';
import I18n from '../i18n';
-import { LegalButton } from '../containers/HeaderButton';
+import * as HeaderButton from '../containers/HeaderButton';
import { themes } from '../constants/colors';
import { withTheme } from '../theme';
import FormContainer, { FormContainerInner } from '../containers/FormContainer';
@@ -54,7 +54,7 @@ const styles = StyleSheet.create({
class RegisterView extends React.Component {
static navigationOptions = ({ route, navigation }) => ({
title: route.params?.title ?? 'Rocket.Chat',
- headerRight: () =>
+ headerRight: () =>
});
static propTypes = {
diff --git a/app/views/RoomActionsView/index.js b/app/views/RoomActionsView/index.js
index ba007818d7..ec23485dca 100644
--- a/app/views/RoomActionsView/index.js
+++ b/app/views/RoomActionsView/index.js
@@ -21,7 +21,7 @@ import I18n from '../../i18n';
import StatusBar from '../../containers/StatusBar';
import { themes, SWITCH_TRACK_COLOR } from '../../constants/colors';
import { withTheme } from '../../theme';
-import { CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import Markdown from '../../containers/markdown';
import { showConfirmationAlert, showErrorAlert } from '../../utils/info';
import SafeAreaView from '../../containers/SafeAreaView';
@@ -36,7 +36,7 @@ class RoomActionsView extends React.Component {
title: I18n.t('Actions')
};
if (isMasterDetail) {
- options.headerLeft = () => ;
+ options.headerLeft = () => ;
}
return options;
}
diff --git a/app/views/RoomInfoView/index.js b/app/views/RoomInfoView/index.js
index 8b257ce7b1..35e5be5e5d 100644
--- a/app/views/RoomInfoView/index.js
+++ b/app/views/RoomInfoView/index.js
@@ -15,7 +15,7 @@ import sharedStyles from '../Styles';
import RocketChat from '../../lib/rocketchat';
import RoomTypeIcon from '../../containers/RoomTypeIcon';
import I18n from '../../i18n';
-import { CustomHeaderButtons, CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import StatusBar from '../../containers/StatusBar';
import log, { logEvent, events } from '../../utils/log';
import { themes } from '../../constants/colors';
@@ -26,7 +26,6 @@ import EventEmitter from '../../utils/events';
import Livechat from './Livechat';
import Channel from './Channel';
-import Item from './Item';
import Direct from './Direct';
import SafeAreaView from '../../containers/SafeAreaView';
import { goRoom } from '../../utils/goRoom';
@@ -104,12 +103,12 @@ class RoomInfoView extends React.Component {
const rid = route.params?.rid;
const showCloseModal = route.params?.showCloseModal;
navigation.setOptions({
- headerLeft: showCloseModal ? () => : undefined,
+ headerLeft: showCloseModal ? () => : undefined,
title: t === 'd' ? I18n.t('User_Info') : I18n.t('Room_Info'),
headerRight: showEdit
? () => (
-
- -
+ {
const isLivechat = t === 'l';
@@ -118,7 +117,7 @@ class RoomInfoView extends React.Component {
}}
testID='room-info-view-edit-button'
/>
-
+
)
: null
});
diff --git a/app/views/RoomMembersView/index.js b/app/views/RoomMembersView/index.js
index 340a4e7957..a4110a9456 100644
--- a/app/views/RoomMembersView/index.js
+++ b/app/views/RoomMembersView/index.js
@@ -15,7 +15,7 @@ import log from '../../utils/log';
import I18n from '../../i18n';
import SearchBox from '../../containers/SearchBox';
import protectedFunction from '../../lib/methods/helpers/protectedFunction';
-import { CustomHeaderButtons, Item } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import StatusBar from '../../containers/StatusBar';
import ActivityIndicator from '../../containers/ActivityIndicator';
import { withTheme } from '../../theme';
@@ -97,9 +97,9 @@ class RoomMembersView extends React.Component {
navigation.setOptions({
title: I18n.t('Members'),
headerRight: () => (
-
- -
+
-
+
);
}
return (
-
+
{threadsEnabled ? (
- -
+
-
+
) : (
- (searching ? null : (
-
- -
+
-
+
))
};
}
@@ -883,7 +875,7 @@ class RoomsListView extends React.Component {
};
renderHeader = () => {
- const { isMasterDetail, theme } = this.props;
+ const { isMasterDetail } = this.props;
if (!isMasterDetail) {
return null;
@@ -892,7 +884,6 @@ class RoomsListView extends React.Component {
const options = this.getHeader();
return (
);
diff --git a/app/views/SearchMessagesView/index.js b/app/views/SearchMessagesView/index.js
index 37dfc8b119..4f6d896e0e 100644
--- a/app/views/SearchMessagesView/index.js
+++ b/app/views/SearchMessagesView/index.js
@@ -20,7 +20,7 @@ import { themes } from '../../constants/colors';
import { withTheme } from '../../theme';
import { getUserSelector } from '../../selectors/login';
import SafeAreaView from '../../containers/SafeAreaView';
-import { CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
import database from '../../lib/database';
import { sanitizeLikeString } from '../../lib/database/utils';
@@ -31,7 +31,7 @@ class SearchMessagesView extends React.Component {
};
const showCloseModal = route.params?.showCloseModal;
if (showCloseModal) {
- options.headerLeft = () => ;
+ options.headerLeft = () => ;
}
return options;
}
diff --git a/app/views/SelectedUsersView.js b/app/views/SelectedUsersView.js
index a6624f2687..d9c84c18cd 100644
--- a/app/views/SelectedUsersView.js
+++ b/app/views/SelectedUsersView.js
@@ -14,7 +14,7 @@ import I18n from '../i18n';
import log, { logEvent, events } from '../utils/log';
import SearchBox from '../containers/SearchBox';
import sharedStyles from './Styles';
-import { Item, CustomHeaderButtons } from '../containers/HeaderButton';
+import * as HeaderButton from '../containers/HeaderButton';
import StatusBar from '../containers/StatusBar';
import { themes } from '../constants/colors';
import { animateNextTransition } from '../utils/layoutAnimation';
@@ -119,9 +119,9 @@ class SelectedUsersView extends React.Component {
title,
headerRight: () => (
(!maxUsers || showButton) && (
-
- -
+
-
+
);
}
diff --git a/app/views/StatusView.js b/app/views/StatusView.js
index e5191df0f7..8783da13e4 100644
--- a/app/views/StatusView.js
+++ b/app/views/StatusView.js
@@ -15,7 +15,7 @@ import log, { logEvent, events } from '../utils/log';
import { LISTENER } from '../containers/Toast';
import { withTheme } from '../theme';
import { getUserSelector } from '../selectors/login';
-import { CustomHeaderButtons, Item, CancelModalButton } from '../containers/HeaderButton';
+import * as HeaderButton from '../containers/HeaderButton';
import store from '../lib/createStore';
import { setUser } from '../actions/login';
import SafeAreaView from '../containers/SafeAreaView';
@@ -73,15 +73,15 @@ class StatusView extends React.Component {
const { navigation, isMasterDetail } = this.props;
navigation.setOptions({
title: I18n.t('Edit_Status'),
- headerLeft: isMasterDetail ? undefined : () => ,
+ headerLeft: isMasterDetail ? undefined : () => ,
headerRight: () => (
-
- -
+
-
+
)
});
}
diff --git a/app/views/ThreadMessagesView/index.js b/app/views/ThreadMessagesView/index.js
index 1124615867..71c2aeee37 100644
--- a/app/views/ThreadMessagesView/index.js
+++ b/app/views/ThreadMessagesView/index.js
@@ -24,7 +24,7 @@ import { themes } from '../../constants/colors';
import { withTheme } from '../../theme';
import { getUserSelector } from '../../selectors/login';
import SafeAreaView from '../../containers/SafeAreaView';
-import { CloseModalButton } from '../../containers/HeaderButton';
+import * as HeaderButton from '../../containers/HeaderButton';
const Separator = React.memo(({ theme }) => );
Separator.propTypes = {
@@ -39,7 +39,7 @@ class ThreadMessagesView extends React.Component {
title: I18n.t('Threads')
};
if (isMasterDetail) {
- options.headerLeft = () => ;
+ options.headerLeft = () => ;
}
return options;
}
diff --git a/app/views/WithoutServersView.js b/app/views/WithoutServersView.js
index 136359df18..7cda426021 100644
--- a/app/views/WithoutServersView.js
+++ b/app/views/WithoutServersView.js
@@ -5,7 +5,7 @@ import {
import PropTypes from 'prop-types';
import ShareExtension from 'rn-extensions-share';
-import { CancelModalButton } from '../containers/HeaderButton';
+import * as HeaderButton from '../containers/HeaderButton';
import sharedStyles from './Styles';
import I18n from '../i18n';
import { themes } from '../constants/colors';
@@ -33,7 +33,7 @@ class WithoutServerView extends React.Component {
static navigationOptions = () => ({
title: 'Rocket.Chat',
headerLeft: () => (
-
diff --git a/package.json b/package.json
index fc64259184..179259e8fa 100644
--- a/package.json
+++ b/package.json
@@ -109,7 +109,6 @@
"react-native-unimodules": "0.10.1",
"react-native-vector-icons": "7.0.0",
"react-native-webview": "10.3.2",
- "react-navigation-header-buttons": "3.0.5",
"react-redux": "7.2.0",
"reactotron-react-native": "5.0.0",
"redux": "4.0.5",
diff --git a/patches/react-navigation-header-buttons+3.0.5.patch b/patches/react-navigation-header-buttons+3.0.5.patch
deleted file mode 100644
index 3b47953e81..0000000000
--- a/patches/react-navigation-header-buttons+3.0.5.patch
+++ /dev/null
@@ -1,12 +0,0 @@
-diff --git a/node_modules/react-navigation-header-buttons/src/HeaderButtons.js b/node_modules/react-navigation-header-buttons/src/HeaderButtons.js
-index 70ff376..01fba5e 100644
---- a/node_modules/react-navigation-header-buttons/src/HeaderButtons.js
-+++ b/node_modules/react-navigation-header-buttons/src/HeaderButtons.js
-@@ -144,6 +144,6 @@ const styles = StyleSheet.create({
- }),
- },
- button: {
-- marginHorizontal: 11,
-+ marginHorizontal: 6
- },
- });
diff --git a/storybook/stories/HeaderButtons.js b/storybook/stories/HeaderButtons.js
new file mode 100644
index 0000000000..0d2243c784
--- /dev/null
+++ b/storybook/stories/HeaderButtons.js
@@ -0,0 +1,162 @@
+/* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions, react/prop-types */
+import React from 'react';
+import { storiesOf } from '@storybook/react-native';
+import { View } from 'react-native';
+
+import * as HeaderButton from '../../app/containers/HeaderButton';
+import Header from '../../app/containers/Header';
+import { ThemeContext } from '../../app/theme';
+
+const stories = storiesOf('Header Buttons', module);
+
+const HeaderExample = ({ left, right }) => (
+ }
+ headerRight={right}
+ />
+);
+
+stories.add('title', () => (
+ <>
+ (
+
+
+
+ )}
+ right={() => (
+
+
+
+ )}
+ />
+ (
+
+
+
+
+ )}
+ right={() => (
+
+
+
+
+ )}
+ />
+
+));
+
+stories.add('icons', () => (
+ <>
+ (
+
+
+
+ )}
+ right={() => (
+
+
+
+ )}
+ />
+ (
+
+
+
+
+ )}
+ right={() => (
+
+
+
+
+ )}
+ />
+
+));
+
+stories.add('badge', () => (
+ <>
+ (
+
+ } />
+ } />
+ } />
+
+ )}
+ />
+
+));
+
+const ThemeStory = ({ theme }) => (
+
+ (
+
+
+
+ )}
+ right={() => (
+
+
+ } />
+
+ )}
+ />
+
+);
+
+stories.add('themes', () => (
+ <>
+
+
+
+
+));
+
+stories.add('common', () => (
+ <>
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+ (
+
+ )}
+ />
+
+));
diff --git a/storybook/stories/RoomItem.js b/storybook/stories/RoomItem.js
index a4d221526a..a4cf156ec4 100644
--- a/storybook/stories/RoomItem.js
+++ b/storybook/stories/RoomItem.js
@@ -73,10 +73,9 @@ export default ({ theme }) => {
-
-
-
+
+
(
+
+ {children}
+
+);
+
+stories.add('all', () => (
+
+
+
+
+
+
+
+
+
+));
+
+stories.add('small', () => (
+
+
+
+
+));
+
+stories.add('normal', () => (
+
+
+
+
+));
+
+stories.add('different mention types', () => (
+
+
+
+
+
+
+
+
+
+));
+
+const ThemeStory = ({ theme }) => (
+
+
+
+
+
+
+
+
+);
+
+stories.add('themes', () => (
+ <>
+
+
+
+
+));
diff --git a/storybook/stories/index.js b/storybook/stories/index.js
index 915944f889..d9de68803b 100644
--- a/storybook/stories/index.js
+++ b/storybook/stories/index.js
@@ -10,6 +10,8 @@ import Message from './Message';
import UiKitMessage from './UiKitMessage';
import UiKitModal from './UiKitModal';
import Markdown from './Markdown';
+import './HeaderButtons';
+import './UnreadBadge';
import Avatar from './Avatar';
// import RoomViewHeader from './RoomViewHeader';
diff --git a/yarn.lock b/yarn.lock
index 199afe57fe..e2b1a48864 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -12891,7 +12891,7 @@ react-native-picker-select@7.0.0:
dependencies:
lodash.isequal "^4.5.0"
-react-native-platform-touchable@1.1.1, react-native-platform-touchable@^1.1.1:
+react-native-platform-touchable@1.1.1:
version "1.1.1"
resolved "https://registry.yarnpkg.com/react-native-platform-touchable/-/react-native-platform-touchable-1.1.1.tgz#fde4acc65eea585d28b164d0c3716a42129a68e4"
integrity sha1-/eSsxl7qWF0osWTQw3FqQhKaaOQ=
@@ -13068,13 +13068,6 @@ react-native@^0.63.1:
use-subscription "^1.0.0"
whatwg-fetch "^3.0.0"
-react-navigation-header-buttons@3.0.5:
- version "3.0.5"
- resolved "https://registry.yarnpkg.com/react-navigation-header-buttons/-/react-navigation-header-buttons-3.0.5.tgz#5b8c0fc32bc59382f02015e4b2f19a135b99dca4"
- integrity sha512-b1AsL9k6Klp72CnAq4IF0xgw94FClBIsUr/pGUKa1PI+mStdF0AYZzi9qtYgqQNDIOpqxQ2xYUM9azL2VmPUeQ==
- dependencies:
- react-native-platform-touchable "^1.1.1"
-
react-popper-tooltip@^2.8.3:
version "2.11.1"
resolved "https://registry.yarnpkg.com/react-popper-tooltip/-/react-popper-tooltip-2.11.1.tgz#3c4bdfd8bc10d1c2b9a162e859bab8958f5b2644"