[NEW] Better date format for room’s list (#134)
This commit is contained in:
parent
b2ace37c99
commit
d991fd99bc
|
@ -6,30 +6,29 @@ import RoomItem from '../app/presentation/RoomItem';
|
||||||
import renderer from 'react-test-renderer';
|
import renderer from 'react-test-renderer';
|
||||||
|
|
||||||
const date = new Date(2017, 10, 10, 10);
|
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' } });
|
jest.mock('react-native-img-cache', () => { return { CachedImage: 'View' } });
|
||||||
|
|
||||||
it('renders correctly', () => {
|
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', () => {
|
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', () => {
|
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', () => {
|
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', () => {
|
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', () => {
|
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();
|
||||||
});
|
});
|
||||||
|
|
|
@ -115,7 +115,7 @@ exports[`render channel 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -194,7 +194,7 @@ exports[`render no icon 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -273,7 +273,7 @@ exports[`render private group 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -388,7 +388,7 @@ exports[`render unread +999 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -523,7 +523,7 @@ exports[`render unread 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -658,7 +658,7 @@ exports[`renders correctly 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|
|
@ -281,7 +281,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -414,7 +414,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -545,7 +545,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -698,7 +698,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -849,7 +849,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -1000,7 +1000,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -1151,7 +1151,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -1302,7 +1302,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
<Text
|
<Text
|
||||||
|
@ -1434,7 +1434,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -1546,7 +1546,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
@ -1658,7 +1658,7 @@ exports[`Storyshots Channel Cell Direct Messages 1`] = `
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
11-10-2017 10:00:00
|
Nov 10
|
||||||
</Text>
|
</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|
|
@ -78,8 +78,7 @@ export default class RoomItem extends React.PureComponent {
|
||||||
unread: PropTypes.number,
|
unread: PropTypes.number,
|
||||||
userMentions: PropTypes.number,
|
userMentions: PropTypes.number,
|
||||||
baseUrl: PropTypes.string,
|
baseUrl: PropTypes.string,
|
||||||
onPress: PropTypes.func,
|
onPress: PropTypes.func
|
||||||
dateFormat: PropTypes.string
|
|
||||||
}
|
}
|
||||||
|
|
||||||
get icon() {
|
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) => {
|
renderNumber = (unread, userMentions) => {
|
||||||
if (!unread || unread <= 0) {
|
if (!unread || unread <= 0) {
|
||||||
return;
|
return;
|
||||||
|
@ -140,7 +146,7 @@ export default class RoomItem extends React.PureComponent {
|
||||||
{this.icon}
|
{this.icon}
|
||||||
<View style={styles.roomNameView}>
|
<View style={styles.roomNameView}>
|
||||||
<Text style={[styles.roomName, alert && styles.alert]} ellipsizeMode='tail' numberOfLines={1}>{ name }</Text>
|
<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>
|
</View>
|
||||||
{this.renderNumber(unread, userMentions)}
|
{this.renderNumber(unread, userMentions)}
|
||||||
</TouchableOpacity>
|
</TouchableOpacity>
|
||||||
|
|
|
@ -242,7 +242,6 @@ export default class RoomsListView extends React.Component {
|
||||||
key={item._id}
|
key={item._id}
|
||||||
type={item.t}
|
type={item.t}
|
||||||
baseUrl={this.props.Site_Url}
|
baseUrl={this.props.Site_Url}
|
||||||
dateFormat='MM-DD-YYYY HH:mm:ss'
|
|
||||||
onPress={() => this._onPressItem(item)}
|
onPress={() => this._onPressItem(item)}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
|
|
|
@ -4,7 +4,6 @@ import { ScrollView } from 'react-native';
|
||||||
import RoomItem from '../../../app/presentation/RoomItem';
|
import RoomItem from '../../../app/presentation/RoomItem';
|
||||||
|
|
||||||
const date = new Date(2017, 10, 10, 10);
|
const date = new Date(2017, 10, 10, 10);
|
||||||
const dateFormat = 'MM-DD-YYYY HH:mm:ss';
|
|
||||||
|
|
||||||
export default (
|
export default (
|
||||||
<ScrollView>
|
<ScrollView>
|
||||||
|
@ -12,7 +11,6 @@ export default (
|
||||||
type='d'
|
type='d'
|
||||||
name='rocket.cat'
|
name='rocket.cat'
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
baseUrl='https://demo.rocket.chat'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
<RoomItem
|
<RoomItem
|
||||||
|
@ -20,7 +18,6 @@ export default (
|
||||||
unread={0}
|
unread={0}
|
||||||
alert
|
alert
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
name='rocket.cat'
|
name='rocket.cat'
|
||||||
baseUrl='https://demo.rocket.chat'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -28,7 +25,6 @@ export default (
|
||||||
type='d'
|
type='d'
|
||||||
unread={1}
|
unread={1}
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
name='rocket.cat'
|
name='rocket.cat'
|
||||||
baseUrl='https://demo.rocket.chat'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -37,7 +33,6 @@ export default (
|
||||||
unread={9}
|
unread={9}
|
||||||
alert
|
alert
|
||||||
_updatedAt={date}
|
_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"
|
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'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -45,7 +40,6 @@ export default (
|
||||||
type='d'
|
type='d'
|
||||||
unread={99}
|
unread={99}
|
||||||
_updatedAt={date}
|
_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"
|
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'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -54,7 +48,6 @@ export default (
|
||||||
unread={100}
|
unread={100}
|
||||||
userMentions={0}
|
userMentions={0}
|
||||||
_updatedAt={date}
|
_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"
|
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'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -63,7 +56,6 @@ export default (
|
||||||
unread={100000}
|
unread={100000}
|
||||||
userMentions={0}
|
userMentions={0}
|
||||||
_updatedAt={date}
|
_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"
|
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'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -72,7 +64,6 @@ export default (
|
||||||
unread={100000}
|
unread={100000}
|
||||||
userMentions={1}
|
userMentions={1}
|
||||||
_updatedAt={date}
|
_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"
|
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'
|
baseUrl='https://demo.rocket.chat'
|
||||||
/>
|
/>
|
||||||
|
@ -80,21 +71,18 @@ export default (
|
||||||
type='d'
|
type='d'
|
||||||
name='W'
|
name='W'
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
unread={-100}
|
unread={-100}
|
||||||
/>
|
/>
|
||||||
<RoomItem
|
<RoomItem
|
||||||
type='d'
|
type='d'
|
||||||
name='WW'
|
name='WW'
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
unread={-100}
|
unread={-100}
|
||||||
/>
|
/>
|
||||||
<RoomItem
|
<RoomItem
|
||||||
type='d'
|
type='d'
|
||||||
name=''
|
name=''
|
||||||
_updatedAt={date}
|
_updatedAt={date}
|
||||||
dateFormat={dateFormat}
|
|
||||||
unread={-100}
|
unread={-100}
|
||||||
/>
|
/>
|
||||||
</ScrollView>
|
</ScrollView>
|
||||||
|
|
Loading…
Reference in New Issue