From 8bd918ecf580771da2fe3feaca90b26ee4d28bf9 Mon Sep 17 00:00:00 2001 From: diegolmello Date: Wed, 24 Apr 2019 19:05:42 -0300 Subject: [PATCH 1/4] [FIX] Smaller thread title --- .../__snapshots__/Storyshots.test.js.snap | 114 +++++++----------- app/containers/message/Message.js | 2 +- app/containers/message/styles.js | 7 +- 3 files changed, 47 insertions(+), 76 deletions(-) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index 4b04375be8c..c4ec628041f 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -10821,17 +10821,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -10851,9 +10846,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > @@ -11066,17 +11061,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -11096,9 +11086,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > @@ -11311,17 +11301,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -11341,9 +11326,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > @@ -11556,17 +11541,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -11586,9 +11566,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > @@ -11801,17 +11781,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -11831,9 +11806,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > @@ -12046,17 +12021,12 @@ exports[`Storyshots Message list 1`] = ` Array [ Object { "color": undefined, - "fontSize": 20, + "fontSize": 16, + }, + Object { + "color": "#1d74f5", + "marginRight": 2, }, - Array [ - Object { - "color": "#fff", - "marginRight": 6, - }, - Object { - "color": "#1d74f5", - }, - ], Object { "fontFamily": "custom", "fontStyle": "normal", @@ -12076,9 +12046,9 @@ exports[`Storyshots Message list 1`] = ` "color": "#1d74f5", "flex": 1, "fontFamily": "System", - "fontSize": 16, + "fontSize": 14, "fontStyle": "normal", - "fontWeight": "600", + "fontWeight": "400", } } > diff --git a/app/containers/message/Message.js b/app/containers/message/Message.js index 4e0ab42d533..113f2295517 100644 --- a/app/containers/message/Message.js +++ b/app/containers/message/Message.js @@ -490,7 +490,7 @@ export default class Message extends PureComponent { return ( - + {msg} ); diff --git a/app/containers/message/styles.js b/app/containers/message/styles.js index 954b8ed06fe..53b27f35245 100644 --- a/app/containers/message/styles.js +++ b/app/containers/message/styles.js @@ -220,13 +220,14 @@ export default StyleSheet.create({ flex: 1 }, repliedThreadIcon: { - color: COLOR_PRIMARY + color: COLOR_PRIMARY, + marginRight: 2 }, repliedThreadName: { - fontSize: 16, + fontSize: 14, fontStyle: 'normal', flex: 1, color: COLOR_PRIMARY, - ...sharedStyles.textSemibold + ...sharedStyles.textRegular } }); From 6505d2b5f3f3b87ff7f1d77e155fac73dce40fa7 Mon Sep 17 00:00:00 2001 From: diegolmello Date: Thu, 25 Apr 2019 10:09:27 -0300 Subject: [PATCH 2/4] Remove markdown notation from thread title --- .../__snapshots__/Storyshots.test.js.snap | 240 ++++++++++++++++++ app/containers/message/Message.js | 4 +- app/views/RoomView/Header/Header.js | 4 + package.json | 1 + storybook/stories/Message.js | 5 + yarn.lock | 5 + 6 files changed, 258 insertions(+), 1 deletion(-) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index c4ec628041f..268aa557641 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -11220,6 +11220,246 @@ exports[`Storyshots Message list 1`] = ` /> + + + + + diego.mello + + + + 10:00 AM + + + + +  + + + Markdown: link block code + + + + + + + I’m fine! + + + + + + + + + + + + + + + + diff --git a/app/views/RoomView/Header/Header.js b/app/views/RoomView/Header/Header.js index daa9ea4db06..2a6b9b5a0a4 100644 --- a/app/views/RoomView/Header/Header.js +++ b/app/views/RoomView/Header/Header.js @@ -4,6 +4,7 @@ import { View, Text, StyleSheet, ScrollView } from 'react-native'; import { emojify } from 'react-emojione'; +import removeMarkdown from 'remove-markdown'; import I18n from '../../../i18n'; import sharedStyles from '../../Styles'; @@ -77,6 +78,9 @@ const Header = React.memo(({ } if (title) { title = emojify(title, { output: 'unicode' }); + if (tmid) { + title = removeMarkdown(title); + } } return ( diff --git a/package.json b/package.json index 716a818b480..4aa83ef2b19 100644 --- a/package.json +++ b/package.json @@ -72,6 +72,7 @@ "redux-enhancer-react-native-appstate": "^0.3.1", "redux-immutable-state-invariant": "^2.1.0", "redux-saga": "^0.16.2", + "remove-markdown": "^0.3.0", "rn-fetch-blob": "^0.10.15", "semver": "^5.6.0", "snyk": "^1.122.3", diff --git a/storybook/stories/Message.js b/storybook/stories/Message.js index a07f4765abd..2f36229a0ab 100644 --- a/storybook/stories/Message.js +++ b/storybook/stories/Message.js @@ -304,6 +304,11 @@ export default ( tmid='1' tmsg='Thread with emoji :) :joy:' /> + Date: Thu, 25 Apr 2019 10:11:57 -0300 Subject: [PATCH 3/4] On message press debounce --- app/containers/message/Message.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/containers/message/Message.js b/app/containers/message/Message.js index 2ae9dfc972c..d5c1a9fc545 100644 --- a/app/containers/message/Message.js +++ b/app/containers/message/Message.js @@ -24,6 +24,7 @@ import I18n from '../../i18n'; import messagesStatus from '../../constants/messagesStatus'; import { CustomIcon } from '../../lib/Icons'; import { COLOR_DANGER } from '../../constants/colors'; +import debounce from '../../utils/debounce'; const SYSTEM_MESSAGES = [ 'r', @@ -161,14 +162,14 @@ export default class Message extends PureComponent { onLongPress: () => {} } - onPress = () => { + onPress = debounce(() => { KeyboardUtils.dismiss(); const { onThreadPress, tlm, tmid } = this.props; if ((tlm || tmid) && onThreadPress) { onThreadPress(); } - } + }, 300, true) onLongPress = () => { const { archived, onLongPress } = this.props; From 7ccc8d33eb858170e0de44d6f51de79dfd07feee Mon Sep 17 00:00:00 2001 From: diegolmello Date: Thu, 25 Apr 2019 10:15:48 -0300 Subject: [PATCH 4/4] Align vertical thread title --- __tests__/__snapshots__/Storyshots.test.js.snap | 7 +++++++ app/containers/message/styles.js | 1 + 2 files changed, 8 insertions(+) diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index 268aa557641..24b85d696cf 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -10849,6 +10849,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -11089,6 +11090,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -11329,6 +11331,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -11569,6 +11572,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -11809,6 +11813,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -12049,6 +12054,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > @@ -12289,6 +12295,7 @@ exports[`Storyshots Message list 1`] = ` "fontSize": 14, "fontStyle": "normal", "fontWeight": "400", + "lineHeight": 16, } } > diff --git a/app/containers/message/styles.js b/app/containers/message/styles.js index 53b27f35245..00bed3d9562 100644 --- a/app/containers/message/styles.js +++ b/app/containers/message/styles.js @@ -225,6 +225,7 @@ export default StyleSheet.create({ }, repliedThreadName: { fontSize: 14, + lineHeight: 16, fontStyle: 'normal', flex: 1, color: COLOR_PRIMARY,