diff --git a/app/assets/javascripts/pages/groups/usage_quotas/index.js b/app/assets/javascripts/pages/groups/usage_quotas/index.js
index d0e29271979a9c5a708d43ccb626748c8a7eb1ef..9984343efb381f2745c1951b8840d3f4f7fad185 100644
--- a/app/assets/javascripts/pages/groups/usage_quotas/index.js
+++ b/app/assets/javascripts/pages/groups/usage_quotas/index.js
@@ -1,4 +1,3 @@
-import initUsageQuotas from '~/usage_quotas';
-import { GROUP_VIEW_TYPE } from '~/usage_quotas/constants';
+import initUsageQuotasGroupView from 'ee_else_ce/usage_quotas/group_view_metadata';
 
-initUsageQuotas(GROUP_VIEW_TYPE);
+initUsageQuotasGroupView();
diff --git a/app/assets/javascripts/pages/profiles/usage_quotas/index.js b/app/assets/javascripts/pages/profiles/usage_quotas/index.js
index a552981c4fb077b7aa04e1a9d8295f8109811ce8..c344faf9f6d4984b2c6e423ddc7a0aca71983bbd 100644
--- a/app/assets/javascripts/pages/profiles/usage_quotas/index.js
+++ b/app/assets/javascripts/pages/profiles/usage_quotas/index.js
@@ -1,4 +1,3 @@
-import initUsageQuotas from '~/usage_quotas';
-import { PROFILE_VIEW_TYPE } from '~/usage_quotas/constants';
+import initUsageQuotasProfileView from 'ee_else_ce/usage_quotas/profile_view_metadata';
 
-initUsageQuotas(PROFILE_VIEW_TYPE);
+initUsageQuotasProfileView();
diff --git a/app/assets/javascripts/pages/projects/usage_quotas/index.js b/app/assets/javascripts/pages/projects/usage_quotas/index.js
index 52dfaf1e22da512f9de41d67247d0dc80c80def6..fe4cb70866a7dfa8a432166ba4c7c546fb013add 100644
--- a/app/assets/javascripts/pages/projects/usage_quotas/index.js
+++ b/app/assets/javascripts/pages/projects/usage_quotas/index.js
@@ -1,4 +1,3 @@
-import initUsageQuotas from '~/usage_quotas';
-import { PROJECT_VIEW_TYPE } from '~/usage_quotas/constants';
+import initUsageQuotasProjectView from 'ee_else_ce/usage_quotas/project_view_metadata';
 
-initUsageQuotas(PROJECT_VIEW_TYPE);
+initUsageQuotasProjectView();
diff --git a/app/assets/javascripts/usage_quotas/group_view_metadata.js b/app/assets/javascripts/usage_quotas/group_view_metadata.js
index 7f00e30528e3c0346eadef227c2d8dfe0291ff62..dd681c130e7bc530dc3a21a40d4b57d4683f1036 100644
--- a/app/assets/javascripts/usage_quotas/group_view_metadata.js
+++ b/app/assets/javascripts/usage_quotas/group_view_metadata.js
@@ -1,6 +1,9 @@
 import { GROUP_VIEW_TYPE } from './constants';
 import { getStorageTabMetadata } from './storage/tab_metadata';
+import { mountUsageQuotasApp } from './utils';
 
