diff --git a/__tests__/__snapshots__/RoomItem.js.snap b/__tests__/__snapshots__/RoomItem.js.snap index 0a4e7983..f8904769 100644 --- a/__tests__/__snapshots__/RoomItem.js.snap +++ b/__tests__/__snapshots__/RoomItem.js.snap @@ -87,13 +87,16 @@ exports[`render channel 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > general @@ -163,13 +166,16 @@ exports[`render no icon 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > name @@ -239,13 +245,16 @@ exports[`render private group 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > private-group @@ -351,13 +360,16 @@ exports[`render unread +999 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > name @@ -386,13 +398,13 @@ exports[`render unread +999 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -483,13 +495,16 @@ exports[`render unread 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > name @@ -518,13 +533,13 @@ exports[`render unread 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -615,13 +630,16 @@ exports[`renders correctly 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > name diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap index bdf17432..2f91e862 100644 --- a/__tests__/__snapshots__/Storyshots.test.js.snap +++ b/__tests__/__snapshots__/Storyshots.test.js.snap @@ -253,13 +253,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > rocket.cat @@ -381,13 +384,18 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + Object { + "fontWeight": "bold", + }, + ] } > rocket.cat @@ -509,13 +517,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > rocket.cat @@ -544,13 +555,13 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -657,13 +668,18 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + Object { + "fontWeight": "bold", + }, + ] } > Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 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 @@ -692,13 +708,13 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -805,13 +821,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 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 @@ -840,13 +859,13 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -953,13 +972,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 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 @@ -988,13 +1010,13 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -1101,13 +1123,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 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 @@ -1136,13 +1161,13 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` style={ Object { "backgroundColor": "#1d74f5", - "borderRadius": 5, + "borderRadius": 3, "color": "#fff", "fontSize": 14, "minWidth": 20, "overflow": "hidden", - "paddingLeft": 5, - "paddingRight": 5, + "paddingHorizontal": 5, + "paddingVertical": 2, "textAlign": "center", } } @@ -1150,6 +1175,157 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` 999+ + + + + LC + + + + + + Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's 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 + + + 11-10-2017 10:00:00 + + + + @ 999+ + + W @@ -1339,13 +1518,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > WW @@ -1448,13 +1630,16 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = ` ellipsizeMode="tail" numberOfLines={1} style={ - Object { - "color": "#444", - "flex": 1, - "fontSize": 16, - "height": 16, - "paddingTop": 10, - } + Array [ + Object { + "color": "#444", + "flex": 1, + "fontSize": 16, + "height": 16, + "paddingTop": 10, + }, + undefined, + ] } > diff --git a/app/lib/realm.js b/app/lib/realm.js index ee44086d..72b3b0d8 100644 --- a/app/lib/realm.js +++ b/app/lib/realm.js @@ -41,6 +41,7 @@ const subscriptionSchema = { properties: { _id: 'string', _server: 'servers', + f: { type: 'bool', optional: true }, t: 'string', ts: { type: 'date', optional: true }, ls: { type: 'date', optional: true }, @@ -51,6 +52,7 @@ const subscriptionSchema = { alert: { type: 'bool', optional: true }, // roles: [ 'owner' ], unread: { type: 'int', optional: true }, + userMentions: { type: 'int', optional: true }, // userMentions: 0, // groupMentions: 0, _updatedAt: { type: 'date', optional: true } @@ -131,7 +133,8 @@ const realm = new Realm({ roomsSchema, attachment, messagesEditedBySchema - ] + ], + deleteRealmIfMigrationNeeded: true }); export default realm; diff --git a/app/presentation/RoomItem.js b/app/presentation/RoomItem.js index 3d97e491..3731dde1 100644 --- a/app/presentation/RoomItem.js +++ b/app/presentation/RoomItem.js @@ -17,14 +17,14 @@ const styles = StyleSheet.create({ }, number: { minWidth: 20, - borderRadius: 5, + borderRadius: 3, backgroundColor: '#1d74f5', color: '#fff', textAlign: 'center', overflow: 'hidden', fontSize: 14, - paddingLeft: 5, - paddingRight: 5 + paddingHorizontal: 5, + paddingVertical: 2 }, roomNameView: { flex: 1, @@ -38,6 +38,12 @@ const styles = StyleSheet.create({ height: 16, color: '#444' }, + alert: { + fontWeight: 'bold' + }, + favorite: { + // backgroundColor: '#eee' + }, update: { flex: 1, fontSize: 10, @@ -67,7 +73,10 @@ export default class RoomItem extends React.PureComponent { type: PropTypes.string.isRequired, name: PropTypes.string.isRequired, _updatedAt: PropTypes.instanceOf(Date), + favorite: PropTypes.bool, + alert: PropTypes.bool, unread: PropTypes.number, + userMentions: PropTypes.number, baseUrl: PropTypes.string, onPress: PropTypes.func, dateFormat: PropTypes.string @@ -101,7 +110,7 @@ export default class RoomItem extends React.PureComponent { ); } - renderNumber = (unread) => { + renderNumber = (unread, userMentions) => { if (!unread || unread <= 0) { return; } @@ -110,6 +119,10 @@ export default class RoomItem extends React.PureComponent { unread = '999+'; } + if (userMentions > 0) { + unread = `@ ${ unread }`; + } + return ( { unread } @@ -118,16 +131,18 @@ export default class RoomItem extends React.PureComponent { } render() { - const { unread, name, _updatedAt } = this.props; + const { + favorite, alert, unread, userMentions, name, _updatedAt + } = this.props; return ( - + {this.icon} - { name } + { name } {_updatedAt ? { moment(_updatedAt).format(this.props.dateFormat) } : null} - {this.renderNumber(unread)} + {this.renderNumber(unread, userMentions)} ); } diff --git a/app/views/RoomsListView.js b/app/views/RoomsListView.js index e81b4167..84d2e33a 100644 --- a/app/views/RoomsListView.js +++ b/app/views/RoomsListView.js @@ -254,7 +254,10 @@ export default class RoomsListView extends React.Component { renderItem = item => ( +