diff --git a/addons/core/addon/components/relative-datetime-live/index.hbs b/addons/core/addon/components/relative-datetime-live/index.hbs
deleted file mode 100644
index ffa6fc83c..000000000
--- a/addons/core/addon/components/relative-datetime-live/index.hbs
+++ /dev/null
@@ -1 +0,0 @@
-{{this.formatted}}
diff --git a/addons/core/addon/components/relative-datetime-live/index.js b/addons/core/addon/components/relative-datetime-live/index.js
deleted file mode 100644
index ba4bc9e26..000000000
--- a/addons/core/addon/components/relative-datetime-live/index.js
+++ /dev/null
@@ -1,103 +0,0 @@
-import Component from '@glimmer/component';
-import { inject as service } from '@ember/service';
-
-const MILLISECOND = 1;
-const SECOND = MILLISECOND * 1000;
-const MINUTE = SECOND * 60;
-const HOUR = MINUTE * 60;
-const DAY = HOUR * 24;
-const MONTH = DAY * 31;
-const YEAR = MONTH * 12;
-
-// common time intervals in milliseconds
-const unitMappings = [
- {
- unit: 'second',
- value: SECOND,
- },
- {
- unit: 'minute',
- value: MINUTE,
- },
- {
- unit: 'hour',
- value: HOUR,
- },
- {
- unit: 'day',
- value: DAY,
- },
- {
- unit: 'month',
- value: MONTH,
- },
- {
- unit: 'year',
- value: YEAR,
- },
-];
-
-export default class RelativeDatetimeLiveComponent extends Component {
- // =services
-
- @service clockTick;
- @service intl;
-
- // =properties
-
- /**
- * The difference in milliseconds between the date argument and the
- * current time.
- * @type {number}
- */
- get delta() {
- return this.args.date.valueOf() - this.clockTick.now;
- }
-
- /**
- * The greatest meaningful unit is the unit which delta is equal to or
- * greater than. For example, the unit of a delta equivalent of 59 seconds is
- * 'second' while 60 seconds is 'minute', 36 hours is 'day', etc.
- * @type {object}
- */
- get greatestMeaningfulUnit() {
- return unitMappings.reduce((currentValue, previousValue) => {
- return Math.abs(this.delta) >= previousValue.value
- ? previousValue
- : currentValue;
- }, unitMappings[0]);
- }
-
- /**
- * The delta value scaled to the greatest meaningful unit. For example, if
- * the delta is 1000 ms, the scaled value is 1, which corresponds to
- * a GMU of 'second'. A delta of 60000 ms is also 1, corresponding to a GMU
- * of 'minute'.
- * @type {number}
- */
- get scaledDelta() {
- if (this.delta < 0) {
- return Math.ceil(this.delta / this.greatestMeaningfulUnit.value);
- }
- return Math.floor(this.delta / this.greatestMeaningfulUnit.value);
- }
-
- /**
- * A string representation of the greatest meaningful unit.
- * @type {string}
- */
- get unit() {
- return this.greatestMeaningfulUnit.unit;
- }
-
- /**
- * A localizd relative datetime. E.g. "30 seconds ago".
- * @type {string}
- */
- get formatted() {
- return this.intl.formatRelative(this.scaledDelta, {
- unit: this.unit,
- numeric: 'auto',
- });
- }
-}
diff --git a/addons/core/addon/components/toolbar-refresher/index.hbs b/addons/core/addon/components/toolbar-refresher/index.hbs
index dc1f7784f..787bf4ec8 100644
--- a/addons/core/addon/components/toolbar-refresher/index.hbs
+++ b/addons/core/addon/components/toolbar-refresher/index.hbs
@@ -1,9 +1,9 @@
{{#if this.lastRefreshed}}
-
+ {{relative-datetime-live this.lastRefreshed}}
{{/if}}
{{t 'actions.refresh'}}
-
\ No newline at end of file
+
diff --git a/addons/core/addon/helpers/relative-datetime-live.js b/addons/core/addon/helpers/relative-datetime-live.js
new file mode 100644
index 000000000..de7ab46aa
--- /dev/null
+++ b/addons/core/addon/helpers/relative-datetime-live.js
@@ -0,0 +1,68 @@
+import Helper from '@ember/component/helper';
+import { inject as service } from '@ember/service';
+
+const MILLISECOND = 1;
+const SECOND = MILLISECOND * 1000;
+const MINUTE = SECOND * 60;
+const HOUR = MINUTE * 60;
+const DAY = HOUR * 24;
+const MONTH = DAY * 31;
+const YEAR = MONTH * 12;
+
+const unitMappings = [
+ {
+ unit: 'second',
+ value: SECOND,
+ },
+ {
+ unit: 'minute',
+ value: MINUTE,
+ },
+ {
+ unit: 'hour',
+ value: HOUR,
+ },
+ {
+ unit: 'day',
+ value: DAY,
+ },
+ {
+ unit: 'month',
+ value: MONTH,
+ },
+ {
+ unit: 'year',
+ value: YEAR,
+ },
+];
+
+export default class extends Helper {
+ // =services
+
+ @service clockTick;
+ @service intl;
+
+ // =methods
+
+ compute([date]) {
+ const delta = date.valueOf() - this.clockTick.now;
+ console.log(delta);
+ const greatestMeaningfulUnit = unitMappings.reduce(
+ (currentValue, previousValue) => {
+ return Math.abs(delta) >= previousValue.value
+ ? previousValue
+ : currentValue;
+ },
+ unitMappings[0]
+ );
+ const scaledDelta =
+ delta < 0
+ ? Math.ceil(delta / greatestMeaningfulUnit.value)
+ : Math.floor(delta / greatestMeaningfulUnit.value);
+ const unit = greatestMeaningfulUnit.unit;
+ return this.intl.formatRelative(scaledDelta, {
+ unit,
+ numeric: 'auto',
+ });
+ }
+}
diff --git a/addons/core/app/components/relative-datetime-live.js b/addons/core/app/components/relative-datetime-live.js
deleted file mode 100644
index c338a513a..000000000
--- a/addons/core/app/components/relative-datetime-live.js
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from 'core/components/relative-datetime-live';
diff --git a/addons/core/app/helpers/relative-datetime-live.js b/addons/core/app/helpers/relative-datetime-live.js
new file mode 100644
index 000000000..981caec58
--- /dev/null
+++ b/addons/core/app/helpers/relative-datetime-live.js
@@ -0,0 +1 @@
+export { default } from 'core/helpers/relative-datetime-live';
diff --git a/addons/core/tests/dummy/app/templates/application.hbs b/addons/core/tests/dummy/app/templates/application.hbs
index 0b957c048..4785fe202 100644
--- a/addons/core/tests/dummy/app/templates/application.hbs
+++ b/addons/core/tests/dummy/app/templates/application.hbs
@@ -1,3 +1,2 @@
Welcome to Ember
-
-
+{{relative-datetime-live this.now}}
diff --git a/addons/core/tests/integration/components/relative-datetime-live-test.js b/addons/core/tests/integration/components/relative-datetime-live-test.js
deleted file mode 100644
index 3a80df456..000000000
--- a/addons/core/tests/integration/components/relative-datetime-live-test.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import { module, test } from 'qunit';
-import { setupRenderingTest } from 'ember-qunit';
-import { render } from '@ember/test-helpers';
-import { hbs } from 'ember-cli-htmlbars';
-
-module('Integration | Component | relative-datetime-live', function (hooks) {
- setupRenderingTest(hooks);
-
- test('it renders a relative datetime', async function (assert) {
- assert.expect(6);
-
- const now = Date.now();
-
- this.date = now - 10 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 seconds ago');
-
- this.date = now - 10 * 60 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 minutes ago');
-
- this.date = now - 10 * 60 * 60 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 hours ago');
-
- this.date = now - 10 * 24 * 60 * 60 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 days ago');
-
- this.date = now - 10 * 31 * 24 * 60 * 60 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 months ago');
-
- this.date = now - 10 * 12 * 31 * 24 * 60 * 60 * 1000;
- await render(hbs``);
- assert.dom(this.element).hasText('10 years ago');
- });
-});
diff --git a/addons/core/tests/integration/helpers/relative-datetime-live-test.js b/addons/core/tests/integration/helpers/relative-datetime-live-test.js
new file mode 100644
index 000000000..8887e0359
--- /dev/null
+++ b/addons/core/tests/integration/helpers/relative-datetime-live-test.js
@@ -0,0 +1,46 @@
+import { module, test } from 'qunit';
+import { setupRenderingTest } from 'ember-qunit';
+import { render } from '@ember/test-helpers';
+import { hbs } from 'ember-cli-htmlbars';
+
+module('Integration | Helper | relative-datetime-live', function (hooks) {
+ setupRenderingTest(hooks);
+
+ test('it renders relative date in "time" ago format', async function (assert) {
+ assert.expect(8);
+
+ const now = Date.now();
+
+ this.date = now - 30 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('30 seconds ago');
+
+ this.date = now - 30 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('30 minutes ago');
+
+ this.date = now - 23 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('23 hours ago');
+
+ this.date = now - 23 * 24 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('23 days ago');
+
+ this.date = now - 8 * 31 * 24 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('8 months ago');
+
+ this.date = now - 23 * 12 * 31 * 24 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('23 years ago');
+
+ this.date = now + 8 * 31 * 24 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('in 7 months');
+
+ this.date = now + 23 * 12 * 31 * 24 * 60 * 60 * 1000;
+ await render(hbs`{{relative-datetime-live this.date}}`);
+ assert.dom(this.element).hasText('in 22 years');
+ });
+});