UX: improve new dashboard

- top referred topics
- limit search logs to 8 results

app/assets/javascripts/admin/components/dashboard-inline-table.js.es6

@@ -8,12 +8,31 @@ export default Ember.Component.extend(AsyncReport, {
   help: null,
   helpPage: null,
 
+  loadReport(report_json) {
+    this._setPropertiesFromReport(Report.create(report_json));
+  },
+
   fetchReport() {
     this.set("isLoading", true);
 
-    ajax(this.get("dataSource"))
+    let payload = { data: { async: true } };
+
+    if (this.get("startDate")) {
+      payload.data.start_date = this.get("startDate").format("YYYY-MM-DD[T]HH:mm:ss.SSSZZ");
+    }
+
+    if (this.get("endDate")) {
+      payload.data.end_date = this.get("endDate").format("YYYY-MM-DD[T]HH:mm:ss.SSSZZ");
+    }
+
+    if (this.get("limit")) {
+      payload.data.limit = this.get("limit");
+    }
+
+    ajax(this.get("dataSource"), payload)
       .then((response) => {
-        this._setPropertiesFromReport(Report.create(response.report));
+        this.set('reportKey', response.report.report_key);
+        this.loadReport(response.report);
       }).finally(() => {
         if (!Ember.isEmpty(this.get("report.data"))) {
           this.set("isLoading", false);

app/assets/javascripts/admin/components/dashboard-table-trending-search.js.es6

@@ -1,8 +0,0 @@
-import DashboardTable from "admin/components/dashboard-table";
-import AsyncReport from "admin/mixins/async-report";
-
-export default DashboardTable.extend(AsyncReport, {
-  layoutName: "admin/templates/components/dashboard-table",
-
-  classNames: ["dashboard-table", "dashboard-table-trending-search"]
-});

app/assets/javascripts/admin/components/dashboard-table.js.es6

@@ -1,59 +0,0 @@
-import { ajax } from "discourse/lib/ajax";
-import Report from "admin/models/report";
-import AsyncReport from "admin/mixins/async-report";
-import computed from "ember-addons/ember-computed-decorators";
-import { number } from 'discourse/lib/formatter';
-
-export default Ember.Component.extend(AsyncReport, {
-  classNames: ["dashboard-table"],
-  classNameBindings : ["isDisabled"],
-  help: null,
-  helpPage: null,
-  isDisabled: Ember.computed.not("siteSettings.log_search_queries"),
-  disabledLabel: "admin.dashboard.reports.disabled",
-
-  @computed("report")
-  values(report) {
-    if (!report) return;
-    return Ember.makeArray(report.data)
-                .map(x => {
-                  return [ x[0], number(x[1]), x[2] ];
-                });
-  },
-
-  @computed("report")
-  labels(report) {
-    if (!report) return;
-    return Ember.makeArray(report.labels);
-  },
-
-  loadReport(report_json) {
-    this._setPropertiesFromReport(Report.create(report_json));
-  },
-
-  fetchReport() {
-    if (this.get("isDisabled")) return;
-
-    this.set("isLoading", true);
-
-    let payload = { data: { async: true } };
-
-    if (this.get("startDate")) {
-      payload.data.start_date = this.get("startDate").format("YYYY-MM-DD[T]HH:mm:ss.SSSZZ");
-    }
-
-    if (this.get("endDate")) {
-      payload.data.end_date = this.get("endDate").format("YYYY-MM-DD[T]HH:mm:ss.SSSZZ");
-    }
-
-    ajax(this.get("dataSource"), payload)
-      .then((response) => {
-        this.set('reportKey', response.report.report_key);
-        this.loadReport(response.report);
-      }).finally(() => {
-        if (!Ember.isEmpty(this.get("report.data"))) {
-          this.set("isLoading", false);
-        };
-      });
-  }
-});

app/assets/javascripts/admin/mixins/async-report.js.es6

@@ -57,7 +57,11 @@ export default Ember.Mixin.create({
   @computed("report")
   labels(report) {
     if (!report) return;
-    return Ember.makeArray(report.data).map(r => r.x);
+    if (report.labels) {
+      return Ember.makeArray(report.labels);
+    } else {
+      return Ember.makeArray(report.data).map(r => r.x);
+    }
   },
 
   @computed("report")

app/assets/javascripts/admin/templates/components/dashboard-inline-table.hbs

@@ -17,15 +17,15 @@
         </tr>
       </thead>
       <tbody>
-        <tr>
-          {{#unless hasBlock}}
-            {{#each values as |value|}}
+        {{#unless hasBlock}}
+          {{#each values as |value|}}
+            <tr>
               <td>{{number value}}</td>
-            {{/each}}
-          {{else}}
-            {{yield (hash report=report)}}
-          {{/unless}}
-        </tr>
+            </tr>
+          {{/each}}
+        {{else}}
+          {{yield (hash report=report)}}
+        {{/unless}}
       </tbody>
     </table>
   </div>

app/assets/javascripts/admin/templates/components/dashboard-table.hbs

@@ -1,37 +0,0 @@
-{{#if isDisabled}}
-  {{{i18n disabledLabel}}}
-{{else}}
-  {{#conditional-loading-section isLoading=isLoading title=report.title}}
-    <div class="table-title">
-      <h3>{{report.title}}</h3>
-
-      {{#if help}}
-        <a href="{{helpPage}}">{{i18n help}}</a>
-      {{/if}}
-    </div>
-
-    <div class="table-container">
-      <table>
-        <thead>
-          <tr>
-            {{#each labels as |label|}}
-              <th>{{label}}</th>
-            {{/each}}
-          </tr>
-        </thead>
-
-        <tbody>
-          {{#each values as |value|}}
-            <tr>
-              {{#each value as |v|}}
-                <td>{{v}}</td>
-              {{/each}}
-            </tr>
-          {{/each}}
-        </tbody>
-      </table>
-
-      {{yield}}
-    </div>
-  {{/conditional-loading-section}}
-{{/if}}

app/assets/javascripts/admin/templates/dashboard_next.hbs

@@ -87,6 +87,7 @@
     </div>
 
     {{#dashboard-inline-table dataSourceName="users_by_type" lastRefreshedAt=lastRefreshedAt as |context|}}
+      <tr>
       {{#each context.report.data as |data|}}
         <td>
           <a href="/admin/users/list/{{data.key}}">
@@ -94,9 +95,11 @@
           </a>
         </td>
       {{/each}}
+      </tr>
     {{/dashboard-inline-table}}
 
     {{#dashboard-inline-table dataSourceName="users_by_trust_level" lastRefreshedAt=lastRefreshedAt as |context|}}
+      <tr>
       {{#each context.report.data as |data|}}
         <td>
           <a href="/admin/users/list/{{data.key}}">
@@ -104,6 +107,7 @@
           </a>
         </td>
       {{/each}}
+      </tr>
     {{/dashboard-inline-table}}
 
     {{#conditional-loading-section isLoading=isLoading title=(i18n "admin.dashboard.backups")}}
@@ -148,13 +152,47 @@
   </div>
 
   <div class="section-column">
-    {{#dashboard-table-trending-search
+    {{#dashboard-inline-table
+        dataSourceName="top_referred_topics"
+        lastRefreshedAt=lastRefreshedAt
+        limit=8
+        as |context|}}
+      {{#each context.report.data as |data|}}
+        <tr>
+        <td class='left'>
+          <a href="{{data.topic_url}}">
+            {{data.topic_title}}
+          </a>
+        </td>
+        <td>
+          {{data.num_clicks}}
+        </td>
+        </tr>
+      {{/each}}
+    {{/dashboard-inline-table}}
+
+    {{#dashboard-inline-table
+      limit=8
       dataSourceName="trending_search"
       isEnabled=logSearchQueriesEnabled
       disabledLabel="admin.dashboard.reports.trending_search.disabled"
       startDate=lastWeek
-      endDate=endDate}}
+      endDate=endDate as |context|}}
+      {{#each context.report.data as |data|}}
+        <tr>
+        <td class='left'>
+          {{data.term}}
+        </td>
+        <td>
+          {{number data.unique_searches}}
+        </td>
+        <td>
+          {{data.ctr}}
+        </td>
+        </tr>
+      {{/each}}
       {{{i18n "admin.dashboard.reports.trending_search.more"}}}
-    {{/dashboard-table-trending-search}}
-  </div>
+    {{/dashboard-inline-table}}
+
+    </div>
 </div>