remove dependency on moment

Author: zendive

package-lock.json

@@ -36,11 +36,11 @@
     "vue-loader": "~15.6.2",
     "vue-template-compiler": "~2.6.6",
     "webpack": "~4.29.0",
+    "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "~3.2.1"
   },
   "dependencies": {
     "jsondiffpatch": "~0.4.1",
-    "moment": "~2.29.0",
     "vue": "~2.6.12"
   }
 }

package.json

@@ -0,0 +1,36 @@
+const SECOND = 1000;
+const MINUTE = 60 * SECOND;
+const HOUR = 60 * MINUTE;
+const DAY = 24 * HOUR;
+const WEEK = 7 * DAY;
+const MONTH = 30 * DAY;
+const YEAR = 365 * DAY;
+const intervals = [
+  {ge: YEAR, divisor: YEAR, unit: 'year'},
+  {ge: MONTH, divisor: MONTH, unit: 'month'},
+  {ge: WEEK, divisor: WEEK, unit: 'week'},
+  {ge: DAY, divisor: DAY, unit: 'day'},
+  {ge: HOUR, divisor: HOUR, unit: 'hour'},
+  {ge: MINUTE, divisor: MINUTE, unit: 'minute'},
+  {ge: SECOND, divisor: SECOND, unit: 'seconds'},
+  {ge: 0, divisor: 1, text: 'now'}
+];
+const rtf = new Intl.RelativeTimeFormat(undefined, {numeric: 'auto'});
+
+/**
+ * @param test {number}
+ * @param [now] {number}
+ * @return {string}
+ */
+export function timeFromNow(test, now) {
+  test = (typeof test === 'number' ? test : new Date(test).getTime());
+  now = (typeof now === 'number' ? now : Date.now());
+  const delta = now - test;
+  const absDelta = Math.abs(delta);
+  for (const interval of intervals) {
+    if (absDelta >= interval.ge) {
+      const time = Math.trunc(delta / interval.divisor);
+      return interval.unit ? rtf.format(-time, interval.unit) : interval.text;
+    }
+  }
+}

src/js/bundle/jsdiff-panel.js

@@ -58,13 +58,13 @@
 </template>
 
 <script>
-  const jsondiffpatch = require('jsondiffpatch');
-  const formatters = jsondiffpatch.formatters;
-  require('jsondiffpatch/dist/formatters-styles/html.css');
-  const Vue = require('vue').default;
-  const moment = require('moment');
+import jsondiffpatch from 'jsondiffpatch';
+import 'jsondiffpatch/dist/formatters-styles/html.css';
+import Vue from 'vue'
+import {timeFromNow} from './api/time';
+const formatters = jsondiffpatch.formatters;
 
-  module.exports = Vue.extend({
+export default Vue.extend({
     name: 'jsdiff-panel',
 
     data() {
@@ -103,7 +103,7 @@
 
     computed: {
       lastUpdated() {
-        return moment(this.compare.timestamp).from(this.now);
+        return timeFromNow(this.compare.timestamp, this.now);
       },
 
       hasBothSides() {

src/js/view/api/time.js

@@ -2,6 +2,7 @@ const path = require('path');
 const webpack = require('webpack');
 const CleanWebpackPlugin = require('clean-webpack-plugin');
 const VueLoaderPlugin = require('vue-loader/lib/plugin');
+const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
 module.exports = {
   mode: 'development',
@@ -27,10 +28,13 @@ module.exports = {
   plugins: [
     new webpack.IgnorePlugin({
       resourceRegExp: /^\.\/locale$/,
-      contextRegExp: /moment$/
     }),
     new CleanWebpackPlugin(['src/js/bundle']),
-    new VueLoaderPlugin()
+    new VueLoaderPlugin(),
+    new BundleAnalyzerPlugin({
+      openAnalyzer: false,
+      logLevel: 'silent',
+    }),
   ],
 
   module: {