FEATURE: show default custom date on time-shortcut-pickers (#17867)

app/assets/javascripts/discourse/app/components/time-shortcut-picker.js

@@ -1,9 +1,4 @@
-import {
-  START_OF_DAY_HOUR,
-  laterToday,
-  now,
-  parseCustomDatetime,
-} from "discourse/lib/time-utils";
+import { laterToday, now, parseCustomDatetime } from "discourse/lib/time-utils";
 import {
   TIME_SHORTCUT_TYPES,
   defaultTimeShortcuts,
@@ -70,12 +65,9 @@ export default Component.extend({
 
   _itsatrap: null,
 
-  defaultCustomReminderTime: `0${START_OF_DAY_HOUR}:00`,
-
   @on("init")
   _setupPicker() {
     this.setProperties({
-      customTime: this.defaultCustomReminderTime,
       userTimezone: this.currentUser.timezone,
       hiddenOptions: this.hiddenOptions || [],
       customOptions: this.customOptions || [],
@@ -232,7 +224,16 @@ export default Component.extend({
 
     let dateTime = null;
     if (type === TIME_SHORTCUT_TYPES.CUSTOM) {
-      this.set("customTime", this.customTime || this.defaultCustomReminderTime);
+      const defaultCustomDateTime = this._defaultCustomDateTime();
+      this.set(
+        "customDate",
+        this.customDate || defaultCustomDateTime.format("YYYY-MM-DD")
+      );
+      this.set(
+        "customTime",
+        this.customTime || defaultCustomDateTime.format("HH:mm")
+      );
+
       const customDatetime = parseCustomDatetime(
         this.customDate,
         this.customTime,
@@ -274,4 +275,8 @@ export default Component.extend({
       }
     });
   },
+
+  _defaultCustomDateTime() {
+    return moment.tz(this.userTimezone).add(1, "hour");
+  },
 });

app/assets/javascripts/discourse/app/templates/components/time-shortcut-picker.hbs

@@ -12,7 +12,7 @@
         <div class="control-group custom-date-time-wrap custom-input-wrap">
           <div class="tap-tile-date-input">
             {{d-icon "calendar-alt"}}
-            <DatePickerFuture @value={{this.customDate}} @onSelect={{action (mut this.customDate)}} @id="custom-date" />
+            <DatePickerFuture @value={{this.customDate}} @defaultDate={{this.defaultCustomDate}} @onSelect={{action (mut this.customDate)}} @id="custom-date" />
           </div>
           <div class="tap-tile-time-input">
             {{d-icon "far-clock"}}

app/assets/javascripts/discourse/tests/acceptance/topic-edit-timer-test.js

@@ -247,22 +247,18 @@ acceptance("Topic - Edit timer", function (needs) {
 
   test("schedule publish to category - last custom date and time", async function (assert) {
     updateCurrentUser({ moderator: true });
-
     await visit("/t/internationalization-localization");
-    await click(".toggle-admin-menu");
-    await click(".admin-topic-timer-update button");
-
-    await click("#tap_tile_custom");
-    await click(".modal-close");
 
     await click(".toggle-admin-menu");
     await click(".admin-topic-timer-update button");
-
     assert.notOk(
       exists("#tap_tile_last_custom"),
-      "it does not show last custom if the custom date and time was not filled and valid"
+      "it does not show last custom if the custom date and time was not filled before"
     );
 
+    await click(".modal-close");
+    await click(".toggle-admin-menu");
+    await click(".admin-topic-timer-update button");
     await click("#tap_tile_custom");
     await fillIn(".tap-tile-date-input .date-picker", "2100-11-24");
     await fillIn("#custom-time", "10:30");

app/assets/javascripts/discourse/tests/integration/components/time-shortcut-picker-test.js

@@ -116,11 +116,18 @@ module("Integration | Component | time-shortcut-picker", function (hooks) {
     );
   });
 
-  test("defaults to 08:00 for custom time", async function (assert) {
+  test("default custom date time is in one hour from now", async function (assert) {
+    this.clock = fakeTime(
+      "2100-12-11T17:00:00",
+      this.currentUser.timezone,
+      true
+    );
+
     await render(hbs`<TimeShortcutPicker @_itsatrap={{this.itsatrap}} />`);
 
     await click("#tap_tile_custom");
-    assert.strictEqual(query("#custom-time").value, "08:00");
+    assert.strictEqual(query("#custom-date > input").value, "2100-12-11");
+    assert.strictEqual(query("#custom-time").value, "18:00");
   });
 
   test("shows 'Next Monday' instead of 'Monday' on Sundays", async function (assert) {