Skip to content

Commit e270f41

Browse files
ocarreteromHoussein Djirdeh
authored andcommitted
refactor: replace momentjs by date-fns (#664)
* refactor: replace momentjs by date-fns Use date-fns to represent relative time. * feat: change translations to short format Change translations to short format. 1 hour -> 1h * fix(localization): change to distanceInWords Change to `distanceInWords` in order to be more accurated with moment.js time ranges. * feat(locale): update relative time translations Updates relative time translations to work with date-fns. * feat(locale): update realative time translations Update `eu` and `zh-tw` realative time translations for date-fns.
1 parent e994240 commit e270f41

25 files changed

+263
-227
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,14 +52,14 @@
5252
]
5353
},
5454
"dependencies": {
55+
"date-fns": "^1.29.0",
5556
"entities": "^1.1.1",
5657
"enzyme": "^3.0.0",
5758
"enzyme-adapter-react-16": "^1.0.0",
5859
"fuzzysort": "^1.0.1",
5960
"lodash.uniqby": "^4.7.0",
6061
"lowlight": "^1.5.0",
6162
"md5": "^2.2.1",
62-
"moment": "^2.17.1",
6363
"node-emoji": "^1.7.0",
6464
"opencollective": "^1.0.3",
6565
"parse-diff": "^0.4.0",

src/auth/screens/events.screen.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,10 @@ import styled from 'styled-components/native';
55
import { connect } from 'react-redux';
66
import { bindActionCreators } from 'redux';
77
import { Text, FlatList, View } from 'react-native';
8-
import moment from 'moment/min/moment-with-locales.min';
98

109
import { LoadingUserListItem, UserListItem, ViewContainer } from 'components';
1110
import { colors, fonts, normalize } from 'config';
12-
import { emojifyText, translate } from 'utils';
11+
import { emojifyText, translate, relativeTimeToNow } from 'utils';
1312
import { getUserEvents } from 'auth';
1413
import { getNotificationsCount } from 'notifications';
1514

@@ -492,7 +491,7 @@ class Events extends Component {
492491
{this.getItem(userEvent) && ' '}
493492
{this.getSecondItem(userEvent)}
494493
{this.getItem(userEvent) && this.getConnector(userEvent) && ' '}
495-
<Datestamp>{moment(userEvent.created_at).fromNow()}</Datestamp>
494+
<Datestamp>{relativeTimeToNow(userEvent.created_at)}</Datestamp>
496495
</DescriptionContainer>
497496
);
498497
}

src/components/comment-list-item.component.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -8,9 +8,7 @@ import { GithubHtmlView } from 'components';
88
import { Icon } from 'react-native-elements';
99
import ActionSheet from 'react-native-actionsheet';
1010

11-
import moment from 'moment/min/moment-with-locales.min';
12-
13-
import { translate } from 'utils';
11+
import { translate, relativeTimeToNow } from 'utils';
1412
import { colors, fonts, normalize } from 'config';
1513

