#12 Update the Custom field dialog to better generate internal reference

thehive-backend/conf/routes

@@ -79,6 +79,7 @@ DELETE   /api/list/:itemId                        org.elastic4play.controllers.D
 PATCH    /api/list/:itemId                        org.elastic4play.controllers.DBListCtrl.updateItem(itemId)
 POST     /api/list/:listName                      org.elastic4play.controllers.DBListCtrl.addItem(listName)
 GET      /api/list/:listName                      org.elastic4play.controllers.DBListCtrl.listItems(listName)
+POST     /api/list/:listName/_exists              org.elastic4play.controllers.DBListCtrl.itemExists(listName)
 
 
 GET      /api/user/current                        controllers.UserCtrl.currentUser()

ui/.jshintrc

@@ -23,6 +23,7 @@
     "updatableLink": false,
     "setTimeout": false,
     "_": false,
+    "s": false,
     "CryptoJS": false,
     "c3": false,
     "saveSvgAsPng": false,

ui/app/index.html

@@ -107,6 +107,7 @@
     <script src="bower_components/angular-ui-sortable/sortable.js"></script>
     <script src="bower_components/js-base64/base64.js"></script>
     <script src="bower_components/angular-scroll/angular-scroll.js"></script>
+    <script src="bower_components/underscore.string/dist/underscore.string.js"></script>
     <!-- endbower -->
 
     <script type="text/javascript" src="bower_components/ace-builds/src-min-noconflict/ace.js"></script>

ui/app/scripts/controllers/admin/AdminCaseTemplatesCtrl.js

@@ -163,10 +163,10 @@
             };
 
             $scope.addCustomField = function(field) {
-                if($scope.templateCustomFields.indexOf(field.name) === -1) {
-                    $scope.templateCustomFields.push(field.name);
+                if($scope.templateCustomFields.indexOf(field.reference) === -1) {
+                    $scope.templateCustomFields.push(field.reference);
                 } else {
-                    NotificationSrv.log('The custom field [' + field.label + '] has already been added to the template', 'warning');
+                    NotificationSrv.log('The custom field [' + field.name + '] has already been added to the template', 'warning');
                 }
             };
 

ui/app/scripts/controllers/admin/AdminCustomFieldDialogCtrl.js

@@ -4,8 +4,9 @@
     angular.module('theHiveControllers').controller('AdminCustomFieldDialogCtrl',
         function($scope, $uibModalInstance, ListSrv, NotificationSrv, customField) {
             var self = this;
-            self.reference = {
-                types: ['string', 'number', 'boolean', 'date']
+            self.config = {
+                types: ['string', 'number', 'boolean', 'date'],
+                referencePattern: '^[a-zA-Z]{1}[a-zA-Z0-9_-]*'
             };
 
             self.customField = customField;
@@ -36,8 +37,12 @@
                 return values;
             };
 
-            self.saveField = function() {
-                var postData = _.pick(self.customField, 'name', 'title', 'label', 'description', 'type');
+            self.saveField = function(form) {
+                if (!form.$valid) {
+                    return;
+                }
+
+                var postData = _.pick(self.customField, 'name', 'reference', 'description', 'type');
                 postData.options = buildOptionsCollection(self.customField.options);
 
                 if(self.customField.id) {
@@ -47,17 +52,52 @@
                         onSuccess,
                         onFailure);
                 } else {
-                    ListSrv.save(
+                    ListSrv.exists(
                         {'listId': 'custom_fields'},
-                        {'value': JSON.stringify(postData)},
-                        onSuccess,
-                        onFailure);
+                        {
+                            key: 'reference',
+                            value: postData.reference
+                        },
+                        function(response) {
+                            if(response.data) {
+                                ListSrv.save(
+                                    {'listId': 'custom_fields'},
+                                    {'value': JSON.stringify(postData)},
+                                    onSuccess,
+                                    onFailure);
+                            } else {
+                                // TODO handle field validation
+                                form.reference.$setValidity('unique', false);
+                                form.reference.$setDirty();
+                                NotificationSrv.error('AdminCustomFieldDialogCtrl', 'There is already a custom field with the specified reference: ' + postData.reference);
+                            }
+                        },
+                        onFailure
+                    )
                 }
             };
 
+            self.clearUniqueReferenceError = function(form) {
+                form.reference.$setValidity('unique', true);
+                form.reference.$setPristine();
+            }
+
             self.cancel = function() {
                 $uibModalInstance.dismiss();
             }
 
+            self.onNamechanged = function(form) {
+                if(!self.customField.name) {
+                    return;
+                }
+
+                var reference = s.trim(s.classify(self.customField.name));
+                reference = reference.charAt(0).toLowerCase() + reference.slice(1);
+
+                self.customField.reference = reference;
+
+                self.clearUniqueReferenceError(form);
+            };
+
         });
 })();

