Implement relative-time helper using @formatjs/intl-utils

skylines-project · Sep 16, 2020 · b88d5a4 · b88d5a4
1 parent 9069d87
commit b88d5a4
Show file tree

Hide file tree

Showing 8 changed files with 43 additions and 7 deletions.
diff --git a/ember/app/components/flight-details-table.hbs b/ember/app/components/flight-details-table.hbs
@@ -144,7 +144,7 @@
       <td>
         {{t "TIME-by-USER"
           htmlSafe=true
-          time=(format-relative flight.timeCreated)
+          time=(relative-time flight.timeCreated)
           user=flight.igcFile.owner.name
           userURL=(href-to "user" flight.igcFile.owner.id)}}</td>
     </tr>

diff --git a/ember/app/components/timeline-events/ui.hbs b/ember/app/components/timeline-events/ui.hbs
@@ -8,7 +8,7 @@
         title={{format-time @time format="full"}}
         local-class="time"
       >
-        {{format-relative @time}}
+        {{relative-time @time}}
       </time>
 
       {{#if @newBadge}}

diff --git a/ember/app/components/tracking-table-row.hbs b/ember/app/components/tracking-table-row.hbs
@@ -1,7 +1,7 @@
 <tr ...attributes>
   <td class="hidden-xs date">
     <time title={{format-time @track.time format="full"}} datetime={{to-iso-string @track.time}}>
-      {{format-relative @track.time interval=1000}}
+      {{relative-time @track.time}}
     </time>
   </td>
 

diff --git a/ember/app/components/user-distance-flight.hbs b/ember/app/components/user-distance-flight.hbs
@@ -6,7 +6,7 @@
         datetime={{to-iso-string @flight.scoreDate}}
         title={{format-date @flight.scoreDate format="ddmmyyyy" timeZone="UTC"}}
       >
-        {{format-relative @flight.scoreDate}}
+        {{relative-time @flight.scoreDate}}
       </time>
       <div class="pull-right">
         <LinkTo @route="flight" @model={{@flight.id}} class="btn btn-default btn-sm">{{t "show"}}</LinkTo>

diff --git a/ember/app/helpers/relative-time.js b/ember/app/helpers/relative-time.js
@@ -0,0 +1,29 @@
+import { selectUnit } from '@formatjs/intl-utils';
+import { task, rawTimeout } from 'ember-concurrency';
+import BaseHelper from 'ember-intl/-private/helpers/-format-base';
+
+const UPDATE_INTERVALS = {
+  second: 500,
+  minute: 15 * 1000,
+  hour: 10 * 60 * 1000,
+  day: 4 * 60 * 60 * 1000,
+};
+
+export default class extends BaseHelper {
+  format(date) {
+    let { value, unit } = selectUnit(date);
+
+    let updateInterval = UPDATE_INTERVALS[unit];
+    if (updateInterval !== undefined) {
+      this.updateTask.perform(updateInterval);
+    }
+
+    return this.intl.formatRelative(value, { unit });
+  }
+
+  @(task(function* (interval) {
+    yield rawTimeout(interval);
+    this.recompute();
+  }).restartable())
+  updateTask;
+}
diff --git a/ember/app/templates/club/index.hbs b/ember/app/templates/club/index.hbs
@@ -24,9 +24,9 @@
               <th>{{t "created"}}</th>
               <td>
                 {{#if club.owner}}
-                  {{format-relative club.timeCreated}} by <LinkTo @route="user" @model={{club.owner.id}}>{{club.owner.name}}</LinkTo>
+                  {{relative-time club.timeCreated}} by <LinkTo @route="user" @model={{club.owner.id}}>{{club.owner.name}}</LinkTo>
                 {{else}}
-                  {{format-relative club.timeCreated}}
+                  {{relative-time club.timeCreated}}
                 {{/if}}
               </td>
             </tr>

diff --git a/ember/package.json b/ember/package.json
@@ -18,6 +18,7 @@
     "test": "ember test"
   },
   "dependencies": {
+    "@formatjs/intl-utils": "^3.8.4",
     "cesium": "1.73.0",
     "ol": "5.3.3",
     "olcs": "2.11.3",

diff --git a/ember/yarn.lock b/ember/yarn.lock
@@ -1260,6 +1260,13 @@
   resolved "https://registry.yarnpkg.com/@formatjs/ecma402-abstract/-/ecma402-abstract-1.2.1.tgz#ad966998d7f0e96fca4bdc5de0ca28d02f371279"
   integrity sha512-LvbwgHxprafjceDfOC7yMl4sP5al71rAWahXk3qug5bV020aCq64WjqAo+zNnkIJk8hqK2pFKnNdDsT58HZJQw==
 
+"@formatjs/intl-utils@^3.8.4":
+  version "3.8.4"
+  resolved "https://registry.yarnpkg.com/@formatjs/intl-utils/-/intl-utils-3.8.4.tgz#291baac91001db428fc3275c515a3e40fbe95945"
+  integrity sha512-j5C6NyfKevIxsfLK8KwO1C0vvP7k1+h4A9cFpc+cr6mEwCc1sPkr17dzh0Ke6k9U5pQccAQoXdcNBl3IYa4+ZQ==
+  dependencies:
+    emojis-list "^3.0.0"
+
 "@glimmer/[email protected]", "@glimmer/component@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@glimmer/component/-/component-1.0.1.tgz#f304b2f9cf4f2762396abed2b8962486767e0b2e"
@@ -2647,7 +2654,6 @@ atob@^2.1.2:
 
 "auto-changelog@github:mansona/auto-changelog#epic":
   version "2.2.0"
-  uid "6309eecfec6ef5aa18086074304f73964aa11f11"
   resolved "https://codeload.github.com/mansona/auto-changelog/tar.gz/6309eecfec6ef5aa18086074304f73964aa11f11"
   dependencies:
     commander "^5.0.0"