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>