ui/app/scripts/controllers/admin/AdminCustomFieldsCtrl.js

@@ -24,10 +24,6 @@
                     'listId': 'custom_fields'
                 }, {}, function(response) {
 
-                    // self.customFields = _.values(response).filter(_.isString).map(function(item) {
-                    //     return JSON.parse(item);
-                    // });
-
                     self.customFields = _.map(response.toJSON(), function(value, key) {
                         var obj = JSON.parse(value);
                         obj.id = key;

ui/app/scripts/controllers/case/CaseDetailsCtrl.js

@@ -92,7 +92,7 @@
         }
 
         $scope.getCustomFieldName = function(fieldDef) {
-            return 'customFields.' + fieldDef.name + '.' + fieldDef.type;
+            return 'customFields.' + fieldDef.reference + '.' + fieldDef.type;
         };
 
         $scope.addCustomField = function(customField) {
@@ -111,14 +111,14 @@
             modalInstance.result.then(function() {
                 var temp = $scope.caze.customFields || {};
 
-                temp[customField.name] = {};
-                temp[customField.name][customField.type] = null;
-                temp[customField.name].order = _.keys(temp).length;
+                var customFieldValue = {};
+                customFieldValue[customField.type] = null;
+                customFieldValue.order = _.keys(temp).length + 1;
 
-                $scope.caze.customFields = temp;
-
-                $scope.updateField('customFields.', $scope.caze.customFields);
+                $scope.updateField('customFields.' + customField.reference, customFieldValue);
                 $scope.updateCustomFieldsList();
+
+                $scope.caze.customFields[customField.reference] = customFieldValue;
             });
         };
 

ui/app/scripts/services/CustomFieldsCacheSrv.js

@@ -32,8 +32,8 @@
                             return JSON.parse(item);
                         });
 
-                        _.each(data, function(m){
-                            cache[m.name] = m;
+                        _.each(data, function(field){
+                            cache[field.reference] = field;
                         });
 
                         deferred.resolve(cache);

ui/app/scripts/services/ListSrv.js

@@ -11,7 +11,11 @@
             },
             update: {
                 url: './api/list/:itemId',
-                method: 'PATCH',
+                method: 'PATCH'
+            },
+            exists: {
+                url: './api/list/:listId/_exists',
+                method: 'POST',
             }
         });
     });

ui/app/views/partials/admin/case-templates.html

@@ -203,7 +203,7 @@ <h4 class="vpad10 text-primary">
                                     </a>
                                     <ul class="dropdown-menu" uib-dropdown-menu>
                                         <li ng-repeat="(key, value) in fields">
-                                            <a ng-click="addCustomField(value)">{{value.label}}</a>
+                                            <a ng-click="addCustomField(value)">{{value.name}}</a>
                                         </li>
                                     </ul>
                                 </span>
@@ -218,7 +218,7 @@ <h4 class="vpad10 text-primary">
                                         <a href ng-click="isCollapsed=!isCollapsed">
                                             <i class="fa" ng-class="{'fa-caret-down': isCollapsed, 'fa-caret-up': !isCollapsed}"></i>
                                         </a>
