From 0fb6c8a6c27fcde7c797793906e3a05c07ecd909 Mon Sep 17 00:00:00 2001
From: Jerko Steiner <jerko.steiner@gmail.com>
Date: Thu, 11 Apr 2019 12:23:17 +0800
Subject: [PATCH] Reduce bundle size by 100kb by removing date-fns

---
 package-lock.json                          | 12 ++++++------
 package.json                               |  2 +-
 packages/client/src/components/TimeAgo.tsx | 17 +++++++++++++++++
 packages/client/src/components/index.ts    |  1 +
 4 files changed, 25 insertions(+), 7 deletions(-)
 create mode 100644 packages/client/src/components/TimeAgo.tsx

diff --git a/package-lock.json b/package-lock.json
index b639c00..e56da91 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4732,12 +4732,6 @@
         "whatwg-url": "^7.0.0"
       }
     },
-    "date-fns": {
-      "version": "2.0.0-alpha.27",
-      "resolved": "https://registry.npmjs.org/date-fns/-/date-fns-2.0.0-alpha.27.tgz",
-      "integrity": "sha512-cqfVLS+346P/Mpj2RpDrBv0P4p2zZhWWvfY5fuWrXNR/K38HaAGEkeOwb47hIpQP9Jr/TIxjZ2/sNMQwdXuGMg==",
-      "dev": true
-    },
     "date-now": {
       "version": "0.1.4",
       "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
@@ -13255,6 +13249,12 @@
         "xtend": "~4.0.1"
       }
     },
+    "timeago.js": {
+      "version": "4.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/timeago.js/-/timeago.js-4.0.0-beta.2.tgz",
+      "integrity": "sha512-MQkHiYGoB6qZC4DNWsLc9bav+L9hpdulL6sL7okzKR8r1Ipask/tXKAio8T+4jeby8FbpbDvbnCKGrh1bLop3g==",
+      "dev": true
+    },
     "timed-out": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/timed-out/-/timed-out-4.0.1.tgz",
diff --git a/package.json b/package.json
index 0516f5d..91a14f7 100644
--- a/package.json
+++ b/package.json
@@ -42,7 +42,6 @@
     "bulma": "^0.7.4",
     "common-shakeify": "^0.6.0",
     "cookie-parser": "^1.4.4",
-    "date-fns": "^2.0.0-alpha.27",
     "deep-object-diff": "^1.1.0",
     "esmify": "git+https://github.com/jeremija/esmify.git",
     "history": "^4.9.0",
@@ -66,6 +65,7 @@
     "sourceify": "git+https://github.com/jeremija/sourceify.git#sources-content",
     "std-mocks": "^1.0.1",
     "supertest": "^3.3.0",
+    "timeago.js": "^4.0.0-beta.2",
     "ts-jest": "^24.0.0",
     "ts-node": "^7.0.1",
     "ts-node-dev": "^1.0.0-pre.32",
diff --git a/packages/client/src/components/TimeAgo.tsx b/packages/client/src/components/TimeAgo.tsx
new file mode 100644
index 0000000..dfda08d
--- /dev/null
+++ b/packages/client/src/components/TimeAgo.tsx
@@ -0,0 +1,17 @@
+import {format} from 'timeago.js'
+import React from 'react'
+
+export interface ITimeAgoProps {
+  className?: string
+  date: Date | string
+}
+
+export class TimeAgo extends React.PureComponent<ITimeAgoProps> {
+  render() {
+    return (
+      <time className={this.props.className}>
+        {format(this.props.date)}
+      </time>
+    )
+  }
+}
diff --git a/packages/client/src/components/index.ts b/packages/client/src/components/index.ts
index a4e24d8..16a4ed7 100644
--- a/packages/client/src/components/index.ts
+++ b/packages/client/src/components/index.ts
@@ -6,3 +6,4 @@ export * from './Link'
 export * from './Modal'
 export * from './Redirect'
 export * from './withHistory'
+export * from './TimeAgo'