Sep CE from EE through inher

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

 import initForm from '../form';
+import PushPull from './push_pull';
 
-document.addEventListener('DOMContentLoaded', initForm);
+document.addEventListener('DOMContentLoaded', () => {
+  initForm();
+
+  const pushPullContainer = document.querySelector('.js-mirror-settings');
+  if (pushPullContainer) new PushPull(pushPullContainer).init();
+});

app/assets/javascripts/pages/projects/settings/repository/show/push_pull.js

+import $ from 'jquery';
+import _ from 'underscore';
+import { __ } from '~/locale';
+import Flash from '~/flash';
+import axios from '~/lib/utils/axios_utils';
+
+export default class PushPull {
+  constructor(container) {
+    this.$container = $(container);
+    this.$form = $('.js-mirror-form', this.$container);
+    this.$urlInput = $('.js-mirror-url', this.$form);
+    this.$protectedBranchesInput = $('.js-mirror-protected', this.$form);
+    this.mirrorEndpoint = this.$form.data('projectMirrorEndpoint');
+    this.$table = $('.js-mirrors-table-body', this.$container);
+  }
+
+  init() {
+    this.registerUpdateListeners();
+
+    this.$table.on('click', '.js-delete-mirror', this.deleteMirror.bind(this));
+  }
+
+  updateUrl() {
+    $('.js-mirror-url-hidden', this.$form).val(this.$urlInput.val());
+  }
+
+  updateProtectedBranches() {
+    const val = this.$protectedBranchesInput.get(0).checked
+      ? this.$protectedBranchesInput.val()
+      : '0';
+    $('.js-mirror-protected-hidden', this.$form).val(val);
+  }
+
+  registerUpdateListeners() {
+    this.$urlInput.on('change', () => this.updateUrl());
+    this.$protectedBranchesInput.on('change', () => this.updateProtectedBranches());
+  }
+
+  deleteMirror(event, existingPayload) {
+    const $target = $(event.currentTarget);
+    let payload = existingPayload;
+
+    if (!payload) {
+      payload = {
+        project: {
+          remote_mirrors_attributes: {
+            id: $target.data('mirrorId'),
+            enabled: 0,
+          },
+        },
+      };
+    }
+
+    return axios
+      .put(this.mirrorEndpoint, payload)
+      .then(() => this.removeRow($target))
+      .catch(() => Flash(__('Failed to remove mirror.')));
+  }
+
+  /* eslint-disable class-methods-use-this */
+  removeRow($target) {
+    const row = $target.closest('tr');
+    $('.js-delete-mirror', row).tooltip('hide');
+    row.remove();
+  }
+  /* eslint-enable class-methods-use-this */
+}

ee/app/assets/javascripts/pages/projects/settings/repository/show/push_pull.js → ee/app/assets/javascripts/pages/projects/settings/repository/show/ee_push_pull.js

 import $ from 'jquery';
-import _ from 'underscore';
-import MirrorPull from 'ee/mirrors/mirror_pull';
 import { __ } from '~/locale';
 import Flash from '~/flash';
