feat:error handling and region support

Signed-off-by: Amitkanswal <[email protected]>

Author: Amitkanswal

src/types.ts

@@ -7,6 +7,7 @@ import { GenericObjectType } from "./types/common.types";
 import { Entry } from "./types/entry.types";
 import { Asset, ContentType, Schema, StackDetail } from "./types/stack.types";
 import { OrganizationDetails } from "./types/organization.types";
+import { ServiceURLsMap } from './types/api.type';
 import { User } from "./types/user.types";
 import Window from "./window";
 
@@ -102,6 +103,7 @@ declare interface ICommonInitData {
     type: LocationType;
     user: User;
     manifest?: Manifest;
+    serviceDomainUrls?: ServiceURLsMap;
 }
 
 export declare interface IOrgFullPageLocationInitData extends ICommonInitData {
@@ -254,4 +256,5 @@ export enum Region {
     AZURE_NA = "AZURE_NA",
     AZURE_EU = "AZURE_EU",
     GCP_NA = "GCP_NA",
+    GCP_EU = "GCP_EU",
 }

src/types/api.type.ts

@@ -1,3 +1,19 @@
-import { AxiosRequestConfig, AxiosResponse, } from 'axios'
-export type RequestConfig = AxiosRequestConfig
-export type ProxyResponse = AxiosResponse
+import { AxiosRequestConfig, AxiosResponse } from "axios";
+export type RequestConfig = AxiosRequestConfig;
+export type ProxyResponse = AxiosResponse;
+
+export type ServiceURLsMap = {
+    CMA: string;
+};
+
+enum SupportedServices {
+    CMA = "CMA",
+}
+
+export type RequestInitConfig = RequestInit & {
+    service?: keyof typeof SupportedServices;
+};
+
+export type RequestConfigWithBaseUrl = RequestInitConfig & {
+    baseURL: string;
+};

src/uiLocation.ts

@@ -1,3 +1,4 @@
+import { AxiosRequestConfig, AxiosResponse } from 'axios';
 import postRobot from "post-robot";
 import EventEmitter from "wolfy87-eventemitter";
 
@@ -34,7 +35,7 @@ import { User } from "./types/user.types";
 import { formatAppRegion, onData, onError } from "./utils/utils";
 import Window from "./window";
 import { dispatchApiRequest, dispatchAdapter } from './utils/adapter';
-import { AxiosRequestConfig, AxiosResponse } from 'axios';
+import { RequestInitConfig, ServiceURLsMap } from "./types/api.type";
 
 const emitter = new EventEmitter();
 
@@ -69,6 +70,9 @@ class UiLocation {
      */
     private config: GenericObjectType;
 
+
+    readonly hostedEndpoints: ServiceURLsMap
+
     /**
      * This holds the instance of Cross-domain communication library for posting messages between windows.
      */
@@ -154,7 +158,7 @@ class UiLocation {
         });
 
         this.metadata = new Metadata(postRobot);
-
+        
         this.config = initializationData.config ?? {};
 
         this.ids = {
@@ -186,6 +190,8 @@ class UiLocation {
 
         this.region = formatAppRegion(initializationData.region);
 
+        this.hostedEndpoints = initializationData.serviceDomainUrls ?? { CMA: '' };
+
         const stack = new Stack(initializationData.stack, postRobot, {
             currentBranch: initializationData.currentBranch,
         });
@@ -476,7 +482,7 @@ class UiLocation {
      * Method used to make an API request to the Contentstack's CMA APIs.
      */
 
-    api = (url: string, option?: RequestInit): Promise<Response> => dispatchApiRequest(url, option) as Promise<Response>;
+    api = (url: string, option?: RequestInitConfig): Promise<Response> => dispatchApiRequest(url,this.hostedEndpoints, option) as Promise<Response>;
 
     /**
      * Method used to create an adapter for management sdk.

src/utils/adapter.ts

@@ -1,47 +1,69 @@
-import PostRobot from 'post-robot';
-import { AxiosRequestConfig, AxiosResponse } from 'axios';
-import { onError, fetchToAxiosConfig } from './utils';
+import PostRobot from "post-robot";
+import { AxiosRequestConfig, AxiosResponse, isAxiosError } from "axios";
+
+import { onError, fetchToAxiosConfig, serializeAxiosResponse } from "./utils";
+import { RequestInitConfig, ServiceURLsMap } from "../types/api.type";
+
+export const resolveBaseUrl = (hostingRegion:ServiceURLsMap, option?:RequestInitConfig)=>{
+return option?.service? hostingRegion[option.service]: hostingRegion.CMA
+}
+
 
 /**
  * Dispatches a request using PostRobot.
  * @param postRobot - The PostRobot instance.
  * @returns A function that takes AxiosRequestConfig and returns a promise.
  */
-export const dispatchAdapter = (postRobot: typeof PostRobot) => (config: AxiosRequestConfig)=> {
+export const dispatchAdapter = (postRobot: typeof PostRobot) => (config: AxiosRequestConfig): Promise<AxiosResponse> => {
   return postRobot
-    .sendToParent("apiAdapter",  config )
-    .then(({ data }) => ({ ...data, config }))
+    .sendToParent("apiAdapter", config)
+    .then((event:unknown) => {
+      const { data } = event as { data: AxiosResponse };
+      if (data.status >= 400) {
+        throw serializeAxiosResponse(data, config);
+      }
+      return serializeAxiosResponse(data, config);
+    })
     .catch(onError);
 };
-
 /**
  * Dispatches an API request using axios and PostRobot.
  * @param url - The URL of the API endpoint.
  * @param options - Optional request options.
  * @returns A promise that resolves to a partial Response object.
  */
-export const dispatchApiRequest = async (url: string, options?: RequestInit): Promise<Response> => {
-  try {
-    const config = fetchToAxiosConfig(url, options);
-    const responseData = await dispatchAdapter(PostRobot)(config) as AxiosResponse; 
-    return new Response(responseData.data,{
-      status: responseData.status,
-      statusText: responseData.statusText,
-      headers: new Headers(responseData.config.headers || {}),
-    });
+export const dispatchApiRequest = async (
+    url: string,
+    hostedUrl:ServiceURLsMap,
+    options?: RequestInitConfig,
+): Promise<Response> => {
+    try {
+        const updatedOptions = {...options, baseURL: resolveBaseUrl(hostedUrl, options)};
+        const config = fetchToAxiosConfig(url, updatedOptions);
+        const responseData = (await dispatchAdapter(PostRobot)(
+            config
+        )) as AxiosResponse;
+  
+        if (isAxiosError(responseData)) {
+          throw responseData;
+        }
+        const response = new Response(responseData?.data, {
+            status: responseData.status,
+            statusText: responseData.statusText,
+            headers: new Headers(responseData.config.headers || {}),
+        });
+        return response
+        
+    } catch (error: any) {
+      const data = error.response?.data || error.data;
+      const status = error.response?.status || error.status || 500;
+      const statusText = error.response?.statusText || error.statusText || "Internal Server Error";
+      const headers = new Headers(error.response?.headers || error.headers);
 
-  } catch (error: any) {
-    if (error.response) {
-      const fetchResponse = new Response(error.response.data, {
-          status: error.response.status,
-          statusText: error.response.statusText,
-          headers: new Headers(error.response.headers) 
+      throw new Response(data, {
+          status,
+          statusText,
+          headers,
       });
-      return Promise.reject(fetchResponse);
-    } else if (error.request) {
-        return Promise.reject(new Response(null, { status: 0, statusText: 'Network Error' }));
-    } else {
-        return Promise.reject(new Response(null, { status: 0, statusText: error.message }));
-    }
   }
-};
+};

src/utils/utils.ts

@@ -1,5 +1,6 @@
 import { Region } from "../types";
-import { AxiosHeaders, AxiosRequestConfig } from "axios";
+import { AxiosHeaders, AxiosRequestConfig, AxiosResponse } from "axios";
+import { RequestConfigWithBaseUrl } from '../types/api.type';
 
 export function onData<Data extends Record<string, any>>(data: { data: Data }) {
     if (typeof data.data === "string") {
@@ -50,6 +51,14 @@ export function getPreferredBodyElement(nodeCollection: HTMLCollection) {
     return rootElement || nodeCollection[0];
 }
 
+function isAbsoluteURL(url) {
+  try {
+    new URL(url);
+    return true;
+  } catch (e) {
+    return false;
+  }
+}
 
 export const convertHeaders = (headers: HeadersInit): AxiosHeaders => {
     const axiosHeaders = new AxiosHeaders();
@@ -69,17 +78,32 @@ export const convertHeaders = (headers: HeadersInit): AxiosHeaders => {
     return axiosHeaders;
   };
 
-  export const fetchToAxiosConfig = (url: string, options: RequestInit = {}): AxiosRequestConfig => {
+  export const fetchToAxiosConfig = (url: string ,options?: RequestConfigWithBaseUrl): AxiosRequestConfig => {
+
     const axiosConfig: AxiosRequestConfig = {
       url,
-      method: options.method || 'GET',
-      headers: options.headers ? convertHeaders({...options.headers}) : {}, 
-      data: options.body,
+      method: options?.method || 'GET',
+      headers: options?.headers ? convertHeaders({...options?.headers}) : {}, 
+      data: options?.body,
     };
-  
-    if (options.credentials === 'include') {
+    
+    if (!isAbsoluteURL(url)) {
+      axiosConfig.baseURL = options?.baseURL;
+    }
+
+    if (options?.credentials === 'include') {
       axiosConfig.withCredentials = true;
     }
 
     return axiosConfig;
+  }
+
+  export const serializeAxiosResponse = (responseData: AxiosResponse, config) => {
+    return {
+      data: responseData.data,
+      status: responseData.status,
+      statusText: responseData.statusText,
+      headers: responseData.headers as AxiosHeaders,
+      config,
+    }
   }