-export const usageQuotasTabsMetadata = [
-  getStorageTabMetadata({ viewType: GROUP_VIEW_TYPE }),
-].filter(Boolean);
+const usageQuotasTabsMetadata = [getStorageTabMetadata({ viewType: GROUP_VIEW_TYPE })].filter(
+  Boolean,
+);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);
diff --git a/app/assets/javascripts/usage_quotas/index.js b/app/assets/javascripts/usage_quotas/index.js
deleted file mode 100644
index 4cf67eb92a5211388b907fc41cbcede2b7ef2e4d..0000000000000000000000000000000000000000
--- a/app/assets/javascripts/usage_quotas/index.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import Vue from 'vue';
-import { usageQuotasTabsMetadata as groupViewTabsMetadata } from 'ee_else_ce/usage_quotas/group_view_metadata';
-import { usageQuotasTabsMetadata as profileViewTabsMetadata } from 'ee_else_ce/usage_quotas/profile_view_metadata';
-import { usageQuotasTabsMetadata as projectViewTabsMetadata } from 'ee_else_ce/usage_quotas/project_view_metadata';
-import UsageQuotasApp from './components/usage_quotas_app.vue';
-import { GROUP_VIEW_TYPE, PROJECT_VIEW_TYPE, PROFILE_VIEW_TYPE } from './constants';
-
-const getViewTabs = (viewType) => {
-  if (viewType === GROUP_VIEW_TYPE) {
-    return groupViewTabsMetadata;
-  }
-
-  if (viewType === PROJECT_VIEW_TYPE) {
-    return projectViewTabsMetadata;
-  }
-
-  if (viewType === PROFILE_VIEW_TYPE) {
-    return profileViewTabsMetadata;
-  }
-
-  return false;
-};
-
-export default (viewType) => {
-  const el = document.querySelector('#js-usage-quotas-view');
-  const tabs = getViewTabs(viewType);
-
-  if (!el || !tabs) return false;
-
-  return new Vue({
-    el,
-    name: 'UsageQuotasView',
-    provide: {
-      tabs,
-    },
-    render(createElement) {
-      return createElement(UsageQuotasApp);
-    },
-  });
-};
diff --git a/app/assets/javascripts/usage_quotas/profile_view_metadata.js b/app/assets/javascripts/usage_quotas/profile_view_metadata.js
index cd9af49a54d77dd748b4ef57417e9b68b1292f5b..264eb3b01544f932a0bb783ac5962fd8027ceed7 100644
--- a/app/assets/javascripts/usage_quotas/profile_view_metadata.js
+++ b/app/assets/javascripts/usage_quotas/profile_view_metadata.js
@@ -1,6 +1,9 @@
 import { PROFILE_VIEW_TYPE } from '~/usage_quotas/constants';
 import { getStorageTabMetadata } from '~/usage_quotas/storage/tab_metadata';
+import { mountUsageQuotasApp } from './utils';
 
-export const usageQuotasTabsMetadata = [
-  getStorageTabMetadata({ viewType: PROFILE_VIEW_TYPE }),
-].filter(Boolean);
+const usageQuotasTabsMetadata = [getStorageTabMetadata({ viewType: PROFILE_VIEW_TYPE })].filter(
+  Boolean,
+);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);
diff --git a/app/assets/javascripts/usage_quotas/project_view_metadata.js b/app/assets/javascripts/usage_quotas/project_view_metadata.js
index 47c720c1bda655b4a19de1739656b59d93048d64..f8cc2f260443747096f41f0aa47f2938809ca48b 100644
--- a/app/assets/javascripts/usage_quotas/project_view_metadata.js
+++ b/app/assets/javascripts/usage_quotas/project_view_metadata.js
@@ -1,6 +1,9 @@
 import { PROJECT_VIEW_TYPE } from './constants';
 import { getStorageTabMetadata } from './storage/tab_metadata';
+import { mountUsageQuotasApp } from './utils';
 
-export const usageQuotasTabsMetadata = [
-  getStorageTabMetadata({ viewType: PROJECT_VIEW_TYPE }),
-].filter(Boolean);
+const usageQuotasTabsMetadata = [getStorageTabMetadata({ viewType: PROJECT_VIEW_TYPE })].filter(
+  Boolean,
+);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);
diff --git a/app/assets/javascripts/usage_quotas/utils.js b/app/assets/javascripts/usage_quotas/utils.js
new file mode 100644
index 0000000000000000000000000000000000000000..c736b325d18690b389779b6f45c997c868c93c54
--- /dev/null
+++ b/app/assets/javascripts/usage_quotas/utils.js
@@ -0,0 +1,19 @@
+import Vue from 'vue';
+import UsageQuotasApp from './components/usage_quotas_app.vue';
+
+export const mountUsageQuotasApp = (tabs) => {
+  const el = document.querySelector('#js-usage-quotas-view');
+
+  if (!el || !tabs) return false;
+
+  return new Vue({
+    el,
+    name: 'UsageQuotasView',
+    provide: {
+      tabs,
+    },
+    render(createElement) {
+      return createElement(UsageQuotasApp);
+    },
+  });
+};
diff --git a/ee/app/assets/javascripts/usage_quotas/group_view_metadata.js b/ee/app/assets/javascripts/usage_quotas/group_view_metadata.js
index eef75ea6000694e3539ab424a82e3c0ee4e3089a..b8b9368fe8abc0f248ff360c4f6ae9ef5ede97c2 100644
--- a/ee/app/assets/javascripts/usage_quotas/group_view_metadata.js
+++ b/ee/app/assets/javascripts/usage_quotas/group_view_metadata.js
@@ -1,6 +1,7 @@
 import customApolloProvider from 'ee/usage_quotas/shared/provider';
 import { getStorageTabMetadata } from '~/usage_quotas/storage/tab_metadata';
 import { GROUP_VIEW_TYPE } from '~/usage_quotas/constants';
