Switch from moment.js to vue-timeago.

Much smaller filesize for vendor.js, although we'll have to see if all
the intervals are ok.

package.json

@@ -15,12 +15,12 @@
   "dependencies": {
     "diff": "^3.0.1",
     "karma-mocha-reporter": "^2.2.1",
-    "moment": "^2.15.2",
     "node-sass": "^3.10.1",
     "sanitize-html": "^1.13.0",
     "sass-loader": "^4.0.2",
     "vue": "^2.0.1",
     "vue-router": "^2.0.1",
+    "vue-timeago": "^3.1.2",
     "vuex": "^2.0.0"
   },
   "devDependencies": {

src/components/conversation/conversation.js

@@ -36,7 +36,6 @@ const conversation = {
         const conversationId = this.status.statusnet_conversation_id
         this.$store.state.api.backendInteractor.fetchConversation({id: conversationId})
           .then((statuses) => this.$store.dispatch('addNewStatuses', { statuses }))
-          .then(() => this.$store.commit('updateTimestamps'))
       } else {
         const id = this.$route.params.id
         this.$store.state.api.backendInteractor.fetchStatus({id})

src/components/mentions/mentions.js

@@ -1,6 +1,6 @@
 import Status from '../status/status.vue'
 // Temporary
-import { prepareStatus, updateTimestampsInStatuses } from '../../modules/statuses.js'
+import { prepareStatus } from '../../modules/statuses.js'
 import { map } from 'lodash'
 
 const Mentions = {
@@ -20,7 +20,7 @@ const Mentions = {
   created () {
     this.$store.state.api.backendInteractor.fetchMentions({username: this.username})
       .then((mentions) => {
-        this.mentions = updateTimestampsInStatuses(map(mentions, prepareStatus))
+        this.mentions = map(mentions, prepareStatus)
       })
   }
 }

src/components/status/status.vue

@@ -23,7 +23,7 @@
             -
             <small>
               <router-link :to="{ name: 'conversation', params: { id: status.id } }">
-                {{status.created_at_parsed}}
+                <timeago :since="status.created_at" :auto-update="60"></timeago>
               </router-link>
             </small>
             <small v-if="!status.is_local" class="source_url">

src/main.js

@@ -12,8 +12,16 @@ import statusesModule from './modules/statuses.js'
 import usersModule from './modules/users.js'
 import apiModule from './modules/api.js'
 
+import VueTimeago from 'vue-timeago'
+
 Vue.use(Vuex)
 Vue.use(VueRouter)
+Vue.use(VueTimeago, {
+  locale: 'en-US',
+  locales: {
+    'en-US': require('vue-timeago/locales/en-US.json')
+  }
+})
 
 const store = new Vuex.Store({
   modules: {

src/modules/statuses.js

@@ -1,5 +1,4 @@
-import { remove, map, slice, sortBy, toInteger, each, find, flatten, maxBy, last, merge, max, isArray } from 'lodash'
+import { remove, slice, sortBy, toInteger, each, find, flatten, maxBy, last, merge, max, isArray } from 'lodash'
-import moment from 'moment'
 import apiService from '../services/api/api.service.js'
 // import parse from '../services/status_parser/status_parser.js'
 
@@ -46,22 +45,9 @@ export const prepareStatus = (status) => {
     status.nsfw = !!status.text.match(nsfwRegex)
   }
 
-  // Set created_at_parsed to initial value
-  status.created_at_parsed = status.created_at
-
   return status
 }
 
-export const updateTimestampsInStatuses = (statuses) => {
-  return map(statuses, (statusoid) => {
-    const status = statusoid.retweeted_status || statusoid
-
-    // Parse date
-    status.created_at_parsed = moment(status.created_at).fromNow()
-    return status
-  })
-}
-
 export const statusType = (status) => {
   if (status.is_post_verb) {
     return 'status'
@@ -236,9 +222,6 @@ export const mutations = {
     oldTimeline.newStatusCount = 0
     oldTimeline.visibleStatuses = slice(oldTimeline.statuses, 0, 50)
   },
-  updateTimestamps (state) {
-    updateTimestampsInStatuses(state.allStatuses)
-  },
   setFavorited (state, { status, value }) {
     const newStatus = find(state.allStatuses, status)
     newStatus.favorited = value

src/services/timeline_fetcher/timeline_fetcher.service.js

@@ -10,8 +10,6 @@ const update = ({store, statuses, timeline, showImmediately}) => {
     statuses,
     showImmediately
   })
-
-  store.commit('updateTimestamps')
 }
 
 const fetchAndUpdate = ({store, credentials, timeline = 'friends', older = false, showImmediately = false}) => {

yarn.lock

@@ -3769,10 +3769,6 @@ mocha@^3.1.0:
     mkdirp "0.5.1"
     supports-color "3.1.2"
 
-moment:
-  version "2.15.2"
-  resolved "https://registry.yarnpkg.com/moment/-/moment-2.15.2.tgz#1bfdedf6a6e345f322fe956d5df5bd08a8ce84dc"
-
 ms@0.7.1:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/ms/-/ms-0.7.1.tgz#9cd13c03adbff25b65effde7ce864ee952017098"
@@ -5718,6 +5714,10 @@ vue-template-es2015-compiler@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.0.0.tgz#89add11c41224059c839ef0b9484e97a7f98abc5"
 
+vue-timeago:
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/vue-timeago/-/vue-timeago-3.1.2.tgz#bdd79613c0cf5192128b8921c3f332bbc3a513f1"
+
 vue@^2.0.1:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.0.3.tgz#3f7698f83d6ad1f0e35955447901672876c63fde"