DEV: Include helper in core for `applyLocalDates` (#16325)

app/assets/javascripts/discourse/app/lib/local-dates.js

@@ -0,0 +1,11 @@
+export function applyLocalDates(dates, siteSettings) {
+  if (!siteSettings.discourse_local_dates_enabled) {
+    return;
+  }
+
+  const _applyLocalDates = requirejs(
+    "discourse/plugins/discourse-local-dates/initializers/discourse-local-dates"
+  ).applyLocalDates;
+
+  _applyLocalDates(dates, siteSettings);
+}

plugins/discourse-local-dates/assets/javascripts/discourse/components/discourse-local-dates-create-form.js

@@ -13,6 +13,7 @@ import { notEmpty } from "@ember/object/computed";
 import { propertyNotEqual } from "discourse/lib/computed";
 import { schedule } from "@ember/runloop";
 import { getOwner } from "discourse-common/lib/get-owner";
+import { applyLocalDates } from "discourse/lib/local-dates";
 
 export default Component.extend({
   timeFormat: "HH:mm:ss",
@@ -56,19 +57,21 @@ export default Component.extend({
     });
   },
 
-  @observes("markup")
+  @observes("computedConfig.{from,to,options}", "options", "isValid", "isRange")
   _renderPreview() {
     discourseDebounce(
       this,
       function () {
         const markup = this.markup;
-
         if (markup) {
           cookAsync(markup).then((result) => {
             this.set("currentPreview", result);
-            schedule("afterRender", () =>
-              this.$(".preview .discourse-local-date").applyLocalDates()
-            );
+            schedule("afterRender", () => {
+              applyLocalDates(
+                document.querySelectorAll(".preview .discourse-local-date"),
+                this.siteSettings
+              );
+            });
           });
         }
       },
@@ -321,7 +324,6 @@ export default Component.extend({
         text = this._generateDateMarkup(config.from, options, isRange);
       }
     }
-
     return text;
   },
 

plugins/discourse-local-dates/assets/javascripts/initializers/discourse-local-dates.js

@@ -8,6 +8,7 @@ import { downloadCalendar } from "discourse/lib/download-calendar";
 import { renderIcon } from "discourse-common/lib/icon-library";
 import I18n from "I18n";
 
+// Import applyLocalDates from discourse/lib/local-dates instead
 export function applyLocalDates(dates, siteSettings) {
   if (!siteSettings.discourse_local_dates_enabled) {
     return;

plugins/discourse-local-dates/test/javascripts/acceptance/local-dates-composer-test.js

@@ -1,6 +1,11 @@
-import { acceptance, queryAll } from "discourse/tests/helpers/qunit-helpers";
+import {
+  acceptance,
+  query,
+  queryAll,
+} from "discourse/tests/helpers/qunit-helpers";
 import { test } from "qunit";
 import { click, fillIn, visit } from "@ember/test-helpers";
+import selectKit from "discourse/tests/helpers/select-kit-helper";
 
 acceptance("Local Dates - composer", function (needs) {
   needs.user();
@@ -61,4 +66,19 @@ acceptance("Local Dates - composer", function (needs) {
     );
     assert.notOk(getAttr("time"), "it doesn’t have time");
   });
+
+  test("date modal", async function (assert) {
+    await visit("/");
+    await click("#create-topic");
+    await click(".d-editor-button-bar .local-dates");
+
+    const timezoneChooser = selectKit(".timezone-input");
+    await timezoneChooser.expand();
+    await timezoneChooser.selectRowByValue("Asia/Macau");
+
+    assert.ok(
+      query(".preview .discourse-local-date").textContent.includes("Macau"),
+      "it outputs a preview date in selected timezone"
+    );
+  });
 });

plugins/poll/assets/javascripts/widgets/discourse-poll.js

@@ -14,17 +14,15 @@ import { relativeAge } from "discourse/lib/formatter";
 import round from "discourse/lib/round";
 import showModal from "discourse/lib/show-modal";
 import bootbox from "bootbox";
+import { applyLocalDates } from "discourse/lib/local-dates";
 
 const FETCH_VOTERS_COUNT = 25;
 
-function optionHtml(option) {
-  const $node = $(`<span>${option.html}</span>`);
-
-  $node.find(".discourse-local-date").each((_index, elem) => {
-    $(elem).applyLocalDates();
-  });
-
-  return new RawHtml({ html: `<span>${$node.html()}</span>` });
+function optionHtml(option, siteSettings = {}) {
+  const el = document.createElement("span");
+  el.innerHTML = option.html;
+  applyLocalDates(el.querySelectorAll(".discourse-local-date"), siteSettings);
+  return new RawHtml({ html: `<span>${el.innerHTML}</span>` });
 }
 
 function infoTextHtml(text) {
@@ -66,7 +64,7 @@ createWidget("discourse-poll-option", {
     }
 
     contents.push(" ");
-    contents.push(optionHtml(option));
+    contents.push(optionHtml(option, this.siteSettings));
 
     return contents;
   },
@@ -178,7 +176,10 @@ createWidget("discourse-poll-standard-results", {
         contents.push(
           h(
             "div.option",
-            h("p", [h("span.percentage", `${per}%`), optionHtml(option)])
+            h("p", [
+              h("span.percentage", `${per}%`),
+              optionHtml(option, this.siteSettings),
+            ])
           )
         );