mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-24 23:48:13 -05:00
💄 replace DownloadCountPoller with gh-download-count
closes https://github.com/TryGhost/Ghost/issues/8321 - adds `gh-download-count` component that uses ember-concurrency to poll the count endpoint - removes the no-longer-needed `setup/one` route as ember-concurrency now handles the setInterval bookkeeping for us
This commit is contained in:
parent
4a4226a6a9
commit
5534678f02
6 changed files with 94 additions and 72 deletions
41
ghost/admin/app/components/gh-download-count.js
Normal file
41
ghost/admin/app/components/gh-download-count.js
Normal file
|
@ -0,0 +1,41 @@
|
||||||
|
import Ember from 'ember';
|
||||||
|
import Component from 'ember-component';
|
||||||
|
import injectService from 'ember-service/inject';
|
||||||
|
import {task, timeout} from 'ember-concurrency';
|
||||||
|
|
||||||
|
const {testing} = Ember;
|
||||||
|
const INTERVAL = testing ? 20 : 2000;
|
||||||
|
|
||||||
|
export default Component.extend({
|
||||||
|
ajax: injectService(),
|
||||||
|
ghostPaths: injectService(),
|
||||||
|
|
||||||
|
count: '',
|
||||||
|
|
||||||
|
_poll: task(function* () {
|
||||||
|
let url = this.get('ghostPaths.count');
|
||||||
|
let pattern = /(-?\d+)(\d{3})/;
|
||||||
|
|
||||||
|
try {
|
||||||
|
let data = yield this.get('ajax').request(url);
|
||||||
|
let count = data.count.toString();
|
||||||
|
|
||||||
|
while (pattern.test(count)) {
|
||||||
|
count = count.replace(pattern, '$1,$2');
|
||||||
|
}
|
||||||
|
|
||||||
|
this.set('count', count);
|
||||||
|
|
||||||
|
if (!testing) {
|
||||||
|
yield timeout(INTERVAL);
|
||||||
|
this.get('_poll').perform();
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
// no-op - we don't want to create noise for a failed download count
|
||||||
|
}
|
||||||
|
}),
|
||||||
|
|
||||||
|
didInsertElement() {
|
||||||
|
this.get('_poll').perform();
|
||||||
|
}
|
||||||
|
});
|
|
@ -1,68 +0,0 @@
|
||||||
import Ember from 'ember';
|
|
||||||
import Route from 'ember-route';
|
|
||||||
import injectService from 'ember-service/inject';
|
|
||||||
import EmberObject from 'ember-object';
|
|
||||||
import run from 'ember-runloop';
|
|
||||||
|
|
||||||
import AjaxService from 'ember-ajax/services/ajax';
|
|
||||||
|
|
||||||
// ember-cli-shims doesn't export Ember.testing
|
|
||||||
const {testing} = Ember;
|
|
||||||
|
|
||||||
let DownloadCountPoller = EmberObject.extend({
|
|
||||||
url: null,
|
|
||||||
count: '',
|
|
||||||
runId: null,
|
|
||||||
|
|
||||||
ajax: AjaxService.create(),
|
|
||||||
notifications: injectService(),
|
|
||||||
|
|
||||||
init() {
|
|
||||||
this._super(...arguments);
|
|
||||||
this.downloadCounter();
|
|
||||||
this.poll();
|
|
||||||
},
|
|
||||||
|
|
||||||
poll() {
|
|
||||||
let interval = testing ? 20 : 2000;
|
|
||||||
let runId = run.later(this, function () {
|
|
||||||
this.downloadCounter();
|
|
||||||
if (!testing) {
|
|
||||||
this.poll();
|
|
||||||
}
|
|
||||||
}, interval);
|
|
||||||
|
|
||||||
this.set('runId', runId);
|
|
||||||
},
|
|
||||||
|
|
||||||
downloadCounter() {
|
|
||||||
this.get('ajax').request(this.get('url')).then((data) => {
|
|
||||||
let pattern = /(-?\d+)(\d{3})/;
|
|
||||||
let count = data.count.toString();
|
|
||||||
|
|
||||||
while (pattern.test(count)) {
|
|
||||||
count = count.replace(pattern, '$1,$2');
|
|
||||||
}
|
|
||||||
|
|
||||||
this.set('count', count);
|
|
||||||
}).catch((error) => {
|
|
||||||
this.set('count', '');
|
|
||||||
this.get('notifications').showAPIError(error);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
export default Route.extend({
|
|
||||||
ghostPaths: injectService(),
|
|
||||||
|
|
||||||
model() {
|
|
||||||
return DownloadCountPoller.create({url: this.get('ghostPaths.count')});
|
|
||||||
},
|
|
||||||
|
|
||||||
resetController(controller, isExiting) {
|
|
||||||
if (isExiting) {
|
|
||||||
run.cancel(controller.get('model.runId'));
|
|
||||||
controller.set('model', null);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
{{#if hasBlock}}
|
||||||
|
{{yield count}}
|
||||||
|
{{else}}
|
||||||
|
{{count}}
|
||||||
|
{{/if}}
|
|
@ -1,6 +1,6 @@
|
||||||
<header>
|
<header>
|
||||||
<h1>Welcome to <strong>Ghost</strong>!</h1>
|
<h1>Welcome to <strong>Ghost</strong>!</h1>
|
||||||
<p>All over the world, people have started <em>{{model.count}}</em> incredible blogs with Ghost. Today, we’re starting yours.</p>
|
<p>All over the world, people have started <em>{{gh-download-count}}</em> incredible blogs with Ghost. Today, we’re starting yours.</p>
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<figure class="gh-flow-screenshot">
|
<figure class="gh-flow-screenshot">
|
||||||
|
|
|
@ -100,9 +100,8 @@ describe('Acceptance: Setup', function () {
|
||||||
.to.be.false;
|
.to.be.false;
|
||||||
|
|
||||||
// it displays download count (count increments for each ajax call
|
// it displays download count (count increments for each ajax call
|
||||||
// and polling is disabled in testing so our count should be "2" -
|
// and polling is disabled in testing so our count should be "1"
|
||||||
// 1 for first load and 1 for first poll)
|
expect(find('.gh-flow-content em').text().trim()).to.equal('1');
|
||||||
expect(find('.gh-flow-content em').text()).to.equal('2');
|
|
||||||
});
|
});
|
||||||
|
|
||||||
click('.gh-btn-green');
|
click('.gh-btn-green');
|
||||||
|
|
|
@ -0,0 +1,45 @@
|
||||||
|
import {expect} from 'chai';
|
||||||
|
import {describe, it} from 'mocha';
|
||||||
|
import {setupComponentTest} from 'ember-mocha';
|
||||||
|
import hbs from 'htmlbars-inline-precompile';
|
||||||
|
import Pretender from 'pretender';
|
||||||
|
import wait from 'ember-test-helpers/wait';
|
||||||
|
|
||||||
|
describe('Integration: Component: gh-download-count', function() {
|
||||||
|
setupComponentTest('gh-download-count', {
|
||||||
|
integration: true
|
||||||
|
});
|
||||||
|
|
||||||
|
let server;
|
||||||
|
|
||||||
|
beforeEach(function () {
|
||||||
|
server = new Pretender();
|
||||||
|
server.get('https://count.ghost.org/', function () {
|
||||||
|
return [200, {}, JSON.stringify({count: 42})];
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
afterEach(function () {
|
||||||
|
server.shutdown();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('hits count endpoint and renders', function () {
|
||||||
|
this.render(hbs`{{gh-download-count}}`);
|
||||||
|
|
||||||
|
return wait().then(() => {
|
||||||
|
expect(this.$().text().trim()).to.equal('42');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('renders with a block', function () {
|
||||||
|
this.render(hbs`
|
||||||
|
{{#gh-download-count as |count|}}
|
||||||
|
{{count}} downloads
|
||||||
|
{{/gh-download-count}}
|
||||||
|
`);
|
||||||
|
|
||||||
|
return wait().then(() => {
|
||||||
|
expect(this.$().text().trim()).to.equal('42 downloads');
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
Loading…
Add table
Reference in a new issue