FIX: show the `Next Monday` label instead of `Monday` on Sundays (#15745)

This commit is contained in:
Andrei Prigorshnev 2022-01-31 12:15:20 +01:00 committed by GitHub
parent aac9f43038
commit 18116433ee
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 262 additions and 233 deletions

View File

@ -1,12 +1,4 @@
import {
LATER_TODAY_CUTOFF_HOUR,
MOMENT_THURSDAY,
laterToday,
now,
parseCustomDatetime,
startOfDay,
tomorrow,
} from "discourse/lib/time-utils";
import { now, parseCustomDatetime, startOfDay } from "discourse/lib/time-utils";
import { AUTO_DELETE_PREFERENCES } from "discourse/models/bookmark";
import Component from "@ember/component";
import I18n from "I18n";
@ -330,38 +322,13 @@ export default Component.extend({
editingExistingBookmark,
existingBookmarkHasReminder
) {
if (!editingExistingBookmark) {
return [];
}
if (!existingBookmarkHasReminder) {
if (editingExistingBookmark && !existingBookmarkHasReminder) {
return [TIME_SHORTCUT_TYPES.NONE];
}
return [];
},
@discourseComputed()
additionalTimeShortcutOptions() {
let additional = [];
if (
!laterToday(this.userTimezone).isSame(
tomorrow(this.userTimezone),
"date"
) &&
now(this.userTimezone).hour() < LATER_TODAY_CUTOFF_HOUR
) {
additional.push(TIME_SHORTCUT_TYPES.LATER_TODAY);
}
if (now(this.userTimezone).day() < MOMENT_THURSDAY) {
additional.push(TIME_SHORTCUT_TYPES.LATER_THIS_WEEK);
}
return additional;
},
@discourseComputed("model.reminderAt")
existingReminderAtFormatted(existingReminderAt) {
return formattedReminderTime(existingReminderAt, this.userTimezone);

View File

@ -21,6 +21,7 @@ import {
thisWeekend,
} from "discourse/lib/time-utils";
import KeyboardShortcuts from "discourse/lib/keyboard-shortcuts";
import { TIME_SHORTCUT_TYPES } from "discourse/lib/time-shortcut";
import ItsATrap from "@discourse/itsatrap";
export default Component.extend({
@ -113,7 +114,11 @@ export default Component.extend({
@discourseComputed
hiddenTimeShortcutOptions() {
return ["none"];
return [
TIME_SHORTCUT_TYPES.NONE,
TIME_SHORTCUT_TYPES.LATER_TODAY,
TIME_SHORTCUT_TYPES.LATER_THIS_WEEK,
];
},
isCustom: equal("timerType", "custom"),

View File

@ -1,4 +1,6 @@
import {
LATER_TODAY_CUTOFF_HOUR,
MOMENT_THURSDAY,
START_OF_DAY_HOUR,
laterToday,
now,
@ -57,7 +59,6 @@ export default Component.extend({
selectedDatetime: null,
prefilledDatetime: null,
additionalOptionsToShow: null,
hiddenOptions: null,
customOptions: null,
@ -76,7 +77,6 @@ export default Component.extend({
this.setProperties({
customTime: this.defaultCustomReminderTime,
userTimezone: this.currentUser.resolvedTimezone(this.currentUser),
additionalOptionsToShow: this.additionalOptionsToShow || [],
hiddenOptions: this.hiddenOptions || [],
customOptions: this.customOptions || [],
customLabels: this.customLabels || {},
@ -168,38 +168,24 @@ export default Component.extend({
},
@discourseComputed(
"additionalOptionsToShow",
"hiddenOptions",
"customOptions",
"customLabels",
"userTimezone"
)
options(
additionalOptionsToShow,
hiddenOptions,
customOptions,
customLabels,
userTimezone
) {
options(hiddenOptions, customOptions, customLabels, userTimezone) {
this._loadLastUsedCustomDatetime();
let options = defaultShortcutOptions(userTimezone);
if (additionalOptionsToShow.length > 0) {
options.forEach((opt) => {
if (additionalOptionsToShow.includes(opt.id)) {
opt.hidden = false;
}
});
}
this._hideDynamicOptions(options);
customOptions.forEach((opt) => {
if (!opt.timeFormatted && opt.time) {
opt.timeFormatted = opt.time.format(I18n.t(opt.timeFormatKey));
}
});
options = options.concat(customOptions);
options.sort((a, b) => {
if (a.time < b.time) {
return -1;
@ -288,4 +274,19 @@ export default Component.extend({
this.onTimeSelected(type, dateTime);
}
},
_hideDynamicOptions(options) {
if (now(this.userTimezone).hour() >= LATER_TODAY_CUTOFF_HOUR) {
this._hideOption(options, TIME_SHORTCUT_TYPES.LATER_TODAY);
}
if (now(this.userTimezone).day() >= MOMENT_THURSDAY) {
this._hideOption(options, TIME_SHORTCUT_TYPES.LATER_THIS_WEEK);
}
},
_hideOption(options, optionId) {
const option = options.findBy("id", optionId);
option.hidden = true;
},
});

View File

@ -1,5 +1,6 @@
import {
MOMENT_MONDAY,
MOMENT_SUNDAY,
laterThisWeek,
laterToday,
nextBusinessWeekStart,
@ -30,7 +31,6 @@ export function defaultShortcutOptions(timezone) {
label: "time_shortcut.later_today",
time: laterToday(timezone),
timeFormatted: laterToday(timezone).format(I18n.t("dates.time")),
hidden: true,
},
{
icon: "far-sun",
@ -47,13 +47,13 @@ export function defaultShortcutOptions(timezone) {
timeFormatted: laterThisWeek(timezone).format(
I18n.t("dates.time_short_day")
),
hidden: true,
},
{
icon: "briefcase",
id: TIME_SHORTCUT_TYPES.START_OF_NEXT_BUSINESS_WEEK,
label:
now(timezone).day() === MOMENT_MONDAY
now(timezone).day() === MOMENT_MONDAY ||
now(timezone).day() === MOMENT_SUNDAY
? "time_shortcut.start_of_next_business_week_alt"
: "time_shortcut.start_of_next_business_week",
time: nextBusinessWeekStart(timezone),

View File

@ -3,6 +3,7 @@ import { isPresent } from "@ember/utils";
export const START_OF_DAY_HOUR = 8;
export const LATER_TODAY_CUTOFF_HOUR = 17;
export const LATER_TODAY_MAX_HOUR = 18;
export const MOMENT_SUNDAY = 0;
export const MOMENT_MONDAY = 1;
export const MOMENT_THURSDAY = 4;
export const MOMENT_SATURDAY = 6;

View File

@ -41,7 +41,6 @@
customOptions=customTimeShortcutOptions
hiddenOptions=hiddenTimeShortcutOptions
customLabels=customTimeShortcutLabels
additionalOptionsToShow=additionalTimeShortcutOptions
_itsatrap=_itsatrap
}}
{{else}}

View File

@ -1,16 +1,8 @@
import componentTest, {
setupRenderingTest,
} from "discourse/tests/helpers/component-test";
import {
discourseModule,
exists,
fakeTime,
query,
queryAll,
} from "discourse/tests/helpers/qunit-helpers";
import I18n from "I18n";
import { discourseModule, query } from "discourse/tests/helpers/qunit-helpers";
import hbs from "htmlbars-inline-precompile";
import { click } from "@ember/test-helpers";
discourseModule("Integration | Component | bookmark", function (hooks) {
setupRenderingTest(hooks);
@ -34,143 +26,6 @@ discourseModule("Integration | Component | bookmark", function (hooks) {
});
});
hooks.afterEach(function () {
if (this.clock) {
this.clock.restore();
}
});
componentTest("shows correct options", {
template,
beforeEach() {
const tuesday = "2100-06-08T08:00:00";
this.clock = fakeTime(tuesday, this.currentUser._timezone, true);
},
async test(assert) {
const expected = [
I18n.t("time_shortcut.later_today"),
I18n.t("time_shortcut.tomorrow"),
I18n.t("time_shortcut.later_this_week"),
I18n.t("time_shortcut.start_of_next_business_week"),
I18n.t("time_shortcut.next_month"),
I18n.t("time_shortcut.custom"),
I18n.t("time_shortcut.none"),
];
const options = Array.from(
queryAll(
"div.control-group div.tap-tile-grid div.tap-tile-title"
).map((_, div) => div.innerText.trim())
);
assert.deepEqual(options, expected);
},
});
componentTest("show later this week option if today is < Thursday", {
template,
beforeEach() {
const monday = "2100-06-07T08:00:00";
this.clock = fakeTime(monday, this.currentUser._timezone, true);
},
test(assert) {
assert.ok(exists("#tap_tile_later_this_week"), "it has later this week");
},
});
componentTest(
"does not show later this week option if today is >= Thursday",
{
template,
beforeEach() {
const thursday = "2100-06-10T08:00:00";
this.clock = fakeTime(thursday, this.currentUser._timezone, true);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_this_week"),
"it does not have later this week"
);
},
}
);
componentTest("later today does not show if later today is tomorrow", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T22:00:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_today"),
"it does not have later today"
);
},
});
componentTest("later today shows if it is after 5pm but before 6pm", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T14:30:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.ok(exists("#tap_tile_later_today"), "it does have later today");
},
});
componentTest("later today does not show if it is after 5pm", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T17:00:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_today"),
"it does not have later today"
);
},
});
componentTest("later today does show if it is before the end of the day", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T13:00:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.ok(exists("#tap_tile_later_today"), "it does have later today");
},
});
componentTest("prefills the custom reminder type date and time", {
template,
@ -189,32 +44,4 @@ discourseModule("Integration | Component | bookmark", function (hooks) {
assert.strictEqual(query("#custom-time").value, "09:45");
},
});
componentTest("defaults to 08:00 for custom time", {
template,
async test(assert) {
await click("#tap_tile_custom");
assert.strictEqual(query("#custom-time").value, "08:00");
},
});
componentTest("Next Month points to the first day of the next month", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-01-01T08:00:00",
this.currentUser._timezone,
true
);
},
async test(assert) {
assert.strictEqual(
query("div#tap_tile_next_month div.tap-tile-date").innerText,
"Feb 1, 8:00 am"
);
},
});
});

View File

@ -0,0 +1,229 @@
import componentTest, {
setupRenderingTest,
} from "discourse/tests/helpers/component-test";
import {
discourseModule,
exists,
fakeTime,
query,
queryAll,
} from "discourse/tests/helpers/qunit-helpers";
import I18n from "I18n";
import hbs from "htmlbars-inline-precompile";
import { click } from "@ember/test-helpers";
discourseModule(
"Integration | Component | time-shortcut-picker",
function (hooks) {
setupRenderingTest(hooks);
const template = hbs`{{time-shortcut-picker _itsatrap=itsatrap}}`;
hooks.beforeEach(function () {
const itsatrapStub = {
bind: () => {},
unbind: () => {},
};
this.set("itsatrap", itsatrapStub);
});
hooks.afterEach(function () {
if (this.clock) {
this.clock.restore();
}
});
componentTest("shows default options", {
template,
beforeEach() {
const tuesday = "2100-06-08T08:00:00";
this.clock = fakeTime(tuesday, this.currentUser._timezone, true);
},
async test(assert) {
const expected = [
I18n.t("time_shortcut.later_today"),
I18n.t("time_shortcut.tomorrow"),
I18n.t("time_shortcut.later_this_week"),
I18n.t("time_shortcut.start_of_next_business_week"),
I18n.t("time_shortcut.next_month"),
I18n.t("time_shortcut.custom"),
I18n.t("time_shortcut.none"),
];
const options = Array.from(
queryAll("div.tap-tile-grid div.tap-tile-title").map((_, div) =>
div.innerText.trim()
)
);
assert.deepEqual(options, expected);
},
});
componentTest("show 'Later This Week' if today is < Thursday", {
template,
beforeEach() {
const monday = "2100-06-07T08:00:00";
this.clock = fakeTime(monday, this.currentUser._timezone, true);
},
test(assert) {
assert.ok(
exists("#tap_tile_later_this_week"),
"it has later this week"
);
},
});
componentTest("does not show 'Later This Week' if today is >= Thursday", {
template,
beforeEach() {
const thursday = "2100-06-10T08:00:00";
this.clock = fakeTime(thursday, this.currentUser._timezone, true);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_this_week"),
"it does not have later this week"
);
},
});
componentTest("does not show 'Later Today' if 'Later Today' is tomorrow", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T22:00:00", // + 3 hours is tomorrow
this.currentUser._timezone,
true
);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_today"),
"it does not have later today"
);
},
});
componentTest("shows 'Later Today' if it is before 5pm", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T16:50:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.ok(exists("#tap_tile_later_today"), "it does have later today");
},
});
componentTest("does not show 'Later Today' if it is after 5pm", {
template,
beforeEach() {
this.clock = fakeTime(
"2100-12-11T17:00:00",
this.currentUser._timezone,
true
);
},
test(assert) {
assert.notOk(
exists("#tap_tile_later_today"),
"it does not have later today"
);
},
});
componentTest("defaults to 08:00 for custom time", {
template,
async test(assert) {
await click("#tap_tile_custom");
assert.strictEqual(query("#custom-time").value, "08:00");
},
});
componentTest("shows 'Next Monday' instead of 'Monday' on Sundays", {
template,
beforeEach() {
const sunday = "2100-01-24T08:00:00";
this.clock = fakeTime(sunday, this.currentUser._timezone, true);
},
async test(assert) {
assert.equal(
query("#tap_tile_start_of_next_business_week .tap-tile-title")
.innerText,
"Next Monday"
);
assert.equal(
query("div#tap_tile_start_of_next_business_week div.tap-tile-date")
.innerText,
"Feb 1, 8:00 am"
);
},
});
componentTest("shows 'Next Monday' instead of 'Monday' on Mondays", {
template,
beforeEach() {
const monday = "2100-01-25T08:00:00";
this.clock = fakeTime(monday, this.currentUser._timezone, true);
},
async test(assert) {
assert.equal(
query("#tap_tile_start_of_next_business_week .tap-tile-title")
.innerText,
"Next Monday"
);
assert.equal(
query("div#tap_tile_start_of_next_business_week div.tap-tile-date")
.innerText,
"Feb 1, 8:00 am"
);
},
});
componentTest(
"the 'Next Month' option points to the first day of the next month",
{
template,
beforeEach() {
this.clock = fakeTime(
"2100-01-01T08:00:00",
this.currentUser._timezone,
true
);
},
async test(assert) {
assert.strictEqual(
query("div#tap_tile_next_month div.tap-tile-date").innerText,
"Feb 1, 8:00 am"
);
},
}
);
}
);