feature: add muted count/muting details to incidents page

nerdlets/command-center-v2-nerdlet/open-violations.js

@@ -108,7 +108,9 @@ export default class OpenIncidents extends React.Component {
             'Opened At': moment(formattedTable[k].openTime).format(
               'MM/DD/YYYY, h:mm a'
             ),
-            Muted: formattedTable[k].muted.toString()
+            Muted: formattedTable[k].muted.toString(),
+            MutingRuleId: formattedTable[k].mutingRuleId == null ? null : formattedTable[k].mutingRuleId,
+            MutingRuleName: formattedTable[k].mutingRuleName == null ? null : formattedTable[k].mutingRuleName
           };
           let noteDisplay = null;
           let noteLink = null;
@@ -265,6 +267,12 @@ export default class OpenIncidents extends React.Component {
       case 'Muted':
         translated = 'muted';
         break;
+      case 'MutingRuleId':
+        translated = 'mutingRuleId';
+        break;
+      case 'MutingRuleName':
+        translated = 'mutingRuleName'
+        break;
     }
 
     newTableData = _.orderBy(
@@ -605,6 +613,8 @@ export default class OpenIncidents extends React.Component {
       'Opened At',
       'Duration',
       'Muted',
+      'MutingRuleId',
+      'MutingRuleName',
       'Ack',
       'Close',
       'Links'
@@ -680,6 +690,8 @@ export default class OpenIncidents extends React.Component {
                       : ''}
                   </Table.Cell>
                   <Table.Cell>{row.muted.toString()}</Table.Cell>
+                  <Table.Cell>{row.mutingRuleId == null ? '' : row.mutingRuleId}</Table.Cell>
+                  <Table.Cell>{row.mutingRuleName == null ? '' : row.mutingRuleName}</Table.Cell>
                   <Table.Cell>
                     <Button
                       disabled

nerdlets/command-center-v2-nerdlet/splash.js

@@ -97,11 +97,17 @@ export default class Splash extends React.Component {
               return priorityObj.values[0] == 'HIGH';
             }).length;
 
+            let mutedCount = anAccountsIssues.filter(issue => {
+              let priorityObj = issue.tags.find(k => k.key == 'mutingState');
+              return priorityObj.values[0] == 'FULLY_MUTED';
+            }).length;
+
             let anAccount = {
               account: acct.name,
               id: acct.id,
               high: highCount,
-              critical: criticalCount
+              critical: criticalCount,
+              muted: mutedCount
             };
 
             return anAccount;
@@ -182,7 +188,8 @@ export default class Splash extends React.Component {
       e.target.textContent == 'Critical' ||
       e.target.textContent == 'High' ||
       e.target.textContent == 'Healthy' ||
-      e.target.textContent == 'Anomalies'
+      e.target.textContent == 'Anomalies' ||
+      e.target.textContent == 'Muted'
     ) {
       this.sortByStatus(e.target.textContent);
     }
@@ -212,6 +219,10 @@ export default class Splash extends React.Component {
       );
     }
 
+    if (statusText == 'Muted') {
+      cardsByStatus = _.orderBy(cardsByStatus, ['muted'], ['desc']);
+    }
+
     this.setState({
       cardData: cardsByStatus,
       sortDisplay: statusText
@@ -220,7 +231,7 @@ export default class Splash extends React.Component {
 
   renderSortDropdown() {
     const { sortDisplay } = this.state;
-    const sortItems = ['A-Z', 'Z-A', 'Critical', 'High', 'Anomalies', 'Healthy'];
+    const sortItems = ['A-Z', 'Z-A', 'Critical', 'High', 'Muted', 'Anomalies', 'Healthy'];
 
     return (
       <div className="sortBy">
@@ -321,6 +332,12 @@ export default class Splash extends React.Component {
                         </Statistic.Value>
                         <Statistic.Label>High</Statistic.Label>
                       </Statistic>
+                      <Statistic size="mini" color={this.getCardColor(card)}>
+                        <Statistic.Value>
+                          {card.muted == undefined ? 0 : card.muted}
+                        </Statistic.Value>
+                        <Statistic.Label>Muted</Statistic.Label>
+                      </Statistic>
                       <Statistic size="mini" color={this.getCardColor(card)}>
                         <Statistic.Value>
                           {card.anomalyCount == undefined ? 0 : card.anomalyCount}

nerdlets/command-center-v2-nerdlet/utils.js

@@ -80,7 +80,7 @@ module.exports = {
     {
       actor {
         account(id: ${account}) {
-          nrql(query: "FROM NrAiIncident SELECT incidentId, account.id, title, targetName, policyName, conditionName, openTime, priority, muted, incidentLink, description where incidentId IN (${vios}) and event = 'open' LIMIT MAX ${time}") {
+          nrql(query: "FROM NrAiIncident SELECT incidentId, account.id, title, targetName, policyName, conditionName, openTime, priority, muted, mutingRuleId, mutingRuleName, incidentLink, description where incidentId IN (${vios}) and event = 'open' LIMIT MAX ${time}") {
             results
           }
         }

nr1.json

@@ -1,6 +1,6 @@
 {
   "schemaType": "NERDPACK",
-  "id": "0991a64e-9bca-4586-b4aa-20bd5acf0b2e",
+  "id": "716b6934-d18c-44ec-83a0-e8dd26516534",
   "displayName": "Command Center V2",
   "description": "Consolidated view of incidents, issues and analytics across many accounts"
 }

package.json

@@ -1,7 +1,7 @@
 {
     "private": true,
     "name": "command-center-v2",
-    "version": "2.3.0",
+    "version": "2.4.0",
     "scripts": {
         "start": "nr1 nerdpack:serve",
         "test": "exit 0",