-import axios from '~/lib/utils/axios_utils';
+import PushPull from '~/pages/projects/settings/repository/show/push_pull';
+import MirrorPull from 'ee/mirrors/mirror_pull';
+
+export default class EEPushPull extends PushPull {
+  constructor(...args) {
+    super(...args);
 
-export default {
-  init(container) {
-    this.$container = $(container);
-    this.$form = $('.js-mirror-form', this.$container);
     this.$mirrorDirectionSelect = $('.js-mirror-direction', this.$form);
     this.$insertionPoint = $('.js-form-insertion-point', this.$form);
-    this.$urlInput = $('.js-mirror-url', this.$form);
-    this.$protectedBranchesInput = $('.js-mirror-protected', this.$form);
-    this.mirrorEndpoint = this.$form.data('projectMirrorEndpoint');
-    this.$table = $('.js-mirrors-table-body', this.$container);
     this.$repoCount = $('.js-mirrored-repo-count', this.$container);
-    this.trTemplate = _.template($('.js-tr-template', this.$container).html());
-
     this.directionFormMap = {
       push: $('.js-push-mirrors-form', this.$form).html(),
       pull: $('.js-pull-mirrors-form', this.$form).html(),
     };
+  }
 
+  init() {
     this.handleUpdate();
-    this.registerUpdateListeners();
-
-    this.$table.on('click', '.js-delete-mirror', this.deleteMirror.bind(this));
-  },
+    super.init();
+  }
 
   handleUpdate() {
     return this.hideForm()
@@ -39,16 +32,15 @@ export default {
       .catch(() => {
         Flash(__('Something went wrong on our end.'));
       });
-  },
+  }
 
   hideForm() {
-    return new Promise((resolve) => {
+    return new Promise(resolve => {
       if (!this.$insertionPoint.hasClass('in')) return resolve();
 
-      return this.$insertionPoint.collapse('hide')
-        .one('hidden.bs.collapse', () => resolve());
+      return this.$insertionPoint.collapse('hide').one('hidden.bs.collapse', () => resolve());
     });
-  },
+  }
 
   updateForm() {
     const direction = this.$mirrorDirectionSelect.val();
@@ -58,19 +50,8 @@ export default {
     this.updateUrl();
     this.updateProtectedBranches();
 
-    if (direction !== 'pull') return;
-
-    this.initMirrorPull();
-  },
-
-  updateUrl() {
-    $('.js-mirror-url-hidden', this.$form).val(this.$urlInput.val());
-  },
-
-  updateProtectedBranches() {
-    const val = this.$protectedBranchesInput.get(0).checked ? this.$protectedBranchesInput.val() : '0';
-    $('.js-mirror-protected-hidden', this.$form).val(val);
-  },
+    if (direction === 'pull') this.initMirrorPull();
+  }
 
   initMirrorPull() {
     const mirrorPull = new MirrorPull('.js-mirror-form');
@@ -79,45 +60,40 @@ export default {
     mirrorPull.init();
 
     this.initSelect2();
-  },
+  }
 
   initSelect2() {
     $('.js-mirror-user', this.$form).select2({
       width: 'resolve',
       dropdownAutoWidth: true,
     });
-  },
+  }
 
   registerUpdateListeners() {
+    super.registerUpdateListeners();
     this.$mirrorDirectionSelect.on('change', () => this.handleUpdate());
-    this.$urlInput.on('change', () => this.updateUrl());
-    this.$protectedBranchesInput.on('change', () => this.updateProtectedBranches());
-  },
+  }
 
   deleteMirror(event) {
     const $target = $(event.currentTarget);
     const isPullMirror = $target.hasClass('js-delete-pull-mirror');
-    const payload = { project: {} };
+    let payload;
 
     if (isPullMirror) {
-      payload.project.mirror = false;
-    } else {
-      payload.project = {
-        remote_mirrors_attributes: {
-          id: $target.data('mirrorId'),
-          enabled: 0,
+      payload = {
+        project: {
+          mirror: false,
         },
       };
     }
 
-    return axios.put(this.mirrorEndpoint, payload)
-      .then(() => {
-        const row = $target.closest('tr');
-        $('.js-delete-mirror', row).tooltip('hide');
-        row.remove();
+    super.deleteMirror(event, payload);
+  }
+
+  removeRow($target) {
+    super.removeRow($target);
+
     const currentCount = parseInt(this.$repoCount.text().replace(/(\(|\))/, ''), 10);
     this.$repoCount.text(`(${currentCount - 1})`);
-      })
-      .catch(() => Flash(__('Failed to remove mirror.')));
-  },
-};
+  }
+}

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

@@ -13,7 +13,7 @@ import CEProtectedBranchEditList from '~/protected_branches/protected_branch_edi
 import CEProtectedTagCreate from '~/protected_tags/protected_tag_create';
 import CEProtectedTagEditList from '~/protected_tags/protected_tag_edit_list';
 import DueDateSelectors from '~/due_date_select';
-import PushPull from './push_pull';
+import EEPushPull from './ee_push_pull';
 
 document.addEventListener('DOMContentLoaded', () => {
   new UsersSelect();
@@ -37,8 +37,7 @@ document.addEventListener('DOMContentLoaded', () => {
   }
 
   const pushPullContainer = document.querySelector('.js-mirror-settings');
-
-  if (pushPullContainer) PushPull.init(pushPullContainer);
+  if (pushPullContainer) new EEPushPull(pushPullContainer).init();
 
   new DueDateSelectors();
 });