From d991fd99bccb2176355c9f197371d9d721630e26 Mon Sep 17 00:00:00 2001
From: Rodrigo Nascimento <rodrigoknascimento@gmail.com>
Date: Fri, 8 Dec 2017 11:56:53 -0200
Subject: [PATCH] =?UTF-8?q?[NEW]=20Better=20date=20format=20for=20room?=
 =?UTF-8?q?=E2=80=99s=20list=20(#134)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 __tests__/RoomItem.js                         | 13 +++++------
 __tests__/__snapshots__/RoomItem.js.snap      | 12 +++++-----
 .../__snapshots__/Storyshots.test.js.snap     | 22 +++++++++----------
 app/presentation/RoomItem.js                  | 12 +++++++---
 app/views/RoomsListView.js                    |  1 -
 storybook/stories/Channels/DirectMessage.js   | 12 ----------
 6 files changed, 32 insertions(+), 40 deletions(-)

diff --git a/__tests__/RoomItem.js b/__tests__/RoomItem.js
index 7ee2c03a2..627682345 100644
--- a/__tests__/RoomItem.js
+++ b/__tests__/RoomItem.js
@@ -6,30 +6,29 @@ import RoomItem from '../app/presentation/RoomItem';
 import renderer from 'react-test-renderer';
 
 const date = new Date(2017, 10, 10, 10);
-const dateFormat = 'MM-DD-YYYY HH:mm:ss';
 
 jest.mock('react-native-img-cache', () => { return { CachedImage: 'View' } });
 
 it('renders correctly', () => {
-	expect(renderer.create(<RoomItem type="d" dateFormat={dateFormat} _updatedAt={date} name="name" />).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="d" _updatedAt={date} name="name" />).toJSON()).toMatchSnapshot();
 });
 
 it('render unread', () => {
-	expect(renderer.create(<RoomItem type="d" dateFormat={dateFormat} _updatedAt={date} name="name" unread={1} />).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="d" _updatedAt={date} name="name" unread={1} />).toJSON()).toMatchSnapshot();
 });
 
 it('render unread +999', () => {
-	expect(renderer.create(<RoomItem type="d" dateFormat={dateFormat} _updatedAt={date} name="name" unread={1000} />).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="d" _updatedAt={date} name="name" unread={1000} />).toJSON()).toMatchSnapshot();
 });
 
 it('render no icon', () => {
-	expect(renderer.create(<RoomItem type="X" dateFormat={dateFormat} _updatedAt={date} name="name" />).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="X" _updatedAt={date} name="name" />).toJSON()).toMatchSnapshot();
 });
 
 it('render private group', () => {
-	expect(renderer.create(<RoomItem type="g" dateFormat={dateFormat} _updatedAt={date} name="private-group" /> ).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="g" _updatedAt={date} name="private-group" /> ).toJSON()).toMatchSnapshot();
 });
 
 it('render channel', () => {
-	expect(renderer.create(<RoomItem type="c" dateFormat={dateFormat} _updatedAt={date} name="general" />).toJSON()).toMatchSnapshot();
+	expect(renderer.create(<RoomItem type="c" _updatedAt={date} name="general" />).toJSON()).toMatchSnapshot();
 });
diff --git a/__tests__/__snapshots__/RoomItem.js.snap b/__tests__/__snapshots__/RoomItem.js.snap
index f8904769c..8f1df86e2 100644
--- a/__tests__/__snapshots__/RoomItem.js.snap
+++ b/__tests__/__snapshots__/RoomItem.js.snap
@@ -115,7 +115,7 @@ exports[`render channel 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
 </View>
@@ -194,7 +194,7 @@ exports[`render no icon 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
 </View>
@@ -273,7 +273,7 @@ exports[`render private group 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
 </View>
@@ -388,7 +388,7 @@ exports[`render unread +999 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
   <Text
@@ -523,7 +523,7 @@ exports[`render unread 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
   <Text
@@ -658,7 +658,7 @@ exports[`renders correctly 1`] = `
         }
       }
     >
-      11-10-2017 10:00:00
+      Nov 10
     </Text>
   </View>
 </View>
diff --git a/__tests__/__snapshots__/Storyshots.test.js.snap b/__tests__/__snapshots__/Storyshots.test.js.snap
index 2f91e8629..7adb1e3fc 100644
--- a/__tests__/__snapshots__/Storyshots.test.js.snap
+++ b/__tests__/__snapshots__/Storyshots.test.js.snap
@@ -281,7 +281,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
     </View>
@@ -414,7 +414,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
     </View>
@@ -545,7 +545,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -698,7 +698,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -849,7 +849,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -1000,7 +1000,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -1151,7 +1151,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -1302,7 +1302,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
       <Text
@@ -1434,7 +1434,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
     </View>
@@ -1546,7 +1546,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
     </View>
@@ -1658,7 +1658,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
             }
           }
         >