-                                        <span class="hpad5">{{fields[m].label}}</span>
+                                        <span class="hpad5">{{fields[m].name}}</span>
                                         <span class="pull-right">
                                             <a class="text-danger" href ng-click="removeCustomField(m)">
                                                 <i class="fa fa-times"></i>&nbsp;Delete</a>

ui/app/views/partials/admin/custom-field-dialog.html

@@ -1,4 +1,4 @@
-<form class="form-horizontal" name="fieldsForm" ng-submit="$vm.saveField()" novalidate>
+<form class="form-horizontal" name="fieldsForm" ng-submit="$vm.saveField(fieldsForm)" novalidate>
     <div class="modal-header bg-primary">
         <h3 class="modal-title">{{$vm.customField.id ? 'Update' : 'Add'}} custom field</h3>
     </div>
@@ -10,18 +10,30 @@ <h3 class="modal-title">{{$vm.customField.id ? 'Update' : 'Add'}} custom field</
                 <i class="fa fa-asterisk text-danger"></i>
             </label>
             <div class="col-sm-10">
-                <input class="form-control" name="name" ng-model="$vm.customField.name" placeholder="Ex: cvss, threatActor, businessRisk" required type="text">
+                <input class="form-control" name="name"
+                    placeholder="Field's title, Ex: CVSS, Threat actor, Business risk"
+                    ng-model="$vm.customField.name"
+                    ng-keyup="$vm.onNamechanged(fieldsForm)"
+                    required type="text">
                 <p class="help-block" ng-show="fieldsForm.name.$invalid && !fieldsForm.name.$pristine">This field is required.</p>
             </div>
         </div>
-        <div class="form-group" ng-class="{ 'has-error' : fieldsForm.label.$invalid && !fieldsForm.label.$pristine }">
+
+        <div class="form-group" ng-class="{ 'has-error' : fieldsForm.reference.$invalid && fieldsForm.reference.$dirty }">
             <label class="col-sm-2 control-label">
-                Label
+                Reference
                 <i class="fa fa-asterisk text-danger"></i>
             </label>
             <div class="col-sm-10">
-                <input class="form-control" name="label" ng-model="$vm.customField.label" placeholder="Ex: CVSS, Threat actor, Business risk" required type="text">
-                <p class="help-block" ng-show="fieldsForm.label.$invalid && !fieldsForm.label.$pristine">This field is required.</p>
+                <input class="form-control" name="reference" type="text"
+                    placeholder="Internal reference, Ex: cvss, threatActor, businessRisk"
+                    ng-model="$vm.customField.reference"
+                    ng-keyup="$vm.clearUniqueReferenceError(fieldsForm)"
+                    ng-pattern="$vm.config.referencePattern"
+                    required>
+                <p class="help-block" ng-show="fieldsForm.reference.$error.unique">There is already a field with this reference. It should be unique.</p>
+                <p class="help-block" ng-show="fieldsForm.reference.$error.required && fieldsForm.reference.$dirty">This field is required.</p>
+                <p class="help-block" ng-show="fieldsForm.reference.$error.pattern && fieldsForm.reference.$dirty">This field is should satisfy the following pattern: {{$vm.config.referencePattern}}</p>
             </div>
         </div>
 
@@ -42,13 +54,13 @@ <h3 class="modal-title">{{$vm.customField.id ? 'Update' : 'Add'}} custom field</
             </label>
             <div class="col-sm-10">
                 <select class="form-control" name="type" ng-model="$vm.customField.type"
-                    ng-options="fieldType for fieldType in $vm.reference.types"
+                    ng-options="fieldType for fieldType in $vm.config.types"
                     placeholder="Field's type" required></select>
                 <p class="help-block" ng-show="fieldsForm.type.$invalid && !fieldsForm.type.$pristine">This field is required.</p>
             </div>
         </div>
 
