Merge pull request #3280 from hashicorp/b-ui-links-in-tables

Links in table rows should get click priority over table rows

ui/app/components/allocation-row.js

@@ -1,4 +1,5 @@
 import Ember from 'ember';
+import { lazyClick } from '../helpers/lazy-click';
 
 const { Component } = Ember;
 
@@ -15,6 +16,6 @@ export default Component.extend({
   onClick() {},
 
   click(event) {
-    this.get('onClick')(event);
+    lazyClick([this.get('onClick'), event]);
   },
 });

ui/app/components/client-node-row.js

@@ -1,4 +1,5 @@
 import Ember from 'ember';
+import { lazyClick } from '../helpers/lazy-click';
 
 const { Component } = Ember;
 
@@ -11,7 +12,7 @@ export default Component.extend({
   onClick() {},
 
   click(event) {
-    this.get('onClick')(event);
+    lazyClick([this.get('onClick'), event]);
   },
 
   didReceiveAttrs() {

ui/app/components/job-row.js

@@ -1,4 +1,5 @@
 import Ember from 'ember';
+import { lazyClick } from '../helpers/lazy-click';
 
 const { Component } = Ember;
 
@@ -11,7 +12,7 @@ export default Component.extend({
   onClick() {},
 
   click(event) {
-    this.get('onClick')(event);
+    lazyClick([this.get('onClick'), event]);
   },
 
   didReceiveAttrs() {

ui/app/components/server-agent-row.js

@@ -1,4 +1,5 @@
 import Ember from 'ember';
+import { lazyClick } from '../helpers/lazy-click';
 
 const { Component, inject, computed } = Ember;
 
@@ -28,6 +29,7 @@ export default Component.extend({
   }),
 
   click() {
-    this.get('router').transitionTo('servers.server', this.get('agent'));
+    const transition = () => this.get('router').transitionTo('servers.server', this.get('agent'));
+    lazyClick([transition, event]);
   },
 });

ui/app/components/task-group-row.js

@@ -1,4 +1,5 @@
 import Ember from 'ember';
+import { lazyClick } from '../helpers/lazy-click';
 
 const { Component } = Ember;
 
@@ -12,6 +13,6 @@ export default Component.extend({
   onClick() {},
 
   click(event) {
-    this.get('onClick')(event);
+    lazyClick([this.get('onClick'), event]);
   },
 });

ui/app/helpers/lazy-click.js

@@ -0,0 +1,19 @@
+import Ember from 'ember';
+
+const { Helper, $ } = Ember;
+
+/**
+ * Lazy Click Event
+ *
+ * Usage: {{lazy-click action}}
+ *
+ * Calls the provided action only if the target isn't an anchor
+ * that should be handled instead.
+ */
+export function lazyClick([onClick, event]) {
+  if (!$(event.target).is('a')) {
+    onClick(event);
+  }
+}
+
+export default Helper.helper(lazyClick);

ui/app/templates/nodes/node.hbs

@@ -69,7 +69,7 @@
         Attributes
       </div>
       <div class="boxed-section-body is-full-bleed">
-        {{attributes-table attributes=model.attributes.attributesStructured}}
+        {{attributes-table attributes=model.attributes.attributesStructured class="attributes-table"}}
       </div>
     </div>
   </section>