Extract all calls to AP to utils

Use safe programming to avoid dependancy on the AP
global object. This should allow us to render the Jira
connect app independently of the Jira iframe.

app/assets/javascripts/jira_connect/api.js

 import axios from 'axios';
-
-export const getJwt = () => {
-  return new Promise((resolve) => {
-    AP.context.getToken((token) => {
-      resolve(token);
-    });
-  });
-};
-
-export const getLocation = () => {
-  return new Promise((resolve) => {
-    if (typeof AP.getLocation !== 'function') {
-      resolve();
-    }
-
-    AP.getLocation((location) => {
-      resolve(location);
-    });
-  });
-};
+import { getJwt } from '~/jira_connect/utils';
 
 export const addSubscription = async (addPath, namespace) => {
   const jwt = await getJwt();

app/assets/javascripts/jira_connect/components/app.vue

 <script>
 import { GlAlert, GlButton, GlLink, GlModal, GlModalDirective, GlSprintf } from '@gitlab/ui';
 import { mapState, mapMutations } from 'vuex';
-import { getLocation } from '~/jira_connect/api';
+import { retrieveAlert, getLocation } from '~/jira_connect/utils';
 import { __ } from '~/locale';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import { SET_ALERT } from '../store/mutation_types';
-import { retrieveAlert } from '../utils';
 import GroupsList from './groups_list.vue';
 import SubscriptionsList from './subscriptions_list.vue';
 

app/assets/javascripts/jira_connect/components/groups_list_item.vue

@@ -2,8 +2,8 @@
 import { GlAvatar, GlButton, GlIcon } from '@gitlab/ui';
 import { helpPagePath } from '~/helpers/help_page_helper';
 import { addSubscription } from '~/jira_connect/api';
+import { persistAlert, reloadPage } from '~/jira_connect/utils';
 import { s__ } from '~/locale';
-import { persistAlert } from '../utils';
 import GroupItemName from './group_item_name.vue';
 
 export default {
@@ -49,7 +49,7 @@ export default {
             variant: 'success',
           });
 
-          AP.navigator.reload();
+          reloadPage();
         })
         .catch((error) => {
           this.$emit(

app/assets/javascripts/jira_connect/index.js

 import setConfigs from '@gitlab/ui/dist/config';
 import Vue from 'vue';
 import { addSubscription, removeSubscription, getLocation } from '~/jira_connect/api';
+import { reloadPage, sizeToParent } from '~/jira_connect/utils';
 import GlFeatureFlagsPlugin from '~/vue_shared/gl_feature_flags_plugin';
 import Translate from '~/vue_shared/translate';
 
@@ -10,10 +11,6 @@ import { SET_ALERT } from './store/mutation_types';
 
 const store = createStore();
 
-const reqComplete = () => {
-  AP.navigator.reload();
-};
-
 const reqFailed = (res, fallbackErrorMessage) => {
   const { error = fallbackErrorMessage } = res || {};
 
@@ -35,7 +32,7 @@ const initRemoveSubscriptionButtonHandlers = () => {
 
       const removePath = e.target.getAttribute('href');
       removeSubscription(removePath)
-        .then(reqComplete)
+        .then(reloadPage)
         .catch((err) =>
           reqFailed(err.response.data, 'Failed to remove namespace. Please try again.'),
         );
@@ -56,7 +53,7 @@ const initAddSubscriptionFormHandler = () => {
     const namespace = (e.target.querySelector('#namespace-input') || {}).value;
 
     addSubscription(addPath, namespace)
-      .then(reqComplete)
+      .then(reloadPage)
       .catch((err) => reqFailed(err.response.data, 'Failed to add namespace. Please try again.'));
   });
 };
@@ -77,7 +74,7 @@ export async function initJiraConnect() {
   Vue.use(GlFeatureFlagsPlugin);
 
   const { groupsPath, subscriptions, subscriptionsPath, usersPath } = el.dataset;
-  AP.sizeToParent();
+  sizeToParent();
 
   return new Vue({
     el,

app/assets/javascripts/jira_connect/utils.js

+import { isFunction } from 'lodash';
 import AccessorUtilities from '~/lib/utils/accessor';
 import { ALERT_LOCALSTORAGE_KEY } from './constants';
 
@@ -31,3 +32,41 @@ export const retrieveAlert = () => {
 
   return JSON.parse(initialAlertJSON);
 };
+
+export const getJwt = () => {
+  return new Promise((resolve) => {
+    if (isFunction(AP?.context?.getToken)) {
+      AP.context.getToken((token) => {
+        resolve(token);
+      });
+    } else {
+      resolve();
+    }
+  });
+};
+
+export const getLocation = () => {
+  return new Promise((resolve) => {
+    if (isFunction(AP?.getLocation)) {
+      AP.getLocation((location) => {
+        resolve(location);
+      });
+    } else {
+      resolve();
+    }
+  });
+};
+
+export const reloadPage = () => {
+  if (isFunction(AP?.navigator?.reload)) {
+    AP.navigator.reload();
+  } else {
+    window.location.reload();
+  }
+};
+
+export const sizeToParent = () => {
+  if (isFunction(AP?.sizeToParent)) {
+    AP.sizeToParent();
+  }
+};