+import { mountUsageQuotasApp } from '~/usage_quotas/utils';
 import { getSeatTabMetadata } from './seats/tab_metadata';
 import { getCodeSuggestionsTabMetadata } from './code_suggestions/tab_metadata';
 import { getPipelineTabMetadata } from './pipelines/tab_metadata';
@@ -8,7 +9,7 @@ import { getTransferTabMetadata } from './transfer/tab_metadata';
 import { getProductAnalyticsTabMetadata } from './product_analytics/tab_metadata';
 import { getPagesTabMetadata } from './pages/tab_metadata';
 
-export const usageQuotasTabsMetadata = [
+const usageQuotasTabsMetadata = [
   getSeatTabMetadata(),
   getCodeSuggestionsTabMetadata(),
   getPipelineTabMetadata(),
@@ -17,3 +18,5 @@ export const usageQuotasTabsMetadata = [
   getProductAnalyticsTabMetadata(),
   getPagesTabMetadata(),
 ].filter(Boolean);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);
diff --git a/ee/app/assets/javascripts/usage_quotas/profile_view_metadata.js b/ee/app/assets/javascripts/usage_quotas/profile_view_metadata.js
index c276d7f4d2a96e5e25b6d6eb5fc99f07f4da6019..b1a55991bee120c55dcb2c756387150d07cdbdde 100644
--- a/ee/app/assets/javascripts/usage_quotas/profile_view_metadata.js
+++ b/ee/app/assets/javascripts/usage_quotas/profile_view_metadata.js
@@ -1,10 +1,13 @@
 import { PROFILE_VIEW_TYPE } from '~/usage_quotas/constants';
 import { getStorageTabMetadata } from '~/usage_quotas/storage/tab_metadata';
+import { mountUsageQuotasApp } from '~/usage_quotas/utils';
 import { getPipelineTabMetadata } from './pipelines/tab_metadata';
 import { getPagesTabMetadata } from './pages/tab_metadata';
 
-export const usageQuotasTabsMetadata = [
+const usageQuotasTabsMetadata = [
   getPipelineTabMetadata(),
   getStorageTabMetadata({ viewType: PROFILE_VIEW_TYPE }),
   getPagesTabMetadata(),
 ].filter(Boolean);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);
diff --git a/ee/app/assets/javascripts/usage_quotas/project_view_metadata.js b/ee/app/assets/javascripts/usage_quotas/project_view_metadata.js
index 637dac03fdc6805daff3128f66a9ee73a8e260fb..0f2d2552ffba4766aa42f172c7646c1988b4a46c 100644
--- a/ee/app/assets/javascripts/usage_quotas/project_view_metadata.js
+++ b/ee/app/assets/javascripts/usage_quotas/project_view_metadata.js
@@ -1,12 +1,15 @@
 import { PROJECT_VIEW_TYPE } from '~/usage_quotas/constants';
 import { getStorageTabMetadata } from '~/usage_quotas/storage/tab_metadata';
+import { mountUsageQuotasApp } from '~/usage_quotas/utils';
 import { getTransferTabMetadata } from './transfer/tab_metadata';
 import { getObservabilityTabMetadata } from './observability/tab_metadata';
 import { getPagesTabMetadata } from './pages/tab_metadata';
 
-export const usageQuotasTabsMetadata = [
+const usageQuotasTabsMetadata = [
   getStorageTabMetadata({ viewType: PROJECT_VIEW_TYPE }),
   getTransferTabMetadata({ viewType: PROJECT_VIEW_TYPE }),
   getObservabilityTabMetadata(),
   getPagesTabMetadata({ viewType: PROJECT_VIEW_TYPE }),
 ].filter(Boolean);
+
+export default () => mountUsageQuotasApp(usageQuotasTabsMetadata);