refactor JS code

app/assets/javascripts/dispatcher.js

@@ -602,21 +602,7 @@ import initGroupAnalytics from './init_group_analytics';
         case 'groups:analytics:show':
           initGroupAnalytics();
           break;
-        case 'admin:groups:edit':
-        case 'groups:ldap_group_links:index':
-          const $cnLink = $('.cn-link');
-          const $filterLink = $('.filter-link');
-
-          const showGroupLink = () => {
-            const $checkedSync = $('input[name="sync_method"]:checked').val() === 'group';
 
-            $cnLink.toggle($checkedSync);
-            $filterLink.toggle(!$checkedSync);
-          };
-
-          $('input[name="sync_method"]').on('change', showGroupLink);
-          showGroupLink();
-          break;
       }
       switch (path[0]) {
         case 'sessions':

app/assets/javascripts/groups/ldap_group_links.js

+document.addEventListener('DOMContentLoaded', () => {
+  const $cnLink = $('.cn-link');
+  const $filterLink = $('.filter-link');
+
+  const showGroupLink = () => {
+    const $checkedSync = $('input[name="sync_method"]:checked').val() === 'group';
+
+    $cnLink.toggle($checkedSync);
+    $filterLink.toggle(!$checkedSync);
+  };
+
+  $('input[name="sync_method"]').on('change', showGroupLink);
+  showGroupLink();
+});

app/views/ldap_group_links/_form.html.haml

+- content_for :page_specific_javascripts do
+  = webpack_bundle_tag 'ldap_group_links'
 %section.ldap-group-links
   = form_for [group, LdapGroupLink.new], html: { class: 'form-horizontal' } do |f|
     .form-holder

config/webpack.config.js

@@ -53,6 +53,7 @@ var config = {
     issue_show:           './issue_show/index.js',
     integrations:         './integrations',
     job_details:          './jobs/job_details_bundle.js',
+    ldap_group_links:     './groups/ldap_group_links.js',
     locale:               './locale/index.js',
     main:                 './main.js',
     merge_conflicts:      './merge_conflicts/merge_conflicts_bundle.js',