1 files changed, 45 insertions, 2 deletions

diff --git a/app/assets/javascripts/layout_nav.js b/app/assets/javascripts/layout_nav.js
index f5078962b8f..42682d9b79f 100644
--- a/app/assets/javascripts/layout_nav.js
+++ b/app/assets/javascripts/layout_nav.js
@@ -16,6 +16,21 @@ export function initScrollingTabs() {
   const $scrollingTabs = $('.scrolling-tabs').not('.is-initialized');
   $scrollingTabs.addClass('is-initialized');
 
+  const el = $scrollingTabs.get(0);
+  const parentElement = el?.parentNode;
+  if (el && parentElement) {
+    parentElement
+      .querySelector('button.fade-left')
+      ?.addEventListener('click', function scrollLeft() {
+        el.scrollBy({ left: -200, behavior: 'smooth' });
+      });
+    parentElement
+      .querySelector('button.fade-right')
+      ?.addEventListener('click', function scrollRight() {
+        el.scrollBy({ left: 200, behavior: 'smooth' });
+      });
+  }
+
   $(window)
     .on('resize.nav', () => {
       hideEndFade($scrollingTabs);
@@ -49,9 +64,31 @@ export function initScrollingTabs() {
   });
 }
 
-function initDeferred() {
-  initScrollingTabs();
+function initInviteMembers() {
+  const modalEl = document.querySelector('.js-invite-members-modal');
+  if (!modalEl) return;
+
+  import(
+    /* webpackChunkName: 'initInviteMembersModal' */ '~/invite_members/init_invite_members_modal'
+  )
+    .then(({ default: initInviteMembersModal }) => {
+      initInviteMembersModal();
+    })
+    .catch(() => {});
+
+  const inviteTriggers = document.querySelectorAll('.js-invite-members-trigger');
+  if (!inviteTriggers) return;
 
+  import(
+    /* webpackChunkName: 'initInviteMembersTrigger' */ '~/invite_members/init_invite_members_trigger'
+  )
+    .then(({ default: initInviteMembersTrigger }) => {
+      initInviteMembersTrigger();
+    })
+    .catch(() => {});
+}
+
+function initWhatsNewComponent() {
   const appEl = document.getElementById('whats-new-app');
   if (!appEl) return;
 
@@ -69,6 +106,12 @@ function initDeferred() {
   });
 }
 
+function initDeferred() {
+  initScrollingTabs();
+  initWhatsNewComponent();
+  initInviteMembers();
+}
+
 export default function initLayoutNav() {
   if (!gon.use_new_navigation) {
     const contextualSidebar = new ContextualSidebar();