client-app/app/controllers/index.js in logster-2.4.0 vs client-app/app/controllers/index.js in logster-2.4.1

@@ -1,18 +1,20 @@
 import Controller from "@ember/controller";
 import { ajax } from "client-app/lib/utilities";
 import { observer, computed } from "@ember/object";
 import Preload from "client-app/lib/preload";
+import { debounce } from "@ember/runloop";
 
 export default Controller.extend({
   showDebug: true,
   showInfo: true,
   showWarn: true,
   showErr: true,
   showFatal: true,
   search: "",
   currentMessage: Em.computed.alias("model.currentMessage"),
+  currentTab: null,
 
   showSettings: computed(function() {
     return Preload.get("patterns_enabled");
   }),
 
@@ -23,10 +25,20 @@
 
   actionsInMenu: computed(function() {
     return this.site.isMobile;
   }),
 
+  fetchEnv() {
+    const message = this.get("currentMessage");
+    if (message) {
+      this.set("loadingEnv", true);
+      return ajax(`/fetch-env/${message.key}.json`)
+        .then(env => message.set("env", env))
+        .always(() => this.set("loadingEnv", false));
+    }
+  },
+
   actions: {
     expandMessage(message) {
       message.expand();
     },
 
@@ -35,13 +47,29 @@
       if (old) {
         old.set("selected", false);
       }
 
       message.set("selected", true);
-      this.set("currentMessage", message);
+      this.setProperties({
+        currentMessage: message,
+        loadingEnv: false
+      });
+      if (!message.env && this.currentTab === "env") {
+        this.fetchEnv();
+      }
     },
 
+    tabChanged(newTab) {
+      this.setProperties({
+        currentTab: newTab,
+        loadingEnv: false
+      });
+      if (newTab === "env" && !this.get("currentMessage.env")) {
+        this.fetchEnv();
+      }
+    },
+
     showMoreBefore() {
       this.get("model").showMoreBefore();
     },
 
     loadMore() {
@@ -107,15 +135,23 @@
     if (filter && this.get("initialized")) {
       model.reload().then(() => this.updateSelectedMessage());
     }
   }),
 
-  searchChanged: observer("search", function() {
-    const search = this.get("search");
+  doSearch(term) {
     const model = this.get("model");
-    model.set("search", search);
+    model.set("search", term);
 
     if (this.get("initialized")) {
       model.reload().then(() => this.updateSelectedMessage());
     }
+  },
+
+  searchChanged: observer("search", function() {
+    const term = this.search;
+    const termSize = term && term.length;
+    if (termSize && termSize === 1) {
+      return;
+    }
+    debounce(this, this.doSearch, term, 250);
   })
 });