diff --git a/app/assets/javascripts/admin/components/admin-report.js.es6 b/app/assets/javascripts/admin/components/admin-report.js.es6
index 8567bed16d0..67d5b573782 100644
--- a/app/assets/javascripts/admin/components/admin-report.js.es6
+++ b/app/assets/javascripts/admin/components/admin-report.js.es6
@@ -111,6 +111,8 @@ export default Ember.Component.extend({
showTimeoutError: Ember.computed.alias("model.timeout"),
+ hasData: Ember.computed.notEmpty("model.data"),
+
@computed("dataSourceName", "model.type")
dasherizedDataSourceName(dataSourceName, type) {
return (dataSourceName || type || "undefined").replace(/_/g, "-");
diff --git a/app/assets/javascripts/admin/templates/components/admin-report.hbs b/app/assets/javascripts/admin/templates/components/admin-report.hbs
index 4c387c9f099..2f0429854e5 100644
--- a/app/assets/javascripts/admin/templates/components/admin-report.hbs
+++ b/app/assets/javascripts/admin/templates/components/admin-report.hbs
@@ -67,8 +67,14 @@
{{#unless showTimeoutError}}
- {{#if currentMode}}
- {{component modeComponent model=model options=options}}
+ {{#if hasData}}
+ {{#if currentMode}}
+ {{component modeComponent model=model options=options}}
+ {{/if}}
+ {{else}}
+
+ {{i18n 'admin.dashboard.reports.no_data'}}
+
{{/if}}
{{/unless}}
diff --git a/app/assets/stylesheets/common/admin/admin_report.scss b/app/assets/stylesheets/common/admin/admin_report.scss
index 8382d381160..1ced78a4e6d 100644
--- a/app/assets/stylesheets/common/admin/admin_report.scss
+++ b/app/assets/stylesheets/common/admin/admin_report.scss
@@ -1,4 +1,13 @@
.admin-report {
+ .no-data-alert {
+ width: 100%;
+ align-self: flex-start;
+ }
+
+ .conditional-loading-section {
+ width: 100%;
+ }
+
.report-header {
display: flex;
justify-content: space-between;
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index fd8245a8fa3..17e2fc9f73a 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -2811,6 +2811,7 @@ en:
disabled: "This report is disabled"
totals_for_sample: "Totals for sample"
total: "All time total"
+ no_data: "No data to display."
trending_search:
more: '
Search logs'
disabled: 'Trending search report is disabled. Enable
log search queries to collect data.'
diff --git a/test/javascripts/components/admin-report-test.js.es6 b/test/javascripts/components/admin-report-test.js.es6
index 900886db887..faf7929511c 100644
--- a/test/javascripts/components/admin-report-test.js.es6
+++ b/test/javascripts/components/admin-report-test.js.es6
@@ -115,3 +115,11 @@ componentTest("timeout", {
assert.ok(exists(".alert-error"), "it displays a timeout error");
}
});
+
+componentTest("no data", {
+ template: "{{admin-report dataSourceName='posts'}}",
+
+ test(assert) {
+ assert.ok(exists(".no-data-alert"), "it displays a no data alert");
+ }
+});