From 6332d5040d18ee682c7e417f8131df77b51861e3 Mon Sep 17 00:00:00 2001 From: Sam Date: Mon, 14 May 2018 13:07:59 +1000 Subject: [PATCH] UX: switch dashboard to be the new dashboard Also: - add pageviews - add problems and version sections --- .../controllers/admin-dashboard-next.js.es6 | 53 ++++++++++++++++++- .../admin/controllers/admin-dashboard.js.es6 | 46 ---------------- .../admin/models/admin-dashboard-next.js.es6 | 22 ++++++++ .../admin/models/admin-dashboard.js.es6 | 17 ------ .../admin/routes/admin-route-map.js.es6 | 4 +- .../javascripts/admin/templates/admin.hbs | 2 +- .../admin/templates/dashboard-problems.hbs | 35 ++++++++++++ .../javascripts/admin/templates/dashboard.hbs | 42 --------------- .../admin/templates/dashboard_next.hbs | 20 ++++++- app/controllers/admin/dashboard_controller.rb | 1 - .../admin/dashboard_next_controller.rb | 1 + app/jobs/scheduled/dashboard_stats.rb | 2 +- app/models/admin_dashboard_next_data.rb | 2 +- config/locales/client.en.yml | 2 + config/locales/server.en.yml | 2 +- 15 files changed, 137 insertions(+), 114 deletions(-) create mode 100644 app/assets/javascripts/admin/templates/dashboard-problems.hbs diff --git a/app/assets/javascripts/admin/controllers/admin-dashboard-next.js.es6 b/app/assets/javascripts/admin/controllers/admin-dashboard-next.js.es6 index af8a0d26dc8..95d248a4af7 100644 --- a/app/assets/javascripts/admin/controllers/admin-dashboard-next.js.es6 +++ b/app/assets/javascripts/admin/controllers/admin-dashboard-next.js.es6 @@ -1,7 +1,11 @@ +import { setting } from 'discourse/lib/computed'; import DiscourseURL from "discourse/lib/url"; import computed from "ember-addons/ember-computed-decorators"; import AdminDashboardNext from "admin/models/admin-dashboard-next"; import Report from "admin/models/report"; +import VersionCheck from 'admin/models/version-check'; + +const PROBLEMS_CHECK_MINUTES = 1; export default Ember.Controller.extend({ queryParams: ["period"], @@ -9,10 +13,28 @@ export default Ember.Controller.extend({ isLoading: false, dashboardFetchedAt: null, exceptionController: Ember.inject.controller("exception"), + showVersionChecks: setting('version_checks'), diskSpace: Ember.computed.alias("model.attributes.disk_space"), availablePeriods: ["yearly", "quarterly", "monthly", "weekly"], + @computed('problems.length') + foundProblems(problemsLength) { + return this.currentUser.get('admin') && (problemsLength || 0) > 0; + }, + + + @computed('foundProblems') + thereWereProblems(foundProblems) { + if (!this.currentUser.get('admin')) { return false; } + + if (foundProblems) { + this.set('hadProblems', true); + return true; + } else { + return this.get('hadProblems') || false; + } + }, fetchDashboard() { if (this.get("isLoading")) return; @@ -20,7 +42,14 @@ export default Ember.Controller.extend({ if (!this.get("dashboardFetchedAt") || moment().subtract(30, "minutes").toDate() > this.get("dashboardFetchedAt")) { this.set("isLoading", true); + const versionChecks = this.siteSettings.version_checks; + AdminDashboardNext.find().then(adminDashboardNextModel => { + + if (versionChecks) { + this.set('versionCheck', VersionCheck.create(adminDashboardNextModel.version_check)); + } + this.setProperties({ dashboardFetchedAt: new Date(), model: adminDashboardNextModel, @@ -33,6 +62,25 @@ export default Ember.Controller.extend({ this.set("isLoading", false); }); } + + if (!this.get('problemsFetchedAt') || moment().subtract(PROBLEMS_CHECK_MINUTES, 'minutes').toDate() > this.get('problemsFetchedAt')) { + this.loadProblems(); + } + }, + + loadProblems() { + this.set('loadingProblems', true); + this.set('problemsFetchedAt', new Date()); + AdminDashboardNext.fetchProblems().then(d => { + this.set('problems', d.problems); + }).finally(() => { + this.set('loadingProblems', false); + }); + }, + + @computed('problemsFetchedAt') + problemsTimestamp(problemsFetchedAt) { + return moment(problemsFetchedAt).format('LLL'); }, @computed("period") @@ -80,7 +128,10 @@ export default Ember.Controller.extend({ actions: { changePeriod(period) { DiscourseURL.routeTo(this._reportsForPeriodURL(period)); - } + }, + refreshProblems() { + this.loadProblems(); + }, }, _reportsForPeriodURL(period) { diff --git a/app/assets/javascripts/admin/controllers/admin-dashboard.js.es6 b/app/assets/javascripts/admin/controllers/admin-dashboard.js.es6 index 6652002fb46..973cd3d57c9 100644 --- a/app/assets/javascripts/admin/controllers/admin-dashboard.js.es6 +++ b/app/assets/javascripts/admin/controllers/admin-dashboard.js.es6 @@ -1,11 +1,8 @@ -import { setting } from 'discourse/lib/computed'; import AdminDashboard from 'admin/models/admin-dashboard'; -import VersionCheck from 'admin/models/version-check'; import Report from 'admin/models/report'; import AdminUser from 'admin/models/admin-user'; import computed from 'ember-addons/ember-computed-decorators'; -const PROBLEMS_CHECK_MINUTES = 1; const ATTRIBUTES = [ 'disk_space','admins', 'moderators', 'silenced', 'suspended', 'top_traffic_sources', 'top_referred_topics', 'updated_at']; @@ -18,35 +15,13 @@ export default Ember.Controller.extend({ loading: null, versionCheck: null, dashboardFetchedAt: null, - showVersionChecks: setting('version_checks'), exceptionController: Ember.inject.controller('exception'), - @computed('problems.length') - foundProblems(problemsLength) { - return this.currentUser.get('admin') && (problemsLength || 0) > 0; - }, - - @computed('foundProblems') - thereWereProblems(foundProblems) { - if (!this.currentUser.get('admin')) { return false; } - - if (foundProblems) { - this.set('hadProblems', true); - return true; - } else { - return this.get('hadProblems') || false; - } - }, - fetchDashboard() { if (!this.get('dashboardFetchedAt') || moment().subtract(30, 'minutes').toDate() > this.get('dashboardFetchedAt')) { this.set('loading', true); - const versionChecks = this.siteSettings.version_checks; AdminDashboard.find().then(d => { this.set('dashboardFetchedAt', new Date()); - if (versionChecks) { - this.set('versionCheck', VersionCheck.create(d.version_check)); - } REPORTS.forEach(name => this.set(name, d[name].map(r => Report.create(r)))); @@ -64,26 +39,8 @@ export default Ember.Controller.extend({ this.set('loading', false); }); } - - if (!this.get('problemsFetchedAt') || moment().subtract(PROBLEMS_CHECK_MINUTES, 'minutes').toDate() > this.get('problemsFetchedAt')) { - this.loadProblems(); - } }, - loadProblems() { - this.set('loadingProblems', true); - this.set('problemsFetchedAt', new Date()); - AdminDashboard.fetchProblems().then(d => { - this.set('problems', d.problems); - }).finally(() => { - this.set('loadingProblems', false); - }); - }, - - @computed('problemsFetchedAt') - problemsTimestamp(problemsFetchedAt) { - return moment(problemsFetchedAt).format('LLL'); - }, @computed('updated_at') updatedTimestamp(updatedAt) { @@ -91,9 +48,6 @@ export default Ember.Controller.extend({ }, actions: { - refreshProblems() { - this.loadProblems(); - }, showTrafficReport() { this.set("showTrafficReport", true); } diff --git a/app/assets/javascripts/admin/models/admin-dashboard-next.js.es6 b/app/assets/javascripts/admin/models/admin-dashboard-next.js.es6 index 4747529fe7e..db3adf22481 100644 --- a/app/assets/javascripts/admin/models/admin-dashboard-next.js.es6 +++ b/app/assets/javascripts/admin/models/admin-dashboard-next.js.es6 @@ -13,10 +13,13 @@ AdminDashboardNext.reopenClass({ @return {jqXHR} a jQuery Promise object **/ find() { + return ajax("/admin/dashboard-next.json").then(function(json) { + var model = AdminDashboardNext.create(); model.set("reports", json.reports); + model.set("version_check", json.version_check); const attributes = {}; ATTRIBUTES.forEach(a => attributes[a] = json[a]); @@ -24,6 +27,25 @@ AdminDashboardNext.reopenClass({ model.set("loaded", true); + return model; + }); + }, + + + /** + Only fetch the list of problems that should be rendered on the dashboard. + The model will only have its "problems" attribute set. + + @method fetchProblems + @return {jqXHR} a jQuery Promise object + **/ + fetchProblems: function() { + return ajax("/admin/dashboard/problems.json", { + type: 'GET', + dataType: 'json' + }).then(function(json) { + var model = AdminDashboardNext.create(json); + model.set('loaded', true); return model; }); } diff --git a/app/assets/javascripts/admin/models/admin-dashboard.js.es6 b/app/assets/javascripts/admin/models/admin-dashboard.js.es6 index ac44a7677f1..49ed8e1a078 100644 --- a/app/assets/javascripts/admin/models/admin-dashboard.js.es6 +++ b/app/assets/javascripts/admin/models/admin-dashboard.js.es6 @@ -19,23 +19,6 @@ AdminDashboard.reopenClass({ }); }, - /** - Only fetch the list of problems that should be rendered on the dashboard. - The model will only have its "problems" attribute set. - - @method fetchProblems - @return {jqXHR} a jQuery Promise object - **/ - fetchProblems: function() { - return ajax("/admin/dashboard/problems.json", { - type: 'GET', - dataType: 'json' - }).then(function(json) { - var model = AdminDashboard.create(json); - model.set('loaded', true); - return model; - }); - } }); export default AdminDashboard; diff --git a/app/assets/javascripts/admin/routes/admin-route-map.js.es6 b/app/assets/javascripts/admin/routes/admin-route-map.js.es6 index 5b42f045e1d..5a033e1efa5 100644 --- a/app/assets/javascripts/admin/routes/admin-route-map.js.es6 +++ b/app/assets/javascripts/admin/routes/admin-route-map.js.es6 @@ -1,7 +1,7 @@ export default function() { this.route('admin', { resetNamespace: true }, function() { - this.route('dashboard', { path: '/' }); - this.route('dashboardNext', { path: '/dashboard-next' }); + this.route('dashboard', { path: '/dashboard-old' }); + this.route('dashboardNext', { path: '/' }); this.route('adminSiteSettings', { path: '/site_settings', resetNamespace: true }, function() { this.route('adminSiteSettingsCategory', { path: 'category/:category_id', resetNamespace: true} ); }); diff --git a/app/assets/javascripts/admin/templates/admin.hbs b/app/assets/javascripts/admin/templates/admin.hbs index 092133b7c17..cf4d231d4ed 100644 --- a/app/assets/javascripts/admin/templates/admin.hbs +++ b/app/assets/javascripts/admin/templates/admin.hbs @@ -3,7 +3,7 @@