1614
const styles = StyleSheet.create({
@@ -178,7 +176,7 @@ class CommentListItemComponent extends Component {
178176

179177
<View style={styles.dateContainer}>
180178
<Text style={styles.date}>
181-
{moment(comment.created_at).fromNow()}
179+
{relativeTimeToNow(comment.created_at)}
182180
</Text>
183181
</View>
184182
</View>

src/components/issue-description.component.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import React, { Component } from 'react';
22
import { StyleSheet, ActivityIndicator } from 'react-native';
33
import { ListItem } from 'react-native-elements';
44
import Parse from 'parse-diff';
5-
import moment from 'moment/min/moment-with-locales.min';
65
import styled from 'styled-components/native';
76

87
import {
@@ -12,7 +11,7 @@ import {
1211
DiffBlocks,
1312
Button,
1413
} from 'components';
15-
import { translate } from 'utils';
14+
import { translate, relativeTimeToNow } from 'utils';
1615
import { colors, fonts, normalize } from 'config';
1716
import { v3 } from 'api';
1817

@@ -151,7 +150,7 @@ export class IssueDescription extends Component {
151150
<HeaderContainer>
152151
<IssueTitle
153152
title={issue.title}
154-
subtitle={moment(issue.created_at).fromNow()}
153+
subtitle={relativeTimeToNow(issue.created_at)}
155154
leftIcon={{
156155
name: issue.pull_request ? 'git-pull-request' : 'issue-opened',
157156
size: 36,

src/components/issue-event-list-item.component.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
import React, { Component } from 'react';
22
import { Text } from 'react-native';
33
import { Icon as BaseIcon } from 'react-native-elements';
4-
import moment from 'moment/min/moment-with-locales.min';
54
import { colors, fonts, normalize } from 'config';
65
import { InlineLabel } from 'components';
76
import styled from 'styled-components/native';
87

8+
import { relativeTimeToNow } from 'utils';
9+
910
const marginLeftForIconName = name => {
1011
switch (name) {
1112
case 'git-branch':
@@ -355,7 +356,7 @@ class Event extends Component {
355356
<ContentContainer>
356357
<EventTextContainer>{text}</EventTextContainer>
357358
<DateContainer>
358-
<Date>{moment(createdAt).fromNow()}</Date>
359+
<Date>{relativeTimeToNow(createdAt)}</Date>
359360
</DateContainer>
360361
</ContentContainer>
361362
</Container>

src/components/issue-list-item.component.js

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import React from 'react';
22
import { StyleSheet, TouchableHighlight, View, Text } from 'react-native';
33
import { ListItem, Icon } from 'react-native-elements';
4-
import moment from 'moment/min/moment-with-locales.min';
54

65
import { colors, fonts, normalize } from 'config';
7-
import { translate } from 'utils';
6+
import { translate, relativeTimeToNow } from 'utils';
87

98
type Props = {
109
type: string,
@@ -81,12 +80,12 @@ export const IssueListItem = ({ type, issue, navigation, locale }: Props) => (
8180
? translate('issue.main.openIssueSubTitle', locale, {
8281
number: issue.number,
8382
user: issue.user.login,
84-
time: moment(issue.created_at).fromNow(),
83+
time: relativeTimeToNow(issue.created_at),
8584
})
8685
: translate('issue.main.closedIssueSubTitle', locale, {
8786
number: issue.number,
8887
user: issue.user.login,
89-
time: moment(issue.closed_at).fromNow(),
88+
time: relativeTimeToNow(issue.closed_at),
9089
})
9190
}
9291
leftIcon={{

src/locale/languages/de.js

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -333,18 +333,20 @@ export const de = {
333333
ok: 'OK',
334334
submit: 'Bestätigen',
335335
relativeTime: {
336-
past: '%s',
337-
s: '%ds',
338-
m: '%dm',
339-
mm: '%dm',
340-
h: '%dh',
341-
hh: '%dh',
342-
d: '%dd',
343-
dd: '%dd',
344-
M: '%dmo',
345-
MM: '%dmo',
346-
y: '%dy',
347-
yy: '%dy',
336+
lessThanXSeconds: '{{count}}s',
337+
xSeconds: '{{count}}s',
338+
halfAMinute: '30s',
339+
lessThanXMinutes: '{{count}}m',
340+
xMinutes: '{{count}}m',
341+
aboutXHours: '{{count}}h',
342+
xHours: '{{count}}h',
343+
xDays: '{{count}}d',
344+
aboutXMonths: '{{count}}mo',
345+
xMonths: '{{count}}mo',
346+
aboutXYears: '{{count}}y',
347+
xYears: '{{count}}y',
348+
overXYears: '{{count}}y',
349+
almostXYears: '{{count}}y',
348350
},
349351
abbreviations: {
350352
thousand: 't',

src/locale/languages/en.js

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -328,18 +328,20 @@ export const en = {
328328
ok: 'OK',
329329
submit: 'Submit',
330330
relativeTime: {
331-
past: '%s',
332-
s: '%ds',
333-
m: '%dm',
334-
mm: '%dm',
335-
h: '%dh',
336-
hh: '%dh',
337-
d: '%dd',
338-
dd: '%dd',
339-
M: '%dmo',
340-
MM: '%dmo',
341-
y: '%dy',
342-
yy: '%dy',
331+
lessThanXSeconds: '{{count}}s',
332+
xSeconds: '{{count}}s',
333+
halfAMinute: '30s',
334+
lessThanXMinutes: '{{count}}m',
335+
xMinutes: '{{count}}m',
336+
aboutXHours: '{{count}}h',
337+
xHours: '{{count}}h',
338+
xDays: '{{count}}d',
339+
aboutXMonths: '{{count}}mo',
340+
xMonths: '{{count}}mo',
341+
aboutXYears: '{{count}}y',
342+
xYears: '{{count}}y',
343+
overXYears: '{{count}}y',
344+
almostXYears: '{{count}}y',
343345
},
344346
abbreviations: {
345347
thousand: 'k',

src/locale/languages/eo.js

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -326,18 +326,20 @@ export const eo = {
326326
ok: 'BONE',
327327
submit: 'Proponi',
328328
relativeTime: {
329-
past: '% s',
330-
s: '% ds',
331-
m: '% dm',
332-
mm: '% dm',
333-
h: '% dh',
334-
hh: '% dh',
335-
d: '% dd',
336-
dd: '% dd',
337-
M: '% dmo',
338-
MM: '% dmo',
339-
y: '% dy',
340-
yy: '% dy',
329+
lessThanXSeconds: '{{count}}s',
330+
xSeconds: '{{count}}s',
331+
halfAMinute: '30s',
332+
lessThanXMinutes: '{{count}}m',
333+
xMinutes: '{{count}}m',
334+
aboutXHours: '{{count}}h',
335+
xHours: '{{count}}h',
336+
xDays: '{{count}}d',
337+
aboutXMonths: '{{count}}mo',
338+
xMonths: '{{count}}mo',
339+
aboutXYears: '{{count}}y',
340+
xYears: '{{count}}y',
341+
overXYears: '{{count}}y',
342+
almostXYears: '{{count}}y',
341343
},
342344
abbreviations: {
343345
thousand: 'k',

src/locale/languages/es.js

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -331,18 +331,20 @@ export const es = {
331331
ok: 'OK',
332332
submit: 'Enviar',
333333
relativeTime: {
334-
past: '%s',
335-
s: '%ds',
336-
m: '%dm',
337-
mm: '%dm',
338-
h: '%dh',
339-
hh: '%dh',
340-
d: '%dd',
341-
dd: '%dd',
342-
M: '%dmo',
343-
MM: '%dmo',
344-
y: '%dy',
345-
yy: '%dy',
334+
lessThanXSeconds: '{{count}}s',
335+
xSeconds: '{{count}}s',
336+
halfAMinute: '30s',
337+
lessThanXMinutes: '{{count}}m',
338+
xMinutes: '{{count}}m',
339+
aboutXHours: '{{count}}h',
340+
xHours: '{{count}}h',
341+
xDays: '{{count}}d',
342+
aboutXMonths: '{{count}}me',
343+
xMonths: '{{count}}me',
344+
aboutXYears: '{{count}}a',
345+
xYears: '{{count}}a',
346+
overXYears: '{{count}}a',
347+
almostXYears: '{{count}}a',
346348
},
347349
abbreviations: {
348350
thousand: 'k',

0 commit comments

Comments
 (0)