Extend data model for validation issues

Add the Issues pane

1. Add a class to represent the validation issue
2. Extend the data model for an validation issue to
  (1) add a severity level field (useful for identify save-blocking issues later)
  (2) replace single entity with an array of entities (useful for issues involving multiple entities)
  (3) add a coordinates field for highlighting the location of the issue on the map
  (4) add a fixes field for possible automatic fixes

3. Update existing validation modules to use the new data model

modules/ui/commit_warnings.js

@@ -1,3 +1,5 @@
+import _map from 'lodash-es/map';
+
 import { t } from '../util/locale';
 import { modeSelect } from '../modes';
 import { svgIcon } from '../svg';
@@ -11,10 +13,9 @@ export function uiCommitWarnings(context) {
 
     function commitWarnings(selection) {
 
-        // maybe call these issues now?
-        var validations = context.issueManager().validate();
+        var issues = context.issueManager().validate();
 
-        validations = _reduce(validations, function(validations, val) {
+        validations = _reduce(issues, function(validations, val) {
             var severity = val.severity;
             if (validations.hasOwnProperty(severity)) {
                 validations[severity].push(val);
@@ -24,10 +25,10 @@ export function uiCommitWarnings(context) {
             return validations;
         }, {});
 
-        _forEach(validations, function(instances, type) {
+        _forEach(validations, function(instances, severity) {
             instances = _uniqBy(instances, function(val) { return val.id + '_' + val.message.replace(/\s+/g,''); });
-            var section = type + '-section';
-            var instanceItem = type + '-item';
+            var section = severity + '-section';
+            var instanceItem = severity + '-item';
 
             var container = selection.selectAll('.' + section)
                 .data(instances.length ? [0] : []);
@@ -41,7 +42,7 @@ export function uiCommitWarnings(context) {
 
             containerEnter
                 .append('h3')
-                .text(type === 'warning' ? t('commit.warnings') : t('commit.errors'));
+                .text(severity === 'warning' ? t('commit.warnings') : t('commit.errors'));
 
             containerEnter
                 .append('ul')
@@ -77,31 +78,35 @@ export function uiCommitWarnings(context) {
             items = itemsEnter
                 .merge(items);
 
+
             items
                 .on('mouseover', mouseover)
                 .on('mouseout', mouseout)
                 .on('click', warningClick);
 
-
             function mouseover(d) {
-                if (d.entity) {
+                if (d.entities) {
                     context.surface().selectAll(
-                        utilEntityOrMemberSelector([d.entity.id], context.graph())
+                        utilEntityOrMemberSelector(
+                            _map(d.entities, function(e) { return e.id; }),
+                            context.graph()
+                        )
                     ).classed('hover', true);
                 }
             }
 
-
             function mouseout() {
                 context.surface().selectAll('.hover')
                     .classed('hover', false);
             }
 
-
             function warningClick(d) {
-                if (d.entity) {
-                    context.map().zoomTo(d.entity);
-                    context.enter(modeSelect(context, [d.entity.id]));
+                if (d.entities) {
+                    context.map().zoomTo(d.entities[0]);
+                    context.enter(modeSelect(
+                        context,
+                        _map(d.entities, function(e) { return e.id; }),
+                    ));
                 }
             }
         });

modules/ui/issues.js

@@ -1,3 +1,4 @@
+import _map from 'lodash-es/map';
 import {
     event as d3_event,
     select as d3_select
@@ -104,9 +105,9 @@ export function uiIssues(context) {
         var name = 'issues_list';
 
         var changes = context.history().changes();
-        var validations = context.history().validate(changes);
+        var issues = context.history().validate(changes);
 
-        /*validations = _reduce(validations, function(validations, val) {
+        /*validations = _reduce(issues, function(validations, val) {
             var severity = val.severity;
             if (validations.hasOwnProperty(severity)) {
                 validations[severity].push(val);
@@ -117,7 +118,7 @@ export function uiIssues(context) {
         }, {});*/
 
         var items = selection.selectAll('li')
-            .data(validations);
+            .data(issues);
 
         // Exit
         items.exit()
@@ -130,13 +131,18 @@ export function uiIssues(context) {
             .call(tooltip()
                 .html(true)
                 .title(function(d) {
-                    var tip = d.tooltip;
+                    var tip = d.tooltip ? d.tooltip : '';
                     return uiTooltipHtml(tip);
                 })
                 .placement('bottom')
             )
             .on('click', function(d) {
-                context.enter(modeSelect(context, [d.entity.id]));
+                if (d.entities) {
+                    context.enter(modeSelect(
+                        context,
+                        _map(d.entities, function(e) { return e.id; })
+                    ));
+                }
             });
 
         var label = enter