1 files changed, 9 insertions, 13 deletions
diff --git a/app/assets/javascripts/groups/init_transfer_group_form.js b/app/assets/javascripts/groups/init_transfer_group_form.js
index f055b926918..503dad673dd 100644
--- a/app/assets/javascripts/groups/init_transfer_group_form.js
+++ b/app/assets/javascripts/groups/init_transfer_group_form.js
@@ -1,42 +1,38 @@
 import Vue from 'vue';
+import VueApollo from 'vue-apollo';
+import createDefaultClient from '~/lib/graphql';
 import { sprintf } from '~/locale';
 import { parseBoolean } from '~/lib/utils/common_utils';
 import TransferGroupForm, { i18n } from './components/transfer_group_form.vue';
 
-const prepareGroups = (rawGroups) => {
-  if (!rawGroups) {
-    return [];
-  }
-
-  return JSON.parse(rawGroups).map(({ id, text: humanName }) => ({
-    id,
-    humanName,
-  }));
-};
-
 export default () => {
   const el = document.querySelector('.js-transfer-group-form');
   if (!el) {
     return false;
   }
 
+  Vue.use(VueApollo);
+
   const {
     targetFormId = null,
     buttonText: confirmButtonText = '',
     groupName = '',
-    parentGroups,
+    groupId: resourceId,
     isPaidGroup,
   } = el.dataset;
 
   return new Vue({
     el,
+    apolloProvider: new VueApollo({
+      defaultClient: createDefaultClient(),
+    }),
     provide: {
       confirmDangerMessage: sprintf(i18n.confirmationMessage, { group_name: groupName }),
+      resourceId,
     },
     render(createElement) {
       return createElement(TransferGroupForm, {
         props: {
-          groupNamespaces: prepareGroups(parentGroups),
           isPaidGroup: parseBoolean(isPaidGroup),
           confirmButtonText,
           confirmationPhrase: groupName,