Update EE dispatcher routes to be dynamic imports

https://gitlab.com/gitlab-org/gitlab-ce/issues/41341

app/assets/javascripts/dispatcher.js

@@ -6,14 +6,6 @@ import GlFieldErrors from './gl_field_errors';
 import Shortcuts from './shortcuts';
 import SearchAutocomplete from './search_autocomplete';
 
-// EE-only
-import UsersSelect from './users_select';
-import UserCallout from './user_callout';
-import ZenMode from './zen_mode';
-import initGeoInfoModal from 'ee/init_geo_info_modal'; // eslint-disable-line import/first
-import initPathLocks from 'ee/path_locks'; // eslint-disable-line import/first
-import initApprovals from 'ee/approvals'; // eslint-disable-line import/first
-
 var Dispatcher;
 
 (function() {
@@ -620,50 +612,57 @@ var Dispatcher;
       }
 
       // EE-only route-based code
-      function initBlobEE() {
-        const dataEl = document.getElementById('js-file-lock');
-
-        if (dataEl) {
-          const {
-            toggle_path,
-            path,
-           } = JSON.parse(dataEl.innerHTML);
-
-          initPathLocks(toggle_path, path);
-        }
-      }
 
       switch (page) {
         case 'groups:epics:show':
-          new ZenMode();
+          import(/* webpackChunkName: "ee_epics_show" */ 'ee/pages/groups/epics/show')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'groups:epics:index':
-          import(/* webpackChunkName: "ee_epics_index" */ 'ee/pages/epics')
+          import(/* webpackChunkName: "ee_epics_index" */ 'ee/pages/groups/epics/index')
             .then(callDefault)
             .catch(fail);
           break;
         case 'projects:milestones:show':
+          import(/* webpackChunkName: "ee_projects_milestones_show" */ 'ee/pages/projects/milestones/show')
+            .then(callDefault)
+            .catch(fail);
+          break;
         case 'search:show':
-          new UserCallout();
+          import(/* webpackChunkName: "ee_search_show" */ 'ee/pages/search/show')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'projects:merge_requests:creations:new':
-          new UserCallout();
-          initApprovals();
+          import(/* webpackChunkName: "ee_merge_requests_creations_new" */ 'ee/pages/projects/merge_requests/creations/new')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'projects:merge_requests:creations:diffs':
+          import(/* webpackChunkName: "ee_merge_requests_creations_diffs" */ 'ee/pages/projects/merge_requests/creations/diffs')
+            .then(callDefault)
+            .catch(fail);
+          break;
         case 'projects:merge_requests:edit':
-          initApprovals();
+          import(/* webpackChunkName: "ee_merge_requests_edit" */ 'ee/pages/projects/merge_requests/edit')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'projects:show':
-          initGeoInfoModal();
+          import(/* webpackChunkName: "ee_projects_show" */ 'ee/pages/projects/show')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'projects:blob:show':
-        case 'projects:blame:show':
-          initBlobEE();
+          import(/* webpackChunkName: "ee_projects_blob_show" */ 'ee/pages/projects/blob/show')
+            .then(callDefault)
+            .catch(fail);
           break;
-        case 'projects:mirrors:show':
-        case 'projects:mirrors:update':
-          new UsersSelect();
+        case 'projects:blame:show':
+          import(/* webpackChunkName: "ee_projects_blame_show" */ 'ee/pages/projects/blame/show')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'admin:emails:show':
           import(/* webpackChunkName: "ee_admin_emails_show" */ 'ee/pages/admin/emails/show').then(m => m.default()).catch(fail);
@@ -672,8 +671,9 @@ var Dispatcher;
           import(/* webpackChunkName: "ee_audit_logs" */ 'ee/pages/admin/audit_logs').then(m => m.default()).catch(fail);
           break;
         case 'projects:settings:repository:show':
-          new UsersSelect();
-          new UserCallout();
+          import(/* webpackChunkName: "ee_projects_settings_repository_show" */ 'ee/pages/projects/settings/repository/show')
+            .then(callDefault)
+            .catch(fail);
           break;
         case 'admin:licenses:new':
           import(/* webpackChunkName: "admin_licenses" */ 'ee/pages/admin/licenses/new').then(m => m.default()).catch(fail);
@@ -691,10 +691,25 @@ var Dispatcher;
         case 'admin:groups:edit':
           import(/* webpackChunkName: "ee_admin_groups_edit" */ 'ee/pages/admin/groups/edit').then(m => m.default()).catch(fail);
           break;
-        case 'admin:geo_nodes':
-          import(/* webpackChunkName: 'geo_node_form' */ './geo/geo_node_form')
-            .then(geoNodeForm => geoNodeForm.default($('.js-geo-node-form')))
-            .catch(() => {});
+        case 'admin:geo_nodes:new':
+          import(/* webpackChunkName: 'ee_admin_geo_nodes_new' */ 'ee/pages/admin/geo_nodes/new')
+            .then(callDefault)
+            .catch(fail);
+          break;
+        case 'admin:geo_nodes:create':
+          import(/* webpackChunkName: 'ee_admin_geo_nodes_create' */ 'ee/pages/admin/geo_nodes/create')
+            .then(callDefault)
+            .catch(fail);
+          break;
+        case 'admin:geo_nodes:edit':
+          import(/* webpackChunkName: 'ee_admin_geo_nodes_edit' */ 'ee/pages/admin/geo_nodes/edit')
+            .then(callDefault)
+            .catch(fail);
+          break;
+        case 'admin:geo_nodes:update':
+          import(/* webpackChunkName: 'ee_admin_geo_nodes_update' */ 'ee/pages/admin/geo_nodes/update')
+            .then(callDefault)
+            .catch(fail);
           break;
       }
 

ee/app/assets/javascripts/pages/admin/geo_nodes/create/index.js

+import initForm from '../shared/init_form';
+
+export default () => initForm();

ee/app/assets/javascripts/pages/admin/geo_nodes/edit/index.js

+import initForm from '../shared/init_form';
+
+export default () => initForm();

ee/app/assets/javascripts/pages/admin/geo_nodes/new/index.js

+import initForm from '../shared/init_form';
+
+export default () => initForm();

app/assets/javascripts/geo/geo_node_form.js → ee/app/assets/javascripts/pages/admin/geo_nodes/shared/init_form.js

 /* global Flash */
 import {
   s__,
-} from '../locale';
-import '../flash';
-import Api from '../api';
+} from '~/locale';
+import '~/flash';
+import Api from '~/api';
 
 const onPrimaryCheckboxChange = function onPrimaryCheckboxChange(e, $namespaces) {
   const $namespacesSelect = $('.select2', $namespaces);
@@ -17,7 +17,8 @@ const onSelectiveSyncTypeChange = function onSelectiveSyncTypeChange(e, $byNames
   $byShards.toggleClass('hidden', e.target.value !== 'shards');
 };
 
-export default function geoNodeForm($container) {
+export default function geoNodeForm() {
+  const $container = $('.js-geo-node-form');
   const $namespaces = $('.js-hide-if-geo-primary', $container);
   const $primaryCheckbox = $('input[type="checkbox"]', $container);
   const $selectiveSyncTypeSelect = $('.js-geo-node-selective-sync-type', $container);

ee/app/assets/javascripts/pages/admin/geo_nodes/update/index.js

+import initForm from '../shared/init_form';
+
+export default () => initForm();

ee/app/assets/javascripts/pages/groups/epics/show/index.js

+import ZenMode from '~/zen_mode';
+
+export default () => new ZenMode();

ee/app/assets/javascripts/pages/projects/blame/show/index.js

+import initBlob from '../../shared/init_blob';
+
+export default () => initBlob();

ee/app/assets/javascripts/pages/projects/blob/show/index.js

+import initBlob from '../../shared/init_blob';
+
+export default () => initBlob();

ee/app/assets/javascripts/pages/projects/merge_requests/creations/diffs/index.js

+import initForm from '../../shared/init_form';
+
+export default () => initForm();

ee/app/assets/javascripts/pages/projects/merge_requests/creations/new/index.js

+import UserCallout from '~/user_callout';
+import initForm from '../../shared/init_form';
+
+export default () => {
+  initForm();
+  return new UserCallout();
+};

ee/app/assets/javascripts/pages/projects/merge_requests/edit/index.js

+import initForm from '../shared/init_form';
+
+export default () => initForm();

ee/app/assets/javascripts/pages/projects/merge_requests/shared/init_form.js

+import initApprovals from '../../../../approvals';
+
+export default () => initApprovals();

ee/app/assets/javascripts/pages/projects/milestones/show/index.js

+import UserCallout from '~/user_callout';
+
+export default () => new UserCallout();

ee/app/assets/javascripts/pages/projects/settings/repository/show/index.js

+import UsersSelect from '~/users_select';
+import UserCallout from '~/user_callout';
+
+export default () => {
+  new UsersSelect(); // eslint-disable-line no-new
+  new UserCallout(); // eslint-disable-line no-new
+};

ee/app/assets/javascripts/pages/projects/shared/init_blob.js

+import initPathLocks from '../../../path_locks';
+
+export default () => {
+  const dataEl = document.getElementById('js-file-lock');
+
+  if (dataEl) {
+    const {
+      toggle_path,
+      path,
+     } = JSON.parse(dataEl.innerHTML);
+
+    initPathLocks(toggle_path, path);
+  }
+};

ee/app/assets/javascripts/pages/projects/show/index.js

+import initGeoInfoModal from '../../../init_geo_info_modal';
+
+export default () => initGeoInfoModal();

ee/app/assets/javascripts/pages/search/show/index.js

+import UserCallout from '~/user_callout';
+
+export default () => new UserCallout();