discourse-data-explorer/assets/javascripts/discourse/components/share-report.js

import Component from "@ember/component";
import discourseComputed, { on } from "discourse-common/utils/decorators";
import getURL from "discourse-common/lib/get-url";
import { bind } from "@ember/runloop";

export default Component.extend({
  classNames: ["share-report"],

  group: null,
  query: null,
  visible: false,

  @discourseComputed("group", "query")
  link() {
    return getURL(`/g/${this.group}/reports/${this.query.id}`);
  },

  _mouseDownHandler(event) {
    if (!this.element || this.isDestroying || this.isDestroyed) {
      return;
    }
    if ($(this.element).has(event.target).length !== 0) {
      return;
    }

    this.send("close");

    return true;
  },

  _keydownHandler(event) {
    if (!this.element || this.isDestroying || this.isDestroyed) {
      return;
    }

    if (event.keyCode === 27) {
      this.send("close");
    }
  },

  @on("init")
  _setupHandlers() {
    this._boundMouseDownHandler = bind(this, this._mouseDownHandler);
    this._boundKeydownHandler = bind(this, this._keydownHandler);
  },

  didInsertElement() {
    this._super(...arguments);

    $("html")
      .on("mousedown.outside-share-link", this._boundMouseDownHandler)
      .on("keydown.share-view", this._boundKeydownHandler);
  },

  willDestroyElement() {
    this._super(...arguments);

    $("html")
      .off("mousedown.outside-share-link", this._boundMouseDownHandler)
      .off("keydown.share-view", this._boundKeydownHandler);
  },

  actions: {
    open() {
      this.set("visible", true);
      window.setTimeout(
        () => $(this.element).find("input").select().focus(),
        160
      );
    },

    close() {
      this.set("visible", false);
    },
  },
});