-          11-10-2017 10:00:00
+          Nov 10
         </Text>
       </View>
     </View>
diff --git a/app/presentation/RoomItem.js b/app/presentation/RoomItem.js
index 3731dde1b..a6bd3ce0a 100644
--- a/app/presentation/RoomItem.js
+++ b/app/presentation/RoomItem.js
@@ -78,8 +78,7 @@ export default class RoomItem extends React.PureComponent {
 		unread: PropTypes.number,
 		userMentions: PropTypes.number,
 		baseUrl: PropTypes.string,
-		onPress: PropTypes.func,
-		dateFormat: PropTypes.string
+		onPress: PropTypes.func
 	}
 
 	get icon() {
@@ -110,6 +109,13 @@ export default class RoomItem extends React.PureComponent {
 		);
 	}
 
+	formatDate = date => moment(date).calendar(null, {
+		lastDay: 'dddd',
+		sameDay: 'HH:mm',
+		lastWeek: 'dddd',
+		sameElse: 'MMM D'
+	})
+
 	renderNumber = (unread, userMentions) => {
 		if (!unread || unread <= 0) {
 			return;
@@ -140,7 +146,7 @@ export default class RoomItem extends React.PureComponent {
 				{this.icon}
 				<View style={styles.roomNameView}>
 					<Text style={[styles.roomName, alert && styles.alert]} ellipsizeMode='tail' numberOfLines={1}>{ name }</Text>
-					{_updatedAt ? <Text style={styles.update} ellipsizeMode='tail' numberOfLines={1}>{ moment(_updatedAt).format(this.props.dateFormat) }</Text> : null}
+					{_updatedAt ? <Text style={styles.update} ellipsizeMode='tail' numberOfLines={1}>{ this.formatDate(_updatedAt) }</Text> : null}
 				</View>
 				{this.renderNumber(unread, userMentions)}
 			</TouchableOpacity>
diff --git a/app/views/RoomsListView.js b/app/views/RoomsListView.js
index ecf68643a..7ae5eeb8f 100644
--- a/app/views/RoomsListView.js
+++ b/app/views/RoomsListView.js
@@ -242,7 +242,6 @@ export default class RoomsListView extends React.Component {
 			key={item._id}
 			type={item.t}
 			baseUrl={this.props.Site_Url}
-			dateFormat='MM-DD-YYYY HH:mm:ss'
 			onPress={() => this._onPressItem(item)}
 		/>
 	)
diff --git a/storybook/stories/Channels/DirectMessage.js b/storybook/stories/Channels/DirectMessage.js
index e9833ab4a..14c19e948 100644
--- a/storybook/stories/Channels/DirectMessage.js
+++ b/storybook/stories/Channels/DirectMessage.js
@@ -4,7 +4,6 @@ import { ScrollView } from 'react-native';
 import RoomItem from '../../../app/presentation/RoomItem';
 
 const date = new Date(2017, 10, 10, 10);
-const dateFormat = 'MM-DD-YYYY HH:mm:ss';
 
 export default (
 	<ScrollView>
@@ -12,7 +11,6 @@ export default (
 			type='d'
 			name='rocket.cat'
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			baseUrl='https://demo.rocket.chat'
 		/>
 		<RoomItem
@@ -20,7 +18,6 @@ export default (
 			unread={0}
 			alert
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name='rocket.cat'
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -28,7 +25,6 @@ export default (
 			type='d'
 			unread={1}
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name='rocket.cat'
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -37,7 +33,6 @@ export default (
 			unread={9}
 			alert
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name="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"
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -45,7 +40,6 @@ export default (
 			type='d'
 			unread={99}
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name="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"
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -54,7 +48,6 @@ export default (
 			unread={100}
 			userMentions={0}
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name="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"
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -63,7 +56,6 @@ export default (
 			unread={100000}
 			userMentions={0}
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name="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"
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -72,7 +64,6 @@ export default (
 			unread={100000}
 			userMentions={1}
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			name="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"
 			baseUrl='https://demo.rocket.chat'
 		/>
@@ -80,21 +71,18 @@ export default (
 			type='d'
 			name='W'
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			unread={-100}
 		/>
 		<RoomItem
 			type='d'
 			name='WW'
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			unread={-100}
 		/>
 		<RoomItem
 			type='d'
 			name=''
 			_updatedAt={date}
-			dateFormat={dateFormat}
 			unread={-100}
 		/>
 	</ScrollView>
-- 
GitLab