DEV: Upgrade admin-plugins-explorer to Octane (#209)

- Drop `explorer-container` and move its logic to `admin-plugin-explorer` container
- Convert resizing of the query edit pane from jquery -> draggable modifier

assets/javascripts/discourse/components/code-view.hbs

@@ -0,0 +1 @@
+<pre><code class={{@codeClass}}>{{@value}}</code></pre>

assets/javascripts/discourse/components/explorer-container.js

@@ -1,96 +0,0 @@
-import Component from "@ember/component";
-import { observes } from "discourse-common/utils/decorators";
-import { schedule, throttle } from "@ember/runloop";
-
-export default Component.extend({
-  @observes("hideSchema")
-  _onHideSchema() {
-    this.appEvents.trigger("ace:resize");
-  },
-
-  @observes("everEditing")
-  _onInsertEditor() {
-    schedule("afterRender", this, () => this._bindControls());
-  },
-
-  _bindControls() {
-    if (this._state !== "inDOM") {
-      return;
-    }
-    const $editPane = $(".query-editor");
-    if (!$editPane.length) {
-      return;
-    }
-
-    const oldGrippie = this.grippie;
-    if (oldGrippie) {
-      oldGrippie.off("mousedown mousemove mouseup");
-    }
-
-    const $grippie = $editPane.find(".grippie");
-    const $target = $editPane.find(".panels-flex");
-    const $document = $(document);
-
-    const minWidth = $target.width();
-    const minHeight = $target.height();
-
-    this.set("grippie", $grippie);
-
-    const mousemove = (e) => {
-      const diffY = this.startY - e.screenY;
-      const diffX = this.startX - e.screenX;
-
-      const newHeight = Math.max(minHeight, this.startHeight - diffY);
-      const newWidth = Math.max(minWidth, this.startWidth - diffX);
-
-      $target.height(newHeight);
-      $target.width(newWidth);
-      $grippie.width(newWidth);
-      this.appEvents.trigger("ace:resize");
-    };
-
-    const throttledMousemove = ((event) => {
-      event.preventDefault();
-      throttle(this, mousemove, event, 20);
-    }).bind(this);
-
-    const mouseup = (() => {
-      $document.off("mousemove", throttledMousemove);
-      $document.off("mouseup", mouseup);
-      this.setProperties({
-        startY: null,
-        startX: null,
-        startHeight: null,
-        startWidth: null,
-      });
-    }).bind(this);
-
-    $grippie.on("mousedown", (e) => {
-      this.setProperties({
-        startY: e.screenY,
-        startX: e.screenX,
-        startHeight: $target.height(),
-        startWidth: $target.width(),
-      });
-
-      $document.on("mousemove", throttledMousemove);
-      $document.on("mouseup", mouseup);
-      e.preventDefault();
-    });
-  },
-
-  didInsertElement() {
-    this._super(...arguments);
-
-    this._bindControls();
-  },
-
-  willDestroyElement() {
-    this._super(...arguments);
-
-    if (this.everEditing) {
-      this.grippie && this.grippie.off("mousedown");
-      this.set("grippie", null);
-    }
-  },
-});

assets/javascripts/discourse/models/query.js

@@ -7,16 +7,9 @@ import RestModel from "discourse/models/rest";
 import { reads } from "@ember/object/computed";
 
 const Query = RestModel.extend({
-  dirty: false,
   params: {},
   results: null,
-
-  @on("init")
-  _init() {
-    this._super(...arguments);
-
-    this.set("dirty", false);
-  },
+  hasParams: reads("param_info.length"),
 
   @on("init")
   @observes("param_info")
@@ -24,17 +17,6 @@ const Query = RestModel.extend({
     this.resetParams();
   },
 
-  @observes("name", "description", "sql", "group_ids")
-  markDirty() {
-    this.set("dirty", true);
-  },
-
-  markNotDirty() {
-    this.set("dirty", false);
-  },
-
-  hasParams: reads("param_info.length"),
-
   resetParams() {
     const newParams = {};
     const oldParams = this.params;

assets/javascripts/discourse/routes/admin-plugins-explorer.js

@@ -25,7 +25,6 @@ export default DiscourseRoute.extend({
       return schemaPromise.then((schema) => {
         return queryPromise.then((model) => {
           model.forEach((query) => {
-            query.markNotDirty();
             query.set(
               "group_names",
               (query.group_ids || []).map((id) => groupNames[id])

assets/javascripts/discourse/templates/components/hljs-code-view.hbs

@@ -1 +0,0 @@
-<pre><code class={{codeClass}}>{{value}}</code></pre>

assets/javascripts/discourse/templates/modal/query-help.hbs

@@ -1,6 +1,6 @@
-{{#d-modal-body title="explorer.help.modal_title"}}
+<DModalBody @title="explorer.help.modal_title">
   {{html-safe (i18n "explorer.help.auto_resolution")}}
   {{html-safe (i18n "explorer.help.custom_params")}}
   {{html-safe (i18n "explorer.help.default_values")}}
   {{html-safe (i18n "explorer.help.data_types")}}
-{{/d-modal-body}}
+</DModalBody>

config/locales/client.ar.yml

@@ -22,7 +22,7 @@ ar:
         label: "استيراد"
         modal: "استيراد استعلام"
         unparseable_json: "ملف JSON غير قابل للتحليل"
-        wrong_json: "ملف JSON خاطئ. يجب أن يحتوي ملف JSON على كائن \"استعلام\"، والذي يجب أن يحتوي على الأقل على خاصية \"sql\"."
+        wrong_json: 'ملف JSON خاطئ. يجب أن يحتوي ملف JSON على كائن "استعلام"، والذي يجب أن يحتوي على الأقل على خاصية "sql".'
       help:
         label: "المساعدة"
         modal_title: "مساعدة مستكشف البيانات"

config/locales/client.it.yml

@@ -22,7 +22,7 @@ it:
         label: "Importa"
         modal: "Importa una query"
         unparseable_json: "File JSON non analizzabile."
-        wrong_json: "File JSON errato. Un file JSON dovrebbe contenere un oggetto \"query\" contenente almeno una proprietà \"sql\"."
+        wrong_json: 'File JSON errato. Un file JSON dovrebbe contenere un oggetto "query" contenente almeno una proprietà "sql".'
       help:
         label: "Guida"
         modal_title: "Guida di Data Explorer"

config/locales/client.pt_BR.yml

@@ -22,7 +22,7 @@ pt_BR:
         label: "Importar"
         modal: "Importar Uma Consulta"
         unparseable_json: "Arquivo JSON não analisável"
-        wrong_json: "Arquivo JSON incorreto. Um arquivo JSON deve conter um objeto \"consulta\", que deve ter pelo menos a propriedade \"sql\""
+        wrong_json: 'Arquivo JSON incorreto. Um arquivo JSON deve conter um objeto "consulta", que deve ter pelo menos a propriedade "sql"'
       help:
         label: "Ajuda"
         modal_title: "Ajuda do Explorador de Dados"

config/locales/server.hr.yml

@@ -6,4 +6,4 @@
 
 hr:
   site_settings:
-    data_explorer_enabled: "Uključi \"Data Explorer\" na /admin/plugins/explorer"
+    data_explorer_enabled: 'Uključi "Data Explorer" na /admin/plugins/explorer'

config/locales/server.pt.yml

@@ -6,4 +6,4 @@
 
 pt:
   site_settings:
-    data_explorer_enabled: "Ativar o «Explorador de Dados» em \"/admin/plugins/explorer\""
+    data_explorer_enabled: 'Ativar o «Explorador de Dados» em "/admin/plugins/explorer"'

config/locales/server.sk.yml

@@ -6,4 +6,4 @@
 
 sk:
   site_settings:
-    data_explorer_enabled: "Povoľ \"Data explorer\" v /admin/plugins/explorer"
+    data_explorer_enabled: 'Povoľ "Data explorer" v /admin/plugins/explorer'

translator.yml

@@ -1,7 +1,7 @@
 # Configuration file for discourse-translator-bot
 
 files:
-- source_path: config/locales/client.en.yml
-  destination_path: client.yml
-- source_path: config/locales/server.en.yml
-  destination_path: server.yml
+  - source_path: config/locales/client.en.yml
+    destination_path: client.yml
+  - source_path: config/locales/server.en.yml
+    destination_path: server.yml