[UXE-6030] feat: update Real-Time Metrics, Events, Billing, and Accou…

…nting Services to API v4 with Origin Configuration Changes (#2069)

* fix: update real-time events and metrics service URLs to use v4 API version

* fix: update origin names in azion.config.cjs and vite.config.js

* fix: update real-time events and metrics service URLs to use v4 API version

* fix: update URLs for real-time events and metrics services to use v4 API version

* fix: update URLs for real-time events and metrics services to use v4 API version

* test: update url to activy history for e2mock

* test: update metrics playground opener tests for environment handling

azion.config.mjs

@@ -318,30 +318,14 @@ const config = {
         }
       },
       {
-        name: 'Route GraphQL Billing Queries to Manager Origin',
-        description: 'Routes GraphQL Billing queries to the Manager, updating the URI accordingly',
-        match: '^/graphql/billing',
+        name: 'API Version 4 Routing',
+        description: 'Directs API version 4 requests to the designated API origin for handling.',
+        match: '^/v4',
         behavior: {
-          forwardCookies: true,
           setOrigin: {
-            name: 'origin-manager',
-            type: 'single_origin'
-          },
-          rewrite: '/billing/graphql'
-        }
-      },
-      {
-        name: 'Route GraphQL Accounting Queries to Manager Origin',
-        description:
-          'Routes GraphQL Accounting queries to the Manager, updating the URI accordingly',
-        match: '^/graphql/accounting',
-        behavior: {
-          forwardCookies: true,
-          setOrigin: {
-            name: 'origin-manager',
+            name: 'origin-api',
             type: 'single_origin'
-          },
-          rewrite: '/accounting/graphql'
+          }
         }
       },
       {

cypress/e2mock/activity-history.cy.js

@@ -4,7 +4,7 @@ import selectors from '../support/selectors'
 describe('Activity History Spec', { tags: ['@dev2'] }, () => {
   beforeEach(() => {
     cy.login()
-    cy.intercept('POST', '/api/v3/events/graphql', { fixture: 'activity-history.json' }).as('activityHistoryApi')
+    cy.intercept('POST', 'v4/events/graphql', { fixture: 'activity-history.json' }).as('activityHistoryApi')
     cy.openProduct('Activity History')
   })
 

src/helpers/get-static-urls-by-environment.js

@@ -14,12 +14,12 @@ const urls = {
     production: 'https://manager.azion.com/billing-subscriptions'
   },
   playgroundMetrics: {
-    stage: 'https://stage-manager.azion.com/metrics/graphql',
-    production: 'https://manager.azion.com/metrics/graphql'
+    stage: 'https://stage-api.azion.com/v4/metrics/graphql',
+    production: 'https://api.azion.com/v4/metrics/graphql'
   },
   playgroundEvents: {
-    stage: 'https://stage-manager.azion.com/events/graphql',
-    production: 'https://manager.azion.com/events/graphql'
+    stage: 'https://stage-api.azion.com/v4/events/graphql',
+    production: 'https://api.azion.com/v4/events/graphql'
   },
   helpCenter: {
     stage: 'https://storage.googleapis.com/gcs-docs-help-center-stage/console/',

src/services/axios/AxiosHttpClientAdapter.js

@@ -39,7 +39,7 @@ export const parseHttpResponse = (httpResponse) => {
 
 export class AxiosHttpClientAdapter {
   static async request(
-    { url, method, headers, body, signal },
+    { url, method, headers, body, signal, baseURL },
     axios = defaultApi(import.meta.env.VITE_PERSONAL_TOKEN)
   ) {
     let axiosResponse
@@ -50,7 +50,8 @@ export class AxiosHttpClientAdapter {
         method: method,
         headers: headers,
         data: body,
-        signal
+        signal,
+        ...(baseURL && { baseURL: baseURL })
       })
     } catch (error) {
       const axiosError = error

src/services/axios/AxiosHttpClientSignalDecorator.js

@@ -5,13 +5,14 @@ export class AxiosHttpClientSignalDecorator {
     this.signal = signal
   }
 
-  async request({ url, method, headers, body }) {
+  async request({ url, method, headers, body, baseURL }) {
     return await AxiosHttpClientAdapter.request({
       url,
       method,
       headers,
       body,
-      signal: this.signal
+      signal: this.signal,
+      baseURL
     })
   }
 }

src/services/axios/makeEventsApi.js

@@ -2,8 +2,7 @@ import axios from 'axios'
 
 const api = (personalToken) => {
   delete axios.defaults.headers.common['Authorization']
-  const version = 'v3'
-  const baseURL = `api/${version}/events`
+  const baseURL = `v4/events`
 
   axios.defaults.headers.common['Accept'] = 'application/json'
 

src/services/billing-services/list-payment-history-service.js

@@ -3,7 +3,6 @@ import { makePaymentBaseUrl } from './make-payment-base-url'
 import { makeAccountingBaseUrl } from './make-accounting-base-url'
 import { formatDateToUS, getStaticUrlsByEnvironment } from '@/helpers'
 import { useAccountStore } from '@/stores/account'
-import graphQLApi from '../axios/makeGraphQl'
 import { getLastDayMonth } from '@/helpers/payment-history'
 
 const PAGE_SIZE = 200
@@ -67,14 +66,12 @@ const listPaymentHistoryForRegularAccounts = async () => {
         }`
   }
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url: `${makeAccountingBaseUrl()}`,
-      method: 'POST',
-      body: payload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url: `${makeAccountingBaseUrl()}`,
+    method: 'POST',
+    body: payload
+  })
 
   return adaptPaymentHistoryForRegularAccounts(httpResponse)
 }

src/services/billing-services/list-service-and-products-changes-accounting-service.js

@@ -1,6 +1,5 @@
 import { formatUnitValue } from '@/helpers'
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { makeAccountingBaseUrl } from './make-accounting-base-url'
 
 export const listServiceAndProductsChangesAccountingService = async (billID) => {
@@ -27,14 +26,12 @@ export const listServiceAndProductsChangesAccountingService = async (billID) =>
     query: BILL_DETAIL_QUERY
   }
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url: `${makeAccountingBaseUrl()}`,
-      method: 'POST',
-      body: graphQLPayload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url: `${makeAccountingBaseUrl()}`,
+    method: 'POST',
+    body: graphQLPayload
+  })
 
   httpResponse = adapt(httpResponse)
 

src/services/billing-services/list-service-and-products-changes.js

@@ -1,6 +1,5 @@
 import { formatCurrencyString, formatUnitValue } from '@/helpers'
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { makeBillingBaseUrl } from './make-billing-base-url'
 
 export const listServiceAndProductsChangesService = async (billID) => {
@@ -98,14 +97,12 @@ export const listServiceAndProductsChangesService = async (billID) => {
     }
   }
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url: `${makeBillingBaseUrl()}`,
-      method: 'POST',
-      body: graphQLPayload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url: `${makeBillingBaseUrl()}`,
+    method: 'POST',
+    body: graphQLPayload
+  })
 
   httpResponse = adapt(httpResponse)
 

src/services/billing-services/load-current-invoice-service.js

@@ -1,5 +1,4 @@
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { makeBillingBaseUrl } from './make-billing-base-url'
 import { makeAccountingBaseUrl } from './make-accounting-base-url'
 import { formatDateToUSBilling } from '@/helpers/convert-date'
@@ -10,14 +9,12 @@ export const loadCurrentInvoiceService = async () => {
   const payload = getQueryByAccountType(accountIsNotRegular)
   const url = accountIsNotRegular ? `${makeBillingBaseUrl()}` : `${makeAccountingBaseUrl()}`
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url,
-      method: 'POST',
-      body: payload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url,
+    method: 'POST',
+    body: payload
+  })
 
   httpResponse = adapt(httpResponse, accountIsNotRegular)
 

src/services/billing-services/load-invoice-data-service.js

@@ -1,5 +1,4 @@
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { makeBillingBaseUrl } from './make-billing-base-url'
 import { formatDateToUSBilling } from '@/helpers/convert-date'
 import { makeAccountingBaseUrl } from './make-accounting-base-url'
@@ -10,14 +9,12 @@ export const loadInvoiceDataService = async (invoiceId) => {
   const payload = getQueryByAccountType(accountIsNotRegular, invoiceId)
   const url = accountIsNotRegular ? `${makeBillingBaseUrl()}` : `${makeAccountingBaseUrl()}`
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url,
-      method: 'POST',
-      body: payload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url,
+    method: 'POST',
+    body: payload
+  })
 
   httpResponse = adapt(httpResponse, accountIsNotRegular)
 

src/services/billing-services/load-invoice-last-updated-service.js

@@ -1,5 +1,4 @@
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { makeBillingBaseUrl } from './make-billing-base-url'
 import { formatDateToUSBilling } from '@/helpers/convert-date'
 
@@ -17,14 +16,12 @@ export const loadInvoiceLastUpdatedService = async () => {
     }`
   }
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url: `${makeBillingBaseUrl()}`,
-      method: 'POST',
-      body: payload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url: `${makeBillingBaseUrl()}`,
+    method: 'POST',
+    body: payload
+  })
 
   httpResponse = adapt(httpResponse)
 

src/services/billing-services/load-your-service-plan-service.js

@@ -1,7 +1,6 @@
 import { AxiosHttpClientAdapter, parseHttpResponse } from '../axios/AxiosHttpClientAdapter'
-import graphQLApi from '../axios/makeGraphQl'
 import { formatDateToUSBilling } from '@/helpers/convert-date'
-
+import { makeBillingBaseUrl } from './make-billing-base-url'
 export const loadYourServicePlanService = async (disclaimer = '') => {
   const { lastDayOfMonth, firstDayOfMonth } = getFirstDayCurrentDate()
 
@@ -25,14 +24,12 @@ export const loadYourServicePlanService = async (disclaimer = '') => {
       }`
   }
 
-  let httpResponse = await AxiosHttpClientAdapter.request(
-    {
-      url: `/billing`,
-      method: 'POST',
-      body: payload
-    },
-    graphQLApi
-  )
+  let httpResponse = await AxiosHttpClientAdapter.request({
+    baseURL: '/',
+    url: makeBillingBaseUrl(),
+    method: 'POST',
+    body: payload
+  })
 
   httpResponse = adapt(httpResponse, disclaimer)
 

src/services/billing-services/make-accounting-base-url.js

@@ -1,3 +1,3 @@
 export const makeAccountingBaseUrl = () => {
-  return 'accounting'
+  return 'v4/accounting/graphql'
 }

src/services/billing-services/make-billing-base-url.js

@@ -1,3 +1,3 @@
 export const makeBillingBaseUrl = () => {
-  return 'billing'
+  return 'v4/billing/graphql'
 }

src/services/real-time-events-service/activity-history/list-activity-history.js

@@ -14,6 +14,7 @@ export const listActivityHistory = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/activity-history/load-activity-history.js

@@ -10,6 +10,7 @@ export const loadActivityHistory = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/data-stream/list-data-stream.js

@@ -14,6 +14,7 @@ export const listDataStream = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/data-stream/load-data-stream.js

@@ -9,6 +9,7 @@ export const loadDataStream = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-dns/list-edge-dns.js

@@ -14,6 +14,7 @@ export const listEdgeDNS = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-dns/load-edge-dns.js

@@ -8,6 +8,7 @@ export const loadEdgeDNS = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-functions-console/list-edge-functions-console.js

@@ -15,6 +15,7 @@ export const listEdgeFunctionsConsole = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-functions-console/load-edge-functions-console.js

@@ -9,6 +9,7 @@ export const loadEdgeFunctionsConsole = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-functions/list-edge-functions.js

@@ -14,6 +14,7 @@ export const listEdgeFunctions = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload

src/services/real-time-events-service/edge-functions/load-edge-functions.js

@@ -10,6 +10,7 @@ export const loadEdgeFunctions = async (filter) => {
   const decorator = new AxiosHttpClientSignalDecorator()
 
   const response = await decorator.request({
+    baseURL: '/',
     url: makeRealTimeEventsBaseUrl(),
     method: 'POST',
     body: payload