From 491f4ff27d1665a260c26d98999964c7e953756e Mon Sep 17 00:00:00 2001 From: Michael Lange Date: Tue, 26 Sep 2017 11:57:46 -0700 Subject: [PATCH] Fix the links in table rows bug Click events were greedily redirecting to the resource pages instead of first yielding to the anchor tag clicked if an anchor tag was in fact clicked. --- ui/app/components/allocation-row.js | 3 ++- ui/app/components/client-node-row.js | 3 ++- ui/app/components/job-row.js | 3 ++- ui/app/components/server-agent-row.js | 4 +++- ui/app/components/task-group-row.js | 3 ++- ui/app/helpers/lazy-click.js | 19 +++++++++++++++++++ 6 files changed, 30 insertions(+), 5 deletions(-) create mode 100644 ui/app/helpers/lazy-click.js diff --git a/ui/app/components/allocation-row.js b/ui/app/components/allocation-row.js index c6bf62788..415d5f3fe 100644 --- a/ui/app/components/allocation-row.js +++ b/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]); }, }); diff --git a/ui/app/components/client-node-row.js b/ui/app/components/client-node-row.js index ed4c47dfc..e2f9dd19c 100644 --- a/ui/app/components/client-node-row.js +++ b/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() { diff --git a/ui/app/components/job-row.js b/ui/app/components/job-row.js index 1ac98b43d..024f8d6c1 100644 --- a/ui/app/components/job-row.js +++ b/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() { diff --git a/ui/app/components/server-agent-row.js b/ui/app/components/server-agent-row.js index 5fbb6832f..f853ada96 100644 --- a/ui/app/components/server-agent-row.js +++ b/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]); }, }); diff --git a/ui/app/components/task-group-row.js b/ui/app/components/task-group-row.js index e23541e9c..4fb239637 100644 --- a/ui/app/components/task-group-row.js +++ b/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]); }, }); diff --git a/ui/app/helpers/lazy-click.js b/ui/app/helpers/lazy-click.js new file mode 100644 index 000000000..f9d12dcd2 --- /dev/null +++ b/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);