add support for parameter 'state_compress_ids'

saltgui/static/scripts/output/Output.js

@@ -485,6 +485,11 @@ export class Output {
       summarySpan.append(span);
     }
 
+    const stateCompressIds = Utils.getStorageItem("session", "state_compress_ids", "false");
+    if (stateCompressIds === "true") {
+      summarySpan.append(Utils.createSpan("state-details-compressed", Character.NO_BREAK_SPACE + "(state details may be compressed)"));
+    }
+
     pMinionRow.append(summarySpan);
   }
 

saltgui/static/scripts/output/OutputHighstate.js

@@ -65,6 +65,34 @@ export class OutputHighstate {
 
     const div = Utils.createDiv();
 
+    // collapse states when requested
+    const stateCompressIds = Utils.getStorageItem("session", "state_compress_ids", "false");
+    let tasks = pTasks;
+    if (stateCompressIds === "true") {
+      tasks = {};
+      for (const task of pTasks) {
+        // group by this key
+        const key = task.__id__ + "-" + task.result;
+        if (key in tasks) {
+          // not first time we see this entry, adjust some properties
+          tasks[key].cnt += 1;
+          // sum() of duration
+          if (task.duration) {
+            tasks[key].duration += task.duration;
+          }
+          // min() of start_time
+          if (task["start_time"]) {
+            tasks[key]["start_time"] = Math.min(tasks[key]["start_time"], task["start_time"]);
+          }
+        } else {
+          // first time we see an entry, use all details and start counting at 1
+          tasks[key] = task;
+          tasks[key].cnt = 1;
+        }
+      }
+      tasks = Object.keys(tasks).map((key) => tasks[key]);
+    }
+
     let succeeded = 0;
     let failed = 0;
     let skipped = 0;
@@ -73,7 +101,7 @@ export class OutputHighstate {
     let changesDetail = 0;
     let hidden = 0;
     let nr = 0;
-    for (const task of pTasks) {
+    for (const task of tasks) {
 
       nr += 1;
 
@@ -118,6 +146,10 @@ export class OutputHighstate {
       if (Output.isStateOutputSelected("_id")) {
         taskName = taskId;
       }
+      // might be a grouped entry, then show the count
+      if (task.cnt) {
+        taskName += " (" + task.cnt + ")";
+      }
 
       let taskSpan;
       if (Output.isStateOutputSelected("terse")) {

saltgui/static/scripts/panels/Login.js

@@ -381,6 +381,9 @@ export class LoginPanel extends Panel {
     const stateVerbose = wheelConfigValuesData.saltgui_state_verbose;
     Utils.setStorageItem("session", "state_verbose", JSON.stringify(stateVerbose));
 
+    const stateCompressIds = wheelConfigValuesData.state_compress_ids;
+    Utils.setStorageItem("session", "state_compress_ids", stateCompressIds);
+
     const stateOutput = wheelConfigValuesData.saltgui_state_output;
     Utils.setStorageItem("session", "state_output", stateOutput);
 

saltgui/static/scripts/panels/Options.js

@@ -30,6 +30,10 @@ export class OptionsPanel extends Panel {
       ["expire", "session"],
       ["perms", "session"],
       ["nodegroups", null, "(none)"],
+      [
+        "state-compress-ids", null, "false",
+        [["compress-ids", "true", "false"]]
+      ],
       [
         "state-output", null, "full",
         [["output", "full", "terse", "mixed", "changes", "full_id", "terse_id", "mixed_id", "changes_id"]]
@@ -130,6 +134,10 @@ export class OptionsPanel extends Panel {
             radio.addEventListener("change", () => {
               this._newStateVerbose();
             });
+          } else if (pName === "state-compress-ids") {
+            radio.addEventListener("change", () => {
+              this._newStateCompressIds();
+            });
           } else if (pName === "state-output") {
             radio.addEventListener("change", () => {
               this._newStateOutput();
@@ -368,6 +376,17 @@ export class OptionsPanel extends Panel {
     Utils.setStorageItem("session", "state_verbose", value);
   }
 
+  _newStateCompressIds () {
+    let value = "";
+    /* eslint-disable curly */
+    if (this._isSelected("state-compress-ids", "compress-ids", "false")) value = "false";
+    if (this._isSelected("state-compress-ids", "compress-ids", "true")) value = "true";
+    /* eslint-enable curly */
+    const stateCompressIdsTd = this.div.querySelector("#option-state-compress-ids-value");
+    stateCompressIdsTd.innerText = value;
+    Utils.setStorageItem("session", "state_compress_ids", value);
+  }
+
   _newStateOutput () {
     let value = "";
     /* eslint-disable curly */

saltgui/static/stylesheets/main.css

@@ -286,3 +286,7 @@ pre.output {
   color: #4caf50;
   cursor: pointer;
 }
+
+.state-details-compressed {
+  color: gray;
+}