logster 2.11.3 → 2.12.1

data/client-app/app/components/message-info.js

@@ -1,93 +1,94 @@
+import classic from "ember-classic-decorator";
+import { bool } from "@ember/object/computed";
 import Component from "@ember/component";
-import { computed } from "@ember/object";
+import { action, computed } from "@ember/object";
 import Preload from "client-app/lib/preload";
-import { bool } from "@ember/object/computed";
 
-export default Component.extend({
-  showSolveAllButton: bool("currentRow.group"),
+@classic
+export default class MessageInfo extends Component {
+  @bool("currentRow.group") showSolveAllButton;
 
-  buttons: computed("currentMessage.protected", "showSolveButton", function() {
-    const protect = this.get("currentMessage.protected");
+  @computed("currentMessage.protected", "showSolveAllButton", "showSolveButton")
+  get buttons() {
+    const protect = this.currentMessage.protected;
     const buttons = [];
-    const prefix = "fas";
 
     if (!protect && this.showSolveButton) {
       buttons.push({
         klass: "solve",
-        action: "solve",
+        action: this.solve,
         icon: "check-square",
         label: "Solve",
         prefix: "far",
-        danger: true
+        danger: true,
       });
     }
 
     if (this.showSolveAllButton) {
       buttons.push({
         klass: "solve-all",
-        action: "solveAll",
+        action: this.solveAll,
         icon: "check-square",
         label: "Solve All",
         prefix: "far",
-        danger: true
+        danger: true,
       });
     }
 
-    if (!protect) {
+    if (protect) {
+      buttons.push({
+        klass: "unprotect",
+        action: this.unprotect,
+        icon: "unlock",
+        prefix: "fas",
+        label: "Unprotect",
+      });
+    } else {
       buttons.push(
         {
           klass: "remove",
-          action: "remove",
+          action: this.remove,
           icon: "trash-alt",
           label: "Remove",
           prefix: "far",
-          danger: true
+          danger: true,
         },
         {
           klass: "protect",
-          action: "protect",
+          action: this.protect,
           icon: "lock",
-          prefix,
-          label: "Protect"
+          prefix: "fas",
+          label: "Protect",
         }
       );
-    } else {
-      buttons.push({
-        klass: "unprotect",
-        action: "unprotect",
-        icon: "unlock",
-        prefix,
-        label: "Unprotect"
-      });
     }
 
     buttons.push({
       klass: "copy",
-      action: "copyAction",
+      action: this.copy,
       icon: "copy",
       prefix: "far",
-      label: "Copy"
+      label: "Copy",
     });
+
     return buttons;
-  }),
-
-  showSolveButton: computed(
-    "showSolveAllButton",
-    "currentMessage.{canSolve,env}",
-    function() {
-      if (this.showSolveAllButton) return false;
-      // env isn't loaded until you switch to the env tab
-      // so if we don't have env we show the button if
-      // application_version is provided in the config
-      return this.currentMessage.env
-        ? this.currentMessage.canSolve
-        : !!Preload.get("application_version");
+  }
+
+  @computed("showSolveAllButton", "currentMessage.{canSolve,env}")
+  get showSolveButton() {
+    if (this.showSolveAllButton) {
+      return false;
     }
-  ),
+    // env isn't loaded until you switch to the env tab
+    // so if we don't have env we show the button if
+    // application_version is provided in the config
+    return this.currentMessage.env
+      ? this.currentMessage.canSolve
+      : !!Preload.get("application_version");
+  }
 
+  @action
   copy() {
-    const temp = document.createElement("TEXTAREA");
-    document.body.appendChild(temp);
     const header = this.currentMessage.showCount
       ? `Message (${this.currentMessage.count} copies reported)`
       : "Message";
@@ -100,52 +101,54 @@ export default Component.extend({
 
     const httpHosts = Array.isArray(this.currentMessage.env)
       ? this.currentMessage.env
-          .map(e => e["HTTP_HOST"])
+          .map((e) => e["HTTP_HOST"])
           .filter((e, i, a) => e && a.indexOf(e) === i)
           .join(", ")
       : this.currentMessage.env["HTTP_HOST"];
 
     const env = httpHosts ? `Env\n\nHTTP HOSTS: ${httpHosts}` : "";
-    const lines = [message, backtrace, env].filter(l => l).join("\n\n");
+    const lines = [message, backtrace, env].filter((l) => l).join("\n\n");
+
+    const temp = document.createElement("TEXTAREA");
+    document.body.appendChild(temp);
     temp.value = lines;
     temp.select();
     document.execCommand("copy");
     document.body.removeChild(temp);
-  },
-
-  actions: {
-    tabChanged(newTab) {
-      if (this.onTabChange) {
-        this.onTabChange(newTab);
-      }
-    },
+  }
 
-    protect() {
-      this.currentMessage.protect();
-    },
+  @action
+  tabChanged(newTab) {
+    this.onTabChange?.(newTab);
+  }
 
-    unprotect() {
-      this.currentMessage.unprotect();
-    },
+  @action
+  protect() {
+    this.currentMessage.protect();
+  }
 
-    remove() {
-      this.removeMessage(this.currentMessage);
-    },
+  @action
+  unprotect() {
+    this.currentMessage.unprotect();
+  }
 
-    solve() {
-      this.solveMessage(this.currentMessage);
-    },
+  @action
+  remove() {
+    this.removeMessage(this.currentMessage);
+  }
 
-    solveAll() {
-      this.currentRow.solveAll();
-    },
+  @action
+  solve() {
+    this.solveMessage(this.currentMessage);
+  }
 
-    share() {
-      window.location.pathname = this.get("currentMessage.shareUrl");
-    },
+  @action
+  solveAll() {
+    this.currentRow.solveAll();
+  }
 
-    copyAction() {
-      this.copy();
-    }
+  @action
+  share() {
+    window.location.pathname = this.currentMessage.shareUrl;
   }
-});
+}

data/client-app/app/components/message-row.js

@@ -1,37 +1,36 @@
+import classic from "ember-classic-decorator";
+import { classNameBindings, tagName } from "@ember-decorators/component";
 import Component from "@ember/component";
 
 let CHECKED_BOTTOM;
 let STICK_TO_BOTTOM;
 
-export default Component.extend({
-  tagName: "div",
-
-  classNameBindings: [
-    "model.rowClass",
-    ":message-row",
-    "model.selected:selected"
-  ],
-
-  click() {
-    this.selectRow();
-  },
-
+@classic
+@tagName("div")
+@classNameBindings("model.rowClass", ":message-row", "model.selected:selected")
+export default class MessageRow extends Component {
   willInsertElement() {
+    super.willInsertElement(...arguments);
     if (CHECKED_BOTTOM) {
       return;
     }
 
     const topPanel = document.getElementById("top-panel");
-    if (!topPanel) return;
+    if (!topPanel) {
+      return;
+    }
 
     const height = parseFloat(getComputedStyle(topPanel).height);
     STICK_TO_BOTTOM = topPanel.scrollHeight - 20 < height + topPanel.scrollTop;
     CHECKED_BOTTOM = true;
-  },
+  }
 
   didInsertElement() {
+    super.didInsertElement(...arguments);
     const topPanel = document.getElementById("top-panel");
-    if (!topPanel) return;
+    if (!topPanel) {
+      return;
+    }
 
     CHECKED_BOTTOM = false;
     if (STICK_TO_BOTTOM) {
@@ -40,4 +39,8 @@ export default Component.extend({
         topPanel.scrollHeight - parseFloat(getComputedStyle(topPanel).height);
     }
   }
-});
+
+  click() {
+    this.selectRow();
+  }
+}

data/client-app/app/components/page-nav.js

@@ -1,33 +1,42 @@
-import Component from "@ember/component";
-import { computed } from "@ember/object";
+import classic from "ember-classic-decorator";
+import { classNameBindings, classNames } from "@ember-decorators/component";
 import { equal } from "@ember/object/computed";
+import Component from "@ember/component";
+import { action, computed } from "@ember/object";
 
-export default Component.extend({
-  classNames: ["nav-controls"],
-  classNameBindings: ["extraClasses"],
-  disableBackButtons: equal("position", 0),
+@classic
+@classNames("nav-controls")
+@classNameBindings("extraClasses")
+export default class PageNav extends Component {
+  @equal("position", 0) disableBackButtons;
 
-  disableForwardButtons: computed("position", "list.length", function() {
-    return this.position === this.get("list.length") - 1;
-  }),
+  @computed("position", "list.length")
+  get disableForwardButtons() {
+    return this.position === this.list.length - 1;
+  }
 
-  displayNumber: computed("position", function() {
+  @computed("position")
+  get displayNumber() {
     return this.position + 1;
-  }),
+  }
 
-  actions: {
-    takeStep(dir) {
-      const amount = dir === "back" ? -1 : 1;
-      if (amount === 1 && this.disableForwardButtons) return;
-      if (amount === -1 && this.disableBackButtons) return;
+  @action
+  takeStep(dir) {
+    const amount = dir === "back" ? -1 : 1;
+    if (amount === 1 && this.disableForwardButtons) {
+      return;
+    }
+    if (amount === -1 && this.disableBackButtons) {
+      return;
+    }
 
-      const newPos = this.position + amount;
-      this.navigate(newPos);
-    },
+    const newPos = this.position + amount;
+    this.navigate(newPos);
+  }
 
-    bigJump(dir) {
-      const newPos = dir === "back" ? 0 : this.get("list.length") - 1;
-      this.navigate(newPos);
-    }
+  @action
+  bigJump(dir) {
+    const newPos = dir === "back" ? 0 : this.list.length - 1;
+    this.navigate(newPos);
   }
-});
+}

data/client-app/app/components/panel-resizer.js

@@ -1,3 +1,6 @@
+import classic from "ember-classic-decorator";
+import { classNames } from "@ember-decorators/component";
+import { inject as service } from "@ember/service";
 import Component from "@ember/component";
 import { scheduleOnce, throttle } from "@ember/runloop";
 import { bound } from "client-app/lib/decorators";
@@ -6,9 +9,35 @@ const MOVE_EVENTS = ["touchmove", "mousemove"];
 const UP_EVENTS = ["touchend", "mouseup"];
 const DOWN_EVENTS = ["touchstart", "mousedown"];
 
-export default Component.extend({
-  resizing: false,
-  classNames: ["divider"],
+@classic
+@classNames("divider")
+export default class PanelResizer extends Component {
+  @service events;
+
+  resizing = false;
+
+  didInsertElement() {
+    super.didInsertElement(...arguments);
+    // inspired by http://plugins.jquery.com/misc/textarea.js
+    this.set("divider", document.querySelector(".divider"));
+    for (const name of DOWN_EVENTS) {
+      this.divider.addEventListener(name, this.dividerClickHandler);
+    }
+    scheduleOnce("afterRender", this, "initialDivideView");
+  }
+
+  willDestroyElement() {
+    super.willDestroyElement(...arguments);
+    for (const name of DOWN_EVENTS) {
+      this.divider.removeEventListener(name, this.dividerClickHandler);
+    }
+  }
+
+  initialDivideView() {
+    const amount = (localStorage && localStorage.logster_divider_bottom) || 300;
+    const fromTop = window.innerHeight - parseInt(amount, 10);
+    this.divideView(fromTop);
+  }
 
   divideView(fromTop) {
     const height = window.innerHeight;
@@ -20,12 +49,12 @@ export default Component.extend({
 
     this.divider.style.bottom = `${fromBottom - 5}px`;
     this.events.trigger("panelResized", fromBottom);
-  },
+  }
 
   @bound
   performDrag(e) {
     throttle(this, this.throttledPerformDrag, e, 25);
-  },
+  }
 
   throttledPerformDrag(e) {
     if (this.resizing) {
@@ -33,14 +62,15 @@ export default Component.extend({
         e.clientY || (e.touches && e.touches[0] && e.touches[0].clientY)
       );
     }
-  },
+  }
 
   @bound
-  endDrag(/* e */) {
+  endDrag /* e */() {
     const overlay = document.getElementById("overlay");
     if (overlay) {
       overlay.parentElement.removeChild(overlay);
     }
+
     this.set("resizing", false);
 
     if (localStorage) {
@@ -50,43 +80,29 @@ export default Component.extend({
       );
     }
 
-    MOVE_EVENTS.forEach(name =>
-      document.removeEventListener(name, this.performDrag)
-    );
-    UP_EVENTS.forEach(name => document.removeEventListener(name, this.endDrag));
-  },
+    for (const name of MOVE_EVENTS) {
+      document.removeEventListener(name, this.performDrag);
+    }
+    for (const name of UP_EVENTS) {
+      document.removeEventListener(name, this.endDrag);
+    }
+  }
 
   @bound
   dividerClickHandler(e) {
     e.preventDefault(); // for disabling pull-down-to-refresh on mobile
+
     const overlay = document.createElement("DIV");
     overlay.id = "overlay";
     document.body.appendChild(overlay);
-    this.set("resizing", true);
-    MOVE_EVENTS.forEach(name =>
-      document.addEventListener(name, this.performDrag)
-    );
-    UP_EVENTS.forEach(name => document.addEventListener(name, this.endDrag));
-  },
 
-  didInsertElement() {
-    // inspired by http://plugins.jquery.com/misc/textarea.js
-    this.set("divider", document.querySelector(".divider"));
-    DOWN_EVENTS.forEach(name => {
-      this.divider.addEventListener(name, this.dividerClickHandler);
-    });
-    scheduleOnce("afterRender", this, "initialDivideView");
-  },
-
-  initialDivideView() {
-    const amount = (localStorage && localStorage.logster_divider_bottom) || 300;
-    const fromTop = window.innerHeight - parseInt(amount, 10);
-    this.divideView(fromTop);
-  },
+    this.set("resizing", true);
 
-  willDestroyElement() {
-    DOWN_EVENTS.forEach(name =>
-      this.divider.removeEventListener(name, this.dividerClickHandler)
-    );
+    for (const name of MOVE_EVENTS) {
+      document.addEventListener(name, this.performDrag);
+    }
+    for (const name of UP_EVENTS) {
+      document.addEventListener(name, this.endDrag);
+    }
   }
-});
+}