FIX: better message if request for report is rate limited (#6298)

This commit is contained in:
Joffrey JAFFEUX
2018-08-22 11:25:12 +02:00
committed by GitHub
parent 50955dbe30
commit 599cebf8ad
5 changed files with 59 additions and 17 deletions

View File

@ -43,6 +43,7 @@ export default Ember.Component.extend({
isEnabled: true, isEnabled: true,
disabledLabel: "admin.dashboard.disabled", disabledLabel: "admin.dashboard.disabled",
isLoading: false, isLoading: false,
rateLimitationString: null,
dataSourceName: null, dataSourceName: null,
report: null, report: null,
model: null, model: null,
@ -303,7 +304,7 @@ export default Ember.Component.extend({
_fetchReport() { _fetchReport() {
this._super(); this._super();
this.set("isLoading", true); this.setProperties({ isLoading: true, rateLimitationString: null });
let payload = this._buildPayload(["prev_period"]); let payload = this._buildPayload(["prev_period"]);
@ -315,6 +316,12 @@ export default Ember.Component.extend({
console.log("failed loading", this.get("dataSource")); console.log("failed loading", this.get("dataSource"));
} }
}) })
.catch(data => {
if (data.jqXHR && data.jqXHR.status === 429) {
const error = data.jqXHR.responseJSON.errors[0];
this.set("rateLimitationString", error);
}
})
.finally(() => { .finally(() => {
if (this.element && !this.isDestroying && !this.isDestroyed) { if (this.element && !this.isDestroying && !this.isDestroyed) {
this.set("isLoading", false); this.set("isLoading", false);

View File

@ -57,21 +57,28 @@
{{/if}} {{/if}}
{{/if}} {{/if}}
{{else}} {{else}}
<div class="alert alert-info report-alert no-data"> {{#if rateLimitationString}}
{{d-icon "pie-chart"}} <div class="alert alert-error report-alert rate-limited">
{{#if model.reportUrl}} {{d-icon "thermometer-three-quarters"}}
<a href="{{model.reportUrl}}" class="report-url"> <span>{{rateLimitationString}}</span>
<span> </div>
{{#if model.title}} {{else}}
{{model.title}} <div class="alert alert-info report-alert no-data">
{{/if}} {{d-icon "pie-chart"}}
{{i18n "admin.dashboard.reports.no_data"}} {{#if model.reportUrl}}
</span> <a href="{{model.reportUrl}}" class="report-url">
</a> <span>
{{else}} {{#if model.title}}
<span>{{i18n "admin.dashboard.reports.no_data"}}</span> {{model.title}}
{{/if}} {{/if}}
</div> {{i18n "admin.dashboard.reports.no_data"}}
</span>
</a>
{{else}}
<span>{{i18n "admin.dashboard.reports.no_data"}}</span>
{{/if}}
</div>
{{/if}}
{{/if}} {{/if}}
{{else}} {{else}}
{{#if showTimeoutError}} {{#if showTimeoutError}}

View File

@ -96,12 +96,17 @@
display: block; display: block;
} }
&.no-data { &.no-data,
&.rate-limited {
background: $secondary; background: $secondary;
border-color: $primary-low; border-color: $primary-low;
color: $primary-low-mid; color: $primary-low-mid;
} }
&.rate-limited .d-icon {
color: $danger;
}
&.timeout, &.timeout,
&.exception { &.exception {
border-color: $danger-low; border-color: $danger-low;

View File

@ -309,6 +309,7 @@
flex-direction: row; flex-direction: row;
padding: 0.5em 0.25em; padding: 0.5em 0.25em;
align-items: center; align-items: center;
text-align: left;
border: 0; border: 0;
&:hover { &:hover {

View File

@ -130,3 +130,25 @@ componentTest("exception", {
assert.ok(exists(".alert-error.exception"), "it displays an error"); assert.ok(exists(".alert-error.exception"), "it displays an error");
} }
}); });
componentTest("rate limited", {
beforeEach() {
const response = object => {
return [429, { "Content-Type": "application/json" }, object];
};
// prettier-ignore
server.get("/admin/reports/signups_rate_limited", () => { //eslint-disable-line
return response({"errors":["You’ve performed this action too many times. Please wait 10 seconds before trying again."],"error_type":"rate_limit","extras":{"wait_seconds":10}});
});
},
template: "{{admin-report dataSourceName='signups_rate_limited'}}",
test(assert) {
assert.ok(
exists(".alert-error.rate-limited"),
"it displays a rate limited error"
);
}
});