-        <div class="form-group">
+        <div class="form-group" ng-show="$vm.customField.type === 'string' || $vm.customField.type === 'number'">
             <label class="col-sm-2 control-label">
                 Possible values
             </label>

ui/app/views/partials/admin/custom-fields.html

@@ -16,7 +16,7 @@ <h3 class="box-title">Case custom fields ({{$vm.customFields.length}})</h3>
                         <tr>
                             <th width="80">Type</th>
                             <th width="250">Name</th>
-                            <th width="250">Label</th>
+                            <th width="250">Internal Reference</th>
                             <th>Description</th>
                             <th width="200">Options</th>
                             <th width="80" class="text-center">Actions</th>
@@ -28,7 +28,7 @@ <h3 class="box-title">Case custom fields ({{$vm.customFields.length}})</h3>
                                 <span class="label label-default">{{field.type | uppercase}}</span>
                             </td>
                             <td><a href ng-click="$vm.showFieldDialog(field)">{{field.name}}</a></td>
-                            <td>{{field.label}}</td>
+                            <td>{{field.reference}}</td>
                             <td>{{field.description || 'N/A'}}</td>
                             <td ng-if="field.options.length === 0">
                                 <em>None</em>

ui/app/views/partials/case/case.add.field.html

@@ -3,7 +3,7 @@ <h3 class="modal-title">Add custom field to Case #{{caze.caseId}}</h3>
 </div>
 <div class="modal-body">
     <div class="vpad20">
-        You are about to add the <strong uib-tooltip="{{data.description}}">{{data.label}}</strong> custom field to the case <strong>#{{caze.caseId}}: {{caze.title}}</strong>
+        You are about to add the <strong uib-tooltip="{{data.description}}">{{data.name}}</strong> custom field to the case <strong>#{{caze.caseId}}: {{caze.title}}</strong>
         <br/>
         <br/>
         Are you sure you want to continue ?

ui/app/views/partials/case/details/custom.fields.html

@@ -7,7 +7,7 @@ <h4 class="vpad10 text-primary">
             </a>
             <ul class="dropdown-menu" uib-dropdown-menu>
                 <li ng-repeat="(key, value) in allCustomFields">
-                    <a ng-click="addCustomField(value)">{{value.label}}</a>
+                    <a ng-click="addCustomField(value)">{{value.name}}</a>
                 </li>
             </ul>
         </span>
@@ -19,8 +19,8 @@ <h4 class="vpad10 text-primary">
 
     <dl class="dl-horizontal clear"
         ng-repeat="k in orderedFields"
-        ng-init="fieldDef = customFieldsCache[k]; customFieldValue=caze.customFields[fieldDef.name][fieldDef.type];">
-        <dt class="pull-left" uib-tooltip="{{fieldDef.description}}">{{fieldDef.label}}</dt>
+        ng-init="fieldDef = customFieldsCache[k]; customFieldValue=caze.customFields[fieldDef.reference][fieldDef.type];">
+        <dt class="pull-left" uib-tooltip="{{fieldDef.description}}">{{fieldDef.name}}</dt>
         <dd ng-if="fieldDef.options.length > 0">
             <updatable-select
                 options="fieldDef.options"

ui/bower.json

@@ -48,7 +48,8 @@
     "angular-base64-upload": "^0.1.19",
     "angular-ui-sortable": "^0.17.0",
     "js-base64": "^2.1.9",
-    "angular-scroll": "^1.0.1"
+    "angular-scroll": "^1.0.1",
+    "underscore.string": "^3.3.4"
   },
   "devDependencies": {
     "angular-mocks": "1.5.8"

ui/test/karma.conf.js

@@ -69,6 +69,7 @@ module.exports = function(config) {
       'bower_components/angular-ui-sortable/sortable.js',
       'bower_components/js-base64/base64.js',
       'bower_components/angular-scroll/angular-scroll.js',
+      'bower_components/underscore.string/dist/underscore.string.js',
       'bower_components/angular-mocks/angular-mocks.js',
       // endbower
       "bower_components/cryptojslib/components/core-min.js",