#365 Add UI changes to display and update sighted information for obs…

…ervables
TheHive-Project · Nov 20, 2017 · 2e5c066 · 2e5c066
1 parent f139c9a
commit 2e5c066
Show file tree

Hide file tree

Showing 13 changed files with 85 additions and 37 deletions.
diff --git a/thehive-backend/conf/routes b/thehive-backend/conf/routes
@@ -34,9 +34,9 @@ POST     /api/case/artifact/_stats                controllers.ArtifactCtrl.stats
 POST     /api/case/:caseId/artifact               controllers.ArtifactCtrl.create(caseId)
 GET      /api/case/artifact/:artifactId           controllers.ArtifactCtrl.get(artifactId)
 DELETE   /api/case/artifact/:artifactId           controllers.ArtifactCtrl.delete(artifactId)
+PATCH    /api/case/artifact/_bulk                 controllers.ArtifactCtrl.bulkUpdate()
 PATCH    /api/case/artifact/:artifactId           controllers.ArtifactCtrl.update(artifactId)
 GET      /api/case/artifact/:artifactId/similar   controllers.ArtifactCtrl.findSimilar(artifactId)
-PATCH    /api/case/artifact/_bulk                 controllers.ArtifactCtrl.bulkUpdate()
 
 POST     /api/case/:caseId/task/_search           controllers.TaskCtrl.findInCase(caseId)
 POST     /api/case/task/_search                   controllers.TaskCtrl.find()

diff --git a/ui/app/scripts/controllers/case/CaseObservablesCtrl.js b/ui/app/scripts/controllers/case/CaseObservablesCtrl.js
@@ -423,18 +423,27 @@
             $scope.chTLP = '-1';
             $scope.updateTLP = function (value) {
                 $scope.chTLP = value;
-                angular.forEach($scope.selection.artifacts, function (te) {
-                    $scope.updateField(te.id, 'tlp', $scope.chTLP);
-                });
-                $scope.chTLP = '-1';
+                CaseArtifactSrv.bulkUpdate(_.pluck($scope.selection.artifacts, 'id'), {'tlp': $scope.chTLP})
+                    .then(function(){
+                        $scope.chTLP = '-1';
+                        NotificationSrv.log('Selected observables have been updated successfully', 'success');
+                        $scope.selection.Action='main';
+                    });
             };
 
-            $scope.setIOC = function (action) {
-                var ioc = action === 'setIocFlog';
-
-                angular.forEach($scope.selection.artifacts, function (te) {
-                    $scope.updateField(te.id, 'ioc', ioc);
-                });
+            $scope.setIOC = function (ioc) {
+                CaseArtifactSrv.bulkUpdate(_.pluck($scope.selection.artifacts, 'id'), {ioc: ioc})
+                    .then(function(){
+                        NotificationSrv.log('Selected observables have been updated successfully', 'success');
+                        $scope.selection.Action='main';
+                    });
+            };
+            $scope.setSightedFlag = function (sighted) {
+                CaseArtifactSrv.bulkUpdate(_.pluck($scope.selection.artifacts, 'id'), {sighted: sighted})
+                    .then(function(){
+                        NotificationSrv.log('Selected observables have been updated successfully', 'success');
+                        $scope.selection.Action='main';
+                    });
             };
 
             $scope.updateField = function (id, fieldName, newValue) {

diff --git a/ui/app/scripts/controllers/case/ObservableCreationCtrl.js b/ui/app/scripts/controllers/case/ObservableCreationCtrl.js
@@ -13,6 +13,7 @@
             $scope.params = {
                 bulk: false,
                 ioc: false,
+                sighted: false,
                 data: '',
                 tlp: 2,
                 message: '',
@@ -71,6 +72,7 @@
                     postData = {
                         dataType: params.dataType,
                         ioc: params.ioc,
+                        sighted: params.sighted,
                         tlp: params.tlp,
                         message: params.message,
                         tags: _.unique(_.pluck($scope.tags, 'text'))

diff --git a/ui/app/scripts/services/CaseArtifactSrv.js b/ui/app/scripts/services/CaseArtifactSrv.js
@@ -1,7 +1,7 @@
 (function() {
     'use strict';
     angular.module('theHiveServices')
-        .factory('CaseArtifactSrv', function(FileResource) {
+        .factory('CaseArtifactSrv', function($http, FileResource) {
             var api = null;
             var filters = null;
 
@@ -20,6 +20,10 @@
                     }
 
                     return api;
+                },
+
+                bulkUpdate: function(ids, update) {
+                    return $http.patch('./api/case/artifact/_bulk', _.extend({ids: ids}, update));
                 }
             };
 

diff --git a/ui/app/scripts/services/ObservablesUISrv.js b/ui/app/scripts/services/ObservablesUISrv.js
@@ -7,8 +7,8 @@
                 actions: {
                     main: 'Action',
                     export: 'Export',
-                    setIocFlog: 'Set IOC flog',
-                    unsetIocFlog: 'Unset IOC flog',
+                    changeSightedFlog: 'Change sighted flag',
+                    changeIOCFlog: 'Change sighted flag',
                     changeTlp: 'Change TLP',
                     addTags: 'Add tags',
                     runAnalyzers: 'Run analyzers',
@@ -40,6 +40,11 @@
                         type: 'boolean',
                         defaultValue: null
                     },
+                    sighted: {
+                        field: 'sighted',
+                        type: 'boolean',
+                        defaultValue: null
+                    },
                     tlp: {
                         field: 'tlp',
                         type: 'number',

diff --git a/ui/app/views/directives/flow/observable.html b/ui/app/views/directives/flow/observable.html
@@ -9,7 +9,7 @@
             <tlp value="base.object.tlp"></tlp>
         </span>
         <div class="flow-item-bulk" ng-if="isBulkOperation()">
-            <em>{{summary.case_artifact.Creation}} other observables have also been added</em>
+            <em>{{summary.case_artifact.Creation}} other observables have also been {{base.operation === 'Creation' ? 'added' : 'updated'}}</em>
             <a class="small" href ng-click="openState('app.case.observables', {caseId: base.object.case.id})">See all</a>
         </div>
     </div>

diff --git a/ui/app/views/partials/case/case.observables.html b/ui/app/views/partials/case/case.observables.html
@@ -12,10 +12,10 @@
                     </li>
                     <li class="divider"></li>
                     <li>
-                        <a ng-click="selection.isCollapsed=true;selection.Action = 'setIocFlog'">Set IOC flag</a>
+                        <a ng-click="selection.isCollapsed=true;selection.Action = 'changeSightedFlog'">Change sighted flag</a>
                     </li>
                     <li>
-                        <a ng-click="selection.isCollapsed=true;selection.Action = 'unsetIocFlog'">Unset IOC flag</a>
+                        <a ng-click="selection.isCollapsed=true;selection.Action = 'changeIOCFlog'">Change IOC flag</a>
                     </li>
                     <li>
                         <a ng-click="selection.isCollapsed=true;selection.Action ='changeTlp'">Change TLP</a>
@@ -79,8 +79,8 @@ <h5 ng-if="selection.artifacts.length > 0 ">
 
 <!-- collapse for Tags + TLP + Delete -->
 <div class="row" uib-collapse="!selection.isCollapsed">
-    <div ng-include="'views/partials/observables/list/artifacts-list-ioc.html'" ng-if="selection.Action === 'setIocFlog'"></div>
-    <div ng-include="'views/partials/observables/list/artifacts-list-ioc.html'" ng-if="selection.Action === 'unsetIocFlog'"></div>
+    <div ng-include="'views/partials/observables/list/artifacts-list-sighted.html'" ng-if="selection.Action === 'changeSightedFlog'"></div>
+    <div ng-include="'views/partials/observables/list/artifacts-list-ioc.html'" ng-if="selection.Action === 'changeIOCFlog'"></div>    
     <div ng-include="'views/partials/observables/list/artifacts-list-tlp.html'" ng-if="selection.Action === 'changeTlp'"></div>
     <div ng-include="'views/partials/observables/list/artifacts-list-delete.html'" ng-if="selection.Action === 'remove'"></div>
     <div ng-include="'views/partials/observables/list/artifacts-list-tags.html'" ng-if="selection.Action === 'addTags'"></div>

diff --git a/ui/app/views/partials/observables/creation/form.html b/ui/app/views/partials/observables/creation/form.html
@@ -3,7 +3,7 @@
     <div class="col-md-9">
         <input type="hidden" name="dataType" ng-model="params.dataType" required>
         <div class="btn-group" uib-dropdown>
-            <button type="button" class="btn" uib-dropdown-toggle>{{params.dataType}}&nbsp;&nbsp;<span class="caret"></span>
+            <button type="button" class="btn btn-default" uib-dropdown-toggle>{{params.dataType}}&nbsp;&nbsp;<span class="caret"></span>
             </button>
             <ul class="dropdown-menu" uib-dropdown-menu>
                 <li ng-repeat="type in types">
@@ -39,6 +39,7 @@
             <span ng-show="params.bulk" class="pull-right"><ng-pluralize count="countObservables()" when="{'0': '0 observables', 'one': '1 unique observable', 'other': '{} unique observables'}"></ng-pluralize></span>
         </div>
         <div><input type="checkbox" ng-model="params.ioc">&nbsp;Mark <strong ng-show="params.bulk">all observables</strong> as IOC</div>
+        <div><input type="checkbox" ng-model="params.sighted">&nbsp;Mark <strong ng-show="params.bulk">all observables</strong> as sighted</div>
     </div>
 </div>
 

diff --git a/ui/app/views/partials/observables/details/artifact-details-information.html b/ui/app/views/partials/observables/details/artifact-details-information.html
@@ -31,13 +31,17 @@ <h3 class="vpad10 text-primary">Metadata</h3>
         <dl class="dl-horizontal clear">
 			<dt class="pull-left">Is IOC</dt>
 			<dd>
-				<span ng-init="iocActive = false" ng-mouseenter="iocActive = true" ng-mouseleave="iocActive = false" ng-click="updateField('ioc', !artifact.ioc)">
+				<span class="clickable" ng-click="updateField('ioc', !artifact.ioc)">
                     <i class="text-primary fa" ng-class="{'true': 'fa-star', 'false': 'fa-star-o'}[artifact.ioc]"></i>
-                    <small ng-show="iocActive">
-                        <a href class="clickable" uib-tooltip="edit">
-                            <i class="glyphicon glyphicon-pencil"></i>
-                        </a>
-                    </small>
+				</span>
+			</dd>
+		</dl>
+
+        <dl class="dl-horizontal clear">
+			<dt class="pull-left">Has been sighted</dt>
+			<dd>
+				<span class="clickable" ng-click="updateField('sighted', !artifact.sighted)">
+                    <i class="text-primary fa" ng-class="{'true': 'fa-thumbs-up', 'false': 'fa-thumbs-o-up'}[artifact.sighted]"></i>                    
 				</span>
 			</dd>
 		</dl>

diff --git a/ui/app/views/partials/observables/list/artifacts-list-ioc.html b/ui/app/views/partials/observables/list/artifacts-list-ioc.html
@@ -1,13 +1,13 @@
-<div class="col-md-10 col-md-offset-1 bg-info text-center">
-    <br>
-    <span class="btn btn-sm btn-primary" ng-click="setIOC(selection.Action);" ng-switch="selection.Action">
+<div class="col-md-10 col-md-offset-1 bg-info text-center pv-s">
+    <div class="mb-xxs">You have selected {{selection.artifacts.length}} observable(s)</div>
 
-		<span ng-switch-when="setIocFlog"><i class="fa fa-star"></i> Set IOC flag for {{selection.artifacts.length}} observable(s)</span>
-		<span ng-switch-when="unsetIocFlog"><i class="fa fa-star-o"></i> Unset IOC flag for {{selection.artifacts.length}} observable(s)</span>
+    <span class="btn btn-sm btn-primary mr-xxs" ng-click="setIOC(true)">
+        <i class="fa fa-star"></i> Add IOC flag
+    </span>
+    <span class="btn btn-sm btn-primary mr-xxs" ng-click="setIOC(false)">
+        <i class="fa fa-star-o"></i> Remove IOC flag
     </span>
     <span class="btn btn-sm btn-default" ng-click="selection.Action='main';">
         Cancel
     </span>
-    <br>
-    <br>
 </div>
diff --git a/ui/app/views/partials/observables/list/artifacts-list-main.html b/ui/app/views/partials/observables/list/artifacts-list-main.html
@@ -41,6 +41,7 @@ <h4>Observable List ({{artifacts.total || 0}} of {{artifactStats.count}})</h4>
                 </th>
                 <th style="width: 15px"></th>
                 <th style="width: 15px"></th>
+                <th style="width: 15px"></th>
                 <th style="width: 100px">Type <a href ng-click="artifacts.sort='-dataType'; artifacts.update()"><i class="fa fa-caret-up"></i></a><a href ng-click="artifacts.sort='+dataType'; artifacts.update()"><i class="fa fa-caret-down"></i></a></th>
                 <th>Value/Filename <a href ng-click="artifacts.sort='-data'; artifacts.update()"><i class="fa fa-caret-up"></i></a><a href ng-click="artifacts.sort='+data'; artifacts.update()"><i class="fa fa-caret-down"></i></a></th>
                 <th style="width: 120px">Date Added <a href ng-click="artifacts.sort='-startDate'; artifacts.update()"><i class="fa fa-caret-up"></i></a><a href ng-click="artifacts.sort='+startDate'; artifacts.update()"><i class="fa fa-caret-down"></i></a></th>
@@ -55,6 +56,9 @@ <h4>Observable List ({{artifacts.total || 0}} of {{artifactStats.count}})</h4>
                 <td>
                     <span ng-click="addFilterValue('ioc', artifact.ioc)" ng-if="artifact.ioc" class="clickable fa fa-star" uib-tooltip="is an IOC" tooltip-popup-delay="500" tooltip-placement="bottom"></span>
                 </td>
+                <td>
+                    <span ng-click="addFilterValue('sighted', artifact.sighted)" ng-if="artifact.sighted" class="clickable fa fa-thumbs-up" uib-tooltip="has been sighted" tooltip-popup-delay="500" tooltip-placement="bottom"></span>
+                </td>
                 <td>
 					<span uib-tooltip="{{artifact.stats.seen}} related artifact(s)" tooltip-popup-delay="500" tooltip-placement="bottom" ng-if="artifact.stats.seen > 0" class="glyphicon glyphicon-eye-open"></span>
                 </td>

diff --git a/ui/app/views/partials/observables/list/artifacts-list-sighted.html b/ui/app/views/partials/observables/list/artifacts-list-sighted.html
@@ -0,0 +1,13 @@
+<div class="col-md-10 col-md-offset-1 bg-info text-center pv-s">
+    <div class="mb-xxs">You have selected {{selection.artifacts.length}} observable(s)</div>
+
+    <span class="btn btn-sm btn-primary mr-xxs" ng-click="setSightedFlag(true)">
+        <i class="fa fa-thumbs-up"></i> Add sighted flag
+    </span>
+    <span class="btn btn-sm btn-primary mr-xxs" ng-click="setSightedFlag(false)">
+        <i class="fa fa-thumbs-o-up"></i> Remove sighted flag
+    </span>
+    <span class="btn btn-sm btn-default" ng-click="selection.Action='main';">
+        Cancel
+    </span>
+</div>
diff --git a/ui/app/views/partials/observables/list/filters.html b/ui/app/views/partials/observables/list/filters.html
@@ -60,13 +60,19 @@ <h4>Filters</h4>
                         </div>
                     </div>
                     <div class="form-group">
-                        <label class="col-sm-4 control-label">Is IOC</label>
+                        <label class="col-sm-4 control-label">Flags</label>
                         <div class="col-sm-8">
-                            <div class="btn-group">
-                                <label uib-btn-radio="true" class="btn btn-default btn-sm" name="ioc" ng-model="uiSrv.activeFilters.ioc.value">Yes</label>
-                                <label uib-btn-radio="false" class="btn btn-default btn-sm" name="ioc" ng-model="uiSrv.activeFilters.ioc.value">No</label>
+                            <div class="mr-xxs mb-xxxs btn-group">
+                                <label uib-btn-radio="true" class="btn btn-default btn-sm" name="ioc" ng-model="uiSrv.activeFilters.ioc.value">IOC</label>
+                                <label uib-btn-radio="false" class="btn btn-default btn-sm" name="ioc" ng-model="uiSrv.activeFilters.ioc.value">Not IOC</label>
                                 <label uib-btn-radio="null" class="btn btn-default btn-sm" name="ioc" ng-model="uiSrv.activeFilters.ioc.value">Any</label>
                             </div>
+
+                            <div class="btn-group">
+                                <label uib-btn-radio="true" class="btn btn-default btn-sm" name="sighted" ng-model="uiSrv.activeFilters.sighted.value">Sighted</label>
+                                <label uib-btn-radio="false" class="btn btn-default btn-sm" name="sighted" ng-model="uiSrv.activeFilters.sighted.value">Not sighted</label>
+                                <label uib-btn-radio="null" class="btn btn-default btn-sm" name="sighted" ng-model="uiSrv.activeFilters.sighted.value">Any</label>
+                            </div>
                         </div>
                     </div>
                     <div class="form-group">