diff options
| -rw-r--r-- | app/assets/javascripts/diffs/components/compare_versions_dropdown.vue | 2 | ||||
| -rw-r--r-- | app/assets/javascripts/lib/utils/datetime_utility.js | 46 |
2 files changed, 16 insertions, 32 deletions
diff --git a/app/assets/javascripts/diffs/components/compare_versions_dropdown.vue b/app/assets/javascripts/diffs/components/compare_versions_dropdown.vue index 561188c1e8f..80aec84f574 100644 --- a/app/assets/javascripts/diffs/components/compare_versions_dropdown.vue +++ b/app/assets/javascripts/diffs/components/compare_versions_dropdown.vue @@ -141,7 +141,7 @@ export default { <time-ago v-if="version.created_at" :time="version.created_at" - class="js-timeago js-timeago-render" + class="js-timeago" /> </small> </div> diff --git a/app/assets/javascripts/lib/utils/datetime_utility.js b/app/assets/javascripts/lib/utils/datetime_utility.js index 5bb2efdb18d..4b8f11ba7a6 100644 --- a/app/assets/javascripts/lib/utils/datetime_utility.js +++ b/app/assets/javascripts/lib/utils/datetime_utility.js @@ -133,44 +133,28 @@ export const getTimeago = () => { }; /** - * For the given element, renders a timeago instance. - * @param {jQuery} $els - */ -export const renderTimeago = $els => { - const timeagoEls = $els || document.querySelectorAll('.js-timeago-render'); - - // timeago.js sets timeouts internally for each timeago value to be updated in real time - getTimeago().render(timeagoEls, timeagoLanguageCode); -}; - -/** - * For the given elements, will add timeago tooltips - */ -export const addTimeAgoTooltip = () => { - const timeagoEls = document.querySelectorAll('.js-timeago-render'); - timeagoEls.forEach(element => { - $(element).tooltip({ - template: - '<div class="tooltip local-timeago" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>', - }); - }); -}; - -/** * For the given elements, sets a tooltip with a formatted date. - * @param {jQuery} + * @param {JQuery} $timeagoEls * @param {Boolean} setTimeago */ export const localTimeAgo = ($timeagoEls, setTimeago = true) => { - $timeagoEls.each((i, el) => { - el.classList.add('js-timeago-render'); - }); + getTimeago().render($timeagoEls, timeagoLanguageCode); - renderTimeago($timeagoEls); + if (!setTimeago) { + return; + } - if (setTimeago) { - requestIdleCallback(addTimeAgoTooltip); + function addTimeAgoTooltip() { + $timeagoEls.each((i, el) => { + // Recreate with custom template + $(el).tooltip({ + template: + '<div class="tooltip local-timeago" role="tooltip"><div class="arrow"></div><div class="tooltip-inner"></div></div>', + }); + }); } + + requestIdleCallback(addTimeAgoTooltip); }; /** |