Add an Intl polyfill

5 files changed, 14 insertions, 29 deletions

diff --git a/app/assets/javascripts/components.js b/app/assets/javascripts/components.js
index 0ac74c70c..1604d5198 100644
--- a/app/assets/javascripts/components.js
+++ b/app/assets/javascripts/components.js
@@ -5,6 +5,11 @@ window.React    = require('react');
 window.ReactDOM = require('react-dom');
 window.Perf     = require('react-addons-perf');
 
+if (!window.Intl) {
+  require('intl');
+  require('intl/locale-data/jsonp/en.js');
+}
+
 //= require_tree ./components
 
 window.Mastodon = require('./components/containers/mastodon');
diff --git a/app/assets/javascripts/components/components/relative_timestamp.jsx b/app/assets/javascripts/components/components/relative_timestamp.jsx
index 96f99cca8..3a5b88523 100644
--- a/app/assets/javascripts/components/components/relative_timestamp.jsx
+++ b/app/assets/javascripts/components/components/relative_timestamp.jsx
@@ -4,21 +4,12 @@ import {
   FormattedRelative
 } from 'react-intl';
 
-const RelativeTimestamp = ({ timestamp, now }) => {
-  const diff = (new Date(now)) - (new Date(timestamp));
-
-  if (diff < 0) {
-    return <FormattedMessage id='relative_time.just_now' defaultMessage='Just now' />
-  } else if (diff > (3600 * 24 * 7 * 1000)) {
-    return <FormattedDate value={timestamp} />
-  } else {
-    return <FormattedRelative value={timestamp} initialNow={now} updateInterval={0} />
-  }
+const RelativeTimestamp = ({ timestamp }) => {
+  return <FormattedRelative value={new Date(timestamp)} />;
 };
 
 RelativeTimestamp.propTypes = {
-  timestamp: React.PropTypes.string.isRequired,
-  now: React.PropTypes.any
+  timestamp: React.PropTypes.string.isRequired
 };
 
 export default RelativeTimestamp;
diff --git a/app/assets/javascripts/components/components/status_list.jsx b/app/assets/javascripts/components/components/status_list.jsx
index 91fb45cf5..f989ef895 100644
--- a/app/assets/javascripts/components/components/status_list.jsx
+++ b/app/assets/javascripts/components/components/status_list.jsx
@@ -18,22 +18,8 @@ const StatusList = React.createClass({
     };
   },
 
-  getInitialState () {
-    return {
-      now: (new Date()).toString()
-    };
-  },
-
   mixins: [PureRenderMixin],
 
-  componentDidMount () {
-    this._interval = setInterval(() => this.setState({ now: (new Date()).toString() }), 60000);
-  },
-
-  componentWillUnmount () {
-    clearInterval(this._interval);
-  },
-
   handleScroll (e) {
     const { scrollTop, scrollHeight, clientHeight } = e.target;
 
@@ -61,7 +47,7 @@ const StatusList = React.createClass({
       <div className='scrollable' onScroll={this.handleScroll}>
         <div>
           {statusIds.map((statusId) => {
-            return <StatusContainer key={statusId} id={statusId} now={this.state.now} />;
+            return <StatusContainer key={statusId} id={statusId} />;
           })}
         </div>
       </div>
diff --git a/app/assets/javascripts/components/containers/mastodon.jsx b/app/assets/javascripts/components/containers/mastodon.jsx
index dbc32076b..a12b19746 100644
--- a/app/assets/javascripts/components/containers/mastodon.jsx
+++ b/app/assets/javascripts/components/containers/mastodon.jsx
@@ -32,7 +32,8 @@ import Following from '../features/following';
 import Reblogs from '../features/reblogs';
 import Favourites from '../features/favourites';
 import HashtagTimeline from '../features/hashtag_timeline';
-import { IntlProvider } from 'react-intl';
+import { IntlProvider, addLocaleData } from 'react-intl';
+import en from 'react-intl/locale-data/en';
 
 const store = configureStore();
 
@@ -40,6 +41,8 @@ const browserHistory = useRouterHistory(createBrowserHistory)({
   basename: '/web'
 });
 
+addLocaleData([...en]);
+
 const Mastodon = React.createClass({
 
   propTypes: {
diff --git a/app/assets/javascripts/components/features/status/components/detailed_status.jsx b/app/assets/javascripts/components/features/status/components/detailed_status.jsx
index 8efdf195f..76ddafb3b 100644
--- a/app/assets/javascripts/components/features/status/components/detailed_status.jsx
+++ b/app/assets/javascripts/components/features/status/components/detailed_status.jsx
@@ -54,7 +54,7 @@ const DetailedStatus = React.createClass({
         {media}
 
         <div style={{ marginTop: '15px', color: '#616b86', fontSize: '14px', lineHeight: '18px' }}>
-          <a className='detailed-status__datetime' style={{ color: 'inherit' }} href={status.get('url')} target='_blank' rel='noopener'><FormattedDate value={status.get('created_at')} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' /></a> · <Link to={`/statuses/${status.get('id')}/reblogs`} style={{ color: 'inherit', textDecoration: 'none' }}><i className='fa fa-retweet' /><span style={{ fontWeight: '500', fontSize: '12px', marginLeft: '6px', display: 'inline-block' }}><FormattedNumber value={status.get('reblogs_count')} /></span></Link> · <Link to={`/statuses/${status.get('id')}/favourites`} style={{ color: 'inherit', textDecoration: 'none' }}><i className='fa fa-star' /><span style={{ fontWeight: '500', fontSize: '12px', marginLeft: '6px', display: 'inline-block' }}><FormattedNumber value={status.get('favourites_count')} /></span></Link>
+          <a className='detailed-status__datetime' style={{ color: 'inherit' }} href={status.get('url')} target='_blank' rel='noopener'><FormattedDate value={new Date(status.get('created_at'))} hour12={false} year='numeric' month='short' day='2-digit' hour='2-digit' minute='2-digit' /></a> · <Link to={`/statuses/${status.get('id')}/reblogs`} style={{ color: 'inherit', textDecoration: 'none' }}><i className='fa fa-retweet' /><span style={{ fontWeight: '500', fontSize: '12px', marginLeft: '6px', display: 'inline-block' }}><FormattedNumber value={status.get('reblogs_count')} /></span></Link> · <Link to={`/statuses/${status.get('id')}/favourites`} style={{ color: 'inherit', textDecoration: 'none' }}><i className='fa fa-star' /><span style={{ fontWeight: '500', fontSize: '12px', marginLeft: '6px', display: 'inline-block' }}><FormattedNumber value={status.get('favourites_count')} /></span></Link>
         </div>
       </div>
     );