diff options
author | Dennis Tang <750946-dennis@users.noreply.gitlab.com> | 2019-08-05 12:00:34 +0300 |
---|---|---|
committer | Kushal Pandya <kushalspandya@gmail.com> | 2019-08-05 12:00:34 +0300 |
commit | 4f12a4dde1aac5c5c7fa83e42180d01a1fdb5b30 (patch) | |
tree | 35ab4588496416a20f15f27bf4cb0e6b1c0d784e /app/assets/javascripts/persistent_user_callout.js | |
parent | f74387d2982845b0fb5219ccf3fd128d75400472 (diff) |
Add support for deferred links in persistent user callouts
Persistent user callouts now support deferred links, which are links
that can be used to dismiss the callout, and then proceed to follow
the link's original location.
This ensures that the callout dismissal is properly recorded
before the user leaves the page.
Diffstat (limited to 'app/assets/javascripts/persistent_user_callout.js')
-rw-r--r-- | app/assets/javascripts/persistent_user_callout.js | 25 |
1 files changed, 23 insertions, 2 deletions
diff --git a/app/assets/javascripts/persistent_user_callout.js b/app/assets/javascripts/persistent_user_callout.js index 4a08e158f6b..8d6a3781048 100644 --- a/app/assets/javascripts/persistent_user_callout.js +++ b/app/assets/javascripts/persistent_user_callout.js @@ -1,13 +1,17 @@ +import { parseBoolean } from './lib/utils/common_utils'; import axios from './lib/utils/axios_utils'; import { __ } from './locale'; import Flash from './flash'; +const DEFERRED_LINK_CLASS = 'deferred-link'; + export default class PersistentUserCallout { constructor(container) { - const { dismissEndpoint, featureId } = container.dataset; + const { dismissEndpoint, featureId, deferLinks } = container.dataset; this.container = container; this.dismissEndpoint = dismissEndpoint; this.featureId = featureId; + this.deferLinks = parseBoolean(deferLinks); this.init(); } @@ -15,9 +19,21 @@ export default class PersistentUserCallout { init() { const closeButton = this.container.querySelector('.js-close'); closeButton.addEventListener('click', event => this.dismiss(event)); + + if (this.deferLinks) { + this.container.addEventListener('click', event => { + const isDeferredLink = event.target.classList.contains(DEFERRED_LINK_CLASS); + + if (isDeferredLink) { + const { href, target } = event.target; + + this.dismiss(event, { href, target }); + } + }); + } } - dismiss(event) { + dismiss(event, deferredLinkOptions = null) { event.preventDefault(); axios @@ -26,6 +42,11 @@ export default class PersistentUserCallout { }) .then(() => { this.container.remove(); + + if (deferredLinkOptions) { + const { href, target } = deferredLinkOptions; + window.open(href, target); + } }) .catch(() => { Flash(__('An error occurred while dismissing the alert. Refresh the page and try again.')); |