Merge branch 'develop' into feature/#204-consolidate-search-and-multi…

…select

CHANGELOG.md

@@ -1,13 +1,27 @@
 # v4.4 - 9 June 2021
+## New Features
 - Added combined techniques search and multiselect feature in sidebar. See issue [#204](https://github.com/mitre-attack/attack-navigator/issues/204). 
 
-# v4.3 - 26 February 2021
+# v4.3 - 29 April 2021
+## New Features
+- Added aggregate scores. Aggregate scores are computed using the score of the technique and all sub-techniques using an "aggregate function" -- min, max, average, or sum. The aggregate score is used to determine the color of the technique in place of the technique's score. Aggregate scores are an optional feature and can be enabled in the "matrix configuration" dropdown. See issue [#269](https://github.com/mitre-attack/attack-navigator/issues/269).
+- The user can now suppress the "leave site?" warning dialog in the config file or via the "create a customized navigator" interface. See issue [#267](https://github.com/mitre-attack/attack-navigator/issues/267).
+- Added an (optional) configurable banner. The new "banner" field of the config file can be used to customize the banner content with full HTML support. See issue [#205](https://github.com/mitre-attack/attack-navigator/issues/205). 
+- Added button to toolbar to only expand all sub-techniques that are annotated. See issue [#256](https://github.com/mitre-attack/attack-navigator/issues/256).
+- Added support for displaying STIX 2.1 notes in tooltips. Notes attached to techniques in the STIX data are indicated in the same style as a comment. As of version 4.3 the ATT&CK Navigator supports STIX 2.1, but cannot load data from a TAXII 2.1 server.
 
-- Added aggregate score that displays the combined score of the technique and all of its sub-techniques. See issue [#269](https://github.com/mitre-attack/attack-navigator/issues/269).
-- Added support for displaying notes in tooltips. Notes on a technique are indicated in the same style as a comment.
-- Fixed a bug in exporting matrix to Excel sheet, where the style of all sub-techniques with the same name in a column were incorrectly over-ridden by the style of the first sub-technique in its name. See issue [#270](https://github.com/mitre-attack/attack-navigator/issues/270).
+## Improvements
 - Consolidated AWS, GCP, and Azure platforms into IaaS platform to integrate upcoming release of ATT&CK. See issue [#252](https://github.com/mitre-attack/attack-navigator/issues/252).
-- Added feature to disable leave site dialog. See issue [#267](https://github.com/mitre-attack/attack-navigator/issues/267).
+
+## Fixes
+- Fixed a bug in exporting matrix to Excel sheet, where the style of all sub-techniques with the same name in a column were incorrectly over-ridden by the style of the first sub-technique in its name. See issue [#270](https://github.com/mitre-attack/attack-navigator/issues/270).
+## Layer File Format Changes
+Layer file format updated to version 4.2. This update is fully backwards compatible with the layer format v4.1 since the added fields are optional. See [layers/LAYERFORMATv4_2.md](layers/LAYERFORMATv4_2.md) for the full specification.
+
+This update adds settings for aggregate scores to the layout object of the layer:
+- `showAggregateScores`, which turns on the feature
+- `countUnscored` which counts unscored techniques as if their score was `0` when the aggregate function is "average".
+- `aggregateFunction`: the desired aggregation function: "average", "min", "max" or "sum".
 
 # v4.2 - 3 February 2021
 

README.md

@@ -169,6 +169,9 @@ Local files to load should be placed in the `nav-app/src/assets/` directory.
 
 Default layers from the web can also be set using a query string in the Navigator URL. Refer to the in-application help page section "Customizing the Navigator" for more details.
 
+## Enabling Banner in Navigator
+The `banner` setting in `nav-app/src/assets/config.json` by default is an empty string `"""` (and not visible), and can be set to whatever content you wish to display inside a banner at the top of the Navigator webpage. The banner supports HTML and hyperlinks in the content.
+
 ## Disabling Navigator Features
 The `features` array in `nav-app/src/assets/config.json` lists Navigator features you may want to disable. Setting the `enabled` field on a feature in the configuration file will hide all control
 elements related to that feature.

layers/LAYERFORMATv4_2.md

@@ -1,4 +1,4 @@
-# ATT&CK<sup>TM</sup> Navigator Layer File Format Definition
+# ATT&CK® Navigator Layer File Format Definition
 This document describes **Version 4.2** of the MITRE ATT&CK Navigator Layer file format. The ATT&CK Navigator stores layers as JSON, therefore this document defines the JSON properties in a layer file.
 
 ## Property Table
@@ -27,7 +27,7 @@ This document describes **Version 4.2** of the MITRE ATT&CK Navigator Layer file
 
 | Name     | Type     | Required? | Default Value (if not present) | Description |
 | :------------- | :------------- | :------------- | :------------- | :------------- |
-| platforms | Array of String | No | all platforms within domain | Specifies the platforms within the technology domain – only those techniques tagged with these platforms are to be displayed. Valid values are as follows: <br>**domain=enterprise-attack**: "PRE", "Windows", "Linux", "macOS", "Network", "AWS", "GCP", "Azure", "Azure AD", "Office 365", "SaaS" <br>**domain=mobile-attack**: "Android", "iOS". <br>**domain=ics-attack**: "Windows", "Control Server", "Data Historian", "Engineering Workstation", "Field Controller/RTU/PLC/IED", "Human-Machine Interface", "Input/Output Server", "Safety Instrumented System/Protection Relay" |
+| platforms | Array of String | No | all platforms within domain | Specifies the platforms within the technology domain - only those techniques tagged with these platforms are to be displayed. Valid values are as follows: <br>**domain=enterprise-attack**: "PRE", "Windows", "Linux", "macOS", "Network", "AWS", "GCP", "Azure", "Azure AD", "Office 365", "SaaS" <br>**domain=mobile-attack**: "Android", "iOS". <br>**domain=ics-attack**: "Windows", "Control Server", "Data Historian", "Engineering Workstation", "Field Controller/RTU/PLC/IED", "Human-Machine Interface", "Input/Output Server", "Safety Instrumented System/Protection Relay" |
 
 ## Version Object Properties
 
@@ -48,9 +48,9 @@ Technique objects are used to store both techniques and subtechniques. The only
 | comment | String | No | "" | Free-text field |
 | enabled | Boolean | No | true | Specifies if the technique is considered enabled or disabled in this layer |
 | score | Number | No | (unscored) | Optional numeric score assigned to this technique in the layer. If omitted, the technique is considered to be "unscored" meaning that it will not be assigned a color from the gradient by the Navigator |
-| color | String | No | "" | Explicit color value assigned to the technique in this layer. Note that explicitly defined color overrides any color implied by the score – the Navigator will display the technique using the explicitly defined color |
+| color | String | No | "" | Explicit color value assigned to the technique in this layer. Note that explicitly defined color overrides any color implied by the score - the Navigator will display the technique using the explicitly defined color |
 | metadata | Array of Metadata objects and Metadata Separator objects | No | | User defined metadata for this technique. See definition of Metadata object and Metadata Separator object below |
-| showSubtechniques | boolean | No | false | if true, the sub-techniques under this technique will be shown by default. This field is only valid under a technique with subtechniques. Note that subtechniques can still be shown/hidden using the UI controls — this field is simply the default state. |
+| showSubtechniques | boolean | No | false | if true, the sub-techniques under this technique will be shown by default. This field is only valid under a technique with subtechniques. Note that subtechniques can still be shown/hidden using the UI controls - this field is simply the default state. |
 
 ## Gradient Object properties
 | Name     | Type     | Required? | Default Value (if not present) | Description |

nav-app/src/app/config.service.ts

@@ -6,6 +6,7 @@ import { DataService, Technique, Tactic } from './data.service'; //import the Da
 })
 export class ConfigService {
     public comment_color = "yellow";
+    public banner: string;
     private features = new Map<string, boolean>();
     private featureGroups = new Map<string, string[]>();
     private featureStructure: object[];
@@ -34,6 +35,7 @@ export class ConfigService {
                 dataService.subtechniquesEnabled = self.getFeature("subtechniques");
                 self.featureStructure = config["features"];
                 self.comment_color = config["comment_color"];
+                self.banner = config["banner"];
                 for (let obj of config["custom_context_menu_items"]) {
                     self.contextMenuItems.push(new ContextMenuItem(obj.label, obj.url, obj.subtechnique_url))
                 }

nav-app/src/app/datatable/data-table.component.html

@@ -318,6 +318,16 @@
                  </div>
              </div>
 
+            <!-- expand only annotated sub-techniques -->
+            <div *ngIf="configService.getFeature('subtechniques')" class="control-row-item">
+                <div class="control-row-button noselect"
+                     (click)="expandSubtechniques(true)"
+                     matTooltipPosition="below"
+                     matTooltip="expand annotated sub-techniques">
+                     <img [src]="viewModel.layout.layout == 'mini' ? 'assets/icons/unfold_more_alt_gray_24px.svg' : 'assets/icons/unfold_more_alt_black_24px.svg'" alt="expand annotated sub-techniques"/>
+                 </div>
+             </div>
+
             <!-- collapse all sub-techniques -->
             <div *ngIf="configService.getFeature('subtechniques')" class="control-row-item">
                 <div class="control-row-button noselect"

nav-app/src/app/datatable/data-table.component.ts

@@ -284,13 +284,22 @@ export class DataTableComponent implements AfterViewInit {
     /**
      * Show all sub-techniques in layout view
      */
-    expandSubtechniques(): void {
+    expandSubtechniques(showAnnotatedOnly?: boolean): void {
         if (this.viewModel.layout.layout == "mini") return; //control disabled in mini layout
         for (let technique of this.dataService.getDomain(this.viewModel.domainID).techniques) {
             if (technique.subtechniques.length > 0) {
                 for (let id of technique.get_all_technique_tactic_ids()) {
                     let tvm = this.viewModel.getTechniqueVM_id(id);
-                    tvm.showSubtechniques = true;
+                    if (!showAnnotatedOnly) {
+                        tvm.showSubtechniques = true;
+                    } else {
+                        for (let subtechnique of technique.subtechniques) {
+                            tvm.showSubtechniques = tvm.showSubtechniques || subtechnique.get_all_technique_tactic_ids().some((sid) => {
+                                let svm = this.viewModel.getTechniqueVM_id(sid);
+                                return svm.annotated();
+                            })
+                        }
+                    }
                 }
             }
         }
@@ -354,4 +363,4 @@ export class DataTableComponent implements AfterViewInit {
     exportRender(): void {
         this.tabs.openSVGDialog(this.viewModel);
     }
-}
+}

nav-app/src/app/help/help.component.html

@@ -409,11 +409,15 @@ <h2 id="help_Show_Hide_Subtechniques">
             </p>
             <ul>
                 <li>
-                    <img src="assets/icons/unfold_more_black_24px.svg">
+                    <img alt="expand icon" src="assets/icons/unfold_more_black_24px.svg">
                     All sub-techniques can be shown by clicking the "expand sub-techniques" button.
                 </li>
                 <li>
-                    <img src="assets/icons/unfold_less_black_24px.svg">
+                    <img alt="expand annotated icon" src="assets/icons/unfold_more_alt_black_24px.svg">
+                    All annotated sub-techniques can be shown by clicking the "expand annotated sub-techniques" button.
+                </li>
+                <li>
+                    <img alt="collapse icon" src="assets/icons/unfold_less_black_24px.svg">
                     All sub-techniques can be hidden by clicking the "collapse sub-techniques" button.
                 </li>
             </ul>

nav-app/src/app/tabs/tabs.component.html

@@ -1,7 +1,22 @@
 <link href="https://fonts.googleapis.com/css?family=Roboto+Mono:500" rel="stylesheet">
 
+<!-- Banner -->
+<div *ngIf="hasFeature('header') && bannerContent" class="header">
+    <div class="banner">
+        <span class="bannerContent" role="alert" [innerHTML]="bannerContent"></span>
+        <div [style.margin-bottom]="hasFeature('tabs') ? '0px' : '15px'" class="bannerLinks">
+            <div>
+                <a href="http://attack.mitre.org">MITRE ATT&CK&reg; Navigator</a>
+            </div>
+            <div *ngIf="hasFeature('tabs')" class="helpIcon" matTooltip="help" (click)="openHelpDialog()">
+                <svg xmlns="http://www.w3.org/2000/svg" height="18px" viewBox="0 0 24 24" width="18px" fill="#FFFFFF"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M11 18h2v-2h-2v2zm1-16C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-2.21 0-4 1.79-4 4h2c0-1.1.9-2 2-2s2 .9 2 2c0 2-3 1.75-3 5h2c0-2.25 3-2.5 3-5 0-2.21-1.79-4-4-4z"/></svg>
+            </div>
+        </div>
+    </div>
+</div>
+
 <!-- Header/Help -->
-<div *ngIf="hasFeature('header')" [style.margin-bottom]="hasFeature('tabs') ? '0px' : '15px'" class="header" >
+<div *ngIf="hasFeature('header') && !bannerContent" [style.margin-bottom]="hasFeature('tabs') ? '0px' : '15px'" class="header" >
     <div class="logo">
         <a href="http://attack.mitre.org">MITRE ATT&CK&reg; Navigator</a>
     </div>

nav-app/src/app/tabs/tabs.component.scss

@@ -188,6 +188,44 @@ input[type=file]{
         height: 2ex;
         padding: 5px;
     }
+
+    .banner {
+        background-color: color(primary);
+        margin: 7px 0;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 5px 15px;
+        border-radius: 5px;
+        text-align: left;
+        color: on-color(primary);
+        font-size: 14px;
+        font-family: Roboto, "Helvetica Neue", sans-serif;
+        cursor: initial;
+        .bannerContent {
+            padding-right: 15px;
+        }
+        .bannerLinks {
+            display: flex;
+            align-items: center;
+            border-left: 2px solid #ffffffad;
+            padding-left: 15px;
+            cursor: initial;
+        }
+        .helpIcon {
+            height: 18px;
+            padding-left: 15px;
+        }
+        a {
+            display: inline;
+            color: on-color(primary);
+            text-decoration-color: on-color(primary);
+        }
+        a:hover, .helpIcon:hover {
+            color: $panel-dark;
+            opacity: 0.8;
+        }
+    }
 }
 
 .btn-group {

nav-app/src/app/tabs/tabs.component.ts

@@ -1,5 +1,5 @@
 // https://embed.plnkr.co/wWKnXzpm8V31wlvu64od/
-import { Component, AfterContentInit, ViewChild, TemplateRef, AfterViewInit } from '@angular/core';
+import { Component, AfterContentInit, ViewChild, TemplateRef, AfterViewInit, ViewEncapsulation } from '@angular/core';
 import { DataService, Technique } from '../data.service'; //import the DataService component so we can use it
 import { ConfigService } from '../config.service';
 import * as is from 'is_js';
@@ -19,8 +19,8 @@ declare var math: any; //use mathjs
     selector: 'tabs',
     templateUrl: './tabs.component.html',
     styleUrls: ['./tabs.component.scss'],
-    providers: [ViewModelsService]
-
+    providers: [ViewModelsService],
+    encapsulation: ViewEncapsulation.None
 })
 export class TabsComponent implements AfterContentInit, AfterViewInit {
 
@@ -61,6 +61,7 @@ export class TabsComponent implements AfterContentInit, AfterViewInit {
                     if(!this.activeTab) { this.selectTab(this.layerTabs[0]); }
                 });
                 this.customizedConfig = this.configService.getFeatureList()
+                this.bannerContent = this.configService.banner;
             },
             complete: () => { if (subscription) subscription.unsubscribe(); } //prevent memory leaks
         });
@@ -651,6 +652,7 @@ export class TabsComponent implements AfterContentInit, AfterViewInit {
     // layerLinkURL = ""; //the user inputted layer link which will get parsed into a param
     layerLinkURLs: string[] = [];
     customizedConfig = [];
+    bannerContent: string;
 
     /**
      * Helper function to track which layerLinkURLs have been added or removed

nav-app/src/assets/config.json

@@ -1,5 +1,22 @@
 {
     "versions": [
+        {
+            "name": "ATT&CK v9", 
+            "domains": [
+                {   
+                    "name": "Enterprise", 
+                    "data": ["https://raw.githubusercontent.com/mitre/cti/ATT%26CK-v9.0/enterprise-attack/enterprise-attack.json"]
+                },
+                {   
+                    "name": "Mobile", 
+                    "data": ["https://raw.githubusercontent.com/mitre/cti/ATT%26CK-v9.0/mobile-attack/mobile-attack.json"]
+                },
+                {
+                    "name": "ICS",
+                    "data": ["https://raw.githubusercontent.com/mitre/cti/ATT%26CK-v9.0/ics-attack/ics-attack.json"]
+                }
+            ]
+        },
         {
             "name": "ATT&CK v8", 
             "domains": [
@@ -82,6 +99,8 @@
 
     "comment_color": "yellow",
 
+    "banner": "",
+
     "features": [
         {"name": "leave_site_dialog", "enabled": true, "description": "Disable to remove the dialog prompt when leaving site."},
         {"name": "tabs", "enabled": true, "description": "Disable to remove the ability to open new tabs."},