Improvements to new community dashboard

- Limit dashboard to yearly,quarterly,monthly,weekly
- Always prefer UTC full days for reporting
This commit is contained in:
Sam 2018-05-09 18:05:40 +10:00
parent 36d9f7f814
commit c475905387
6 changed files with 29 additions and 10 deletions
app/assets/javascripts
admin
discourse/helpers
select-kit

@ -5,12 +5,15 @@ import Report from "admin/models/report";
export default Ember.Controller.extend({ export default Ember.Controller.extend({
queryParams: ["period"], queryParams: ["period"],
period: "all", period: "monthly",
isLoading: false, isLoading: false,
dashboardFetchedAt: null, dashboardFetchedAt: null,
exceptionController: Ember.inject.controller("exception"), exceptionController: Ember.inject.controller("exception"),
diskSpace: Ember.computed.alias("model.attributes.disk_space"), diskSpace: Ember.computed.alias("model.attributes.disk_space"),
availablePeriods: ["yearly", "quarterly", "monthly", "weekly"],
fetchDashboard() { fetchDashboard() {
if (this.get("isLoading")) return; if (this.get("isLoading")) return;

@ -3,7 +3,7 @@
<div class="community-health section"> <div class="community-health section">
<div class="section-title"> <div class="section-title">
<h2>{{i18n "admin.dashboard.community_health"}}</h2> <h2>{{i18n "admin.dashboard.community_health"}}</h2>
{{period-chooser period=period action="changePeriod"}} {{period-chooser period=period action="changePeriod" content=availablePeriods fullDay=true}}
</div> </div>
<div class="section-body"> <div class="section-body">

@ -12,21 +12,29 @@ export default htmlHelper((period, options) => {
const title = I18n.t('filters.top.' + (TITLE_SUBS[period] || 'this_week')); const title = I18n.t('filters.top.' + (TITLE_SUBS[period] || 'this_week'));
if (options.hash.showDateRange) { if (options.hash.showDateRange) {
var dateString = ""; var dateString = "";
let finish;
if (options.hash.fullDay) {
finish = moment().utc().subtract(1, 'days');
} else {
finish = moment();
}
switch(period) { switch(period) {
case 'yearly': case 'yearly':
dateString = moment().subtract(1, 'year').format(I18n.t('dates.long_with_year_no_time')) + " - " + moment().format(I18n.t('dates.long_with_year_no_time')); dateString = finish.clone().subtract(1, 'year').format(I18n.t('dates.long_with_year_no_time')) + " - " + finish.format(I18n.t('dates.long_with_year_no_time'));
break; break;
case 'quarterly': case 'quarterly':
dateString = moment().subtract(3, 'month').format(I18n.t('dates.long_no_year_no_time')) + " - " + moment().format(I18n.t('dates.long_no_year_no_time')); dateString = finish.clone().subtract(3, 'month').format(I18n.t('dates.long_no_year_no_time')) + " - " + finish.format(I18n.t('dates.long_no_year_no_time'));
break; break;
case 'weekly': case 'weekly':
dateString = moment().subtract(1, 'week').format(I18n.t('dates.long_no_year_no_time')) + " - " + moment().format(I18n.t('dates.long_no_year_no_time')); dateString = finish.clone().subtract(1, 'week').format(I18n.t('dates.long_no_year_no_time')) + " - " + finish.format(I18n.t('dates.long_no_year_no_time'));
break; break;
case 'monthly': case 'monthly':
dateString = moment().subtract(1, 'month').format(I18n.t('dates.long_no_year_no_time')) + " - " + moment().format(I18n.t('dates.long_no_year_no_time')); dateString = finish.clone().subtract(1, 'month').format(I18n.t('dates.long_no_year_no_time')) + " - " + finish.format(I18n.t('dates.long_no_year_no_time'));
break; break;
case 'daily': case 'daily':
dateString = moment().format(I18n.t('dates.full_no_year_no_time')); dateString = finish.clone().format(I18n.t('dates.full_no_year_no_time'));
break; break;
} }

@ -1,5 +1,5 @@
import DropdownSelectBoxComponent from "select-kit/components/dropdown-select-box"; import DropdownSelectBoxComponent from "select-kit/components/dropdown-select-box";
import computed from "ember-addons/ember-computed-decorators"; import computed, { on } from "ember-addons/ember-computed-decorators";
export default DropdownSelectBoxComponent.extend({ export default DropdownSelectBoxComponent.extend({
classNames: ["period-chooser"], classNames: ["period-chooser"],
@ -14,6 +14,14 @@ export default DropdownSelectBoxComponent.extend({
return isExpanded ? "caret-up" : "caret-down"; return isExpanded ? "caret-up" : "caret-down";
}, },
@on("didReceiveAttrs")
_setFullDay() {
this.get("headerComponentOptions").setProperties({fullDay: this.get("fullDay")});
this.get("rowComponentOptions").setProperties({fullDay: this.get("fullDay")});
},
actions: { actions: {
onSelect() { onSelect() {
this.sendAction("action", this.get("computedValue")); this.sendAction("action", this.get("computedValue"));

@ -1,5 +1,5 @@
<h2 class="selected-name" title={{title}}> <h2 class="selected-name" title={{title}}>
{{period-title value showDateRange=true}} {{period-title value showDateRange=true fullDay=options.fullDay}}
</h2> </h2>
{{d-icon caretIcon class="caret-icon"}} {{d-icon caretIcon class="caret-icon"}}

@ -1,5 +1,5 @@
<span class="selection-indicator"></span> <span class="selection-indicator"></span>
<span class="period-title"> <span class="period-title">
{{period-title value showDateRange=true}} {{period-title value showDateRange=true fullDay=options.fullDay}}
</span> </span>