@adobe-commerce/fetch-graphql 1.0.0 → 1.0.1-alpha56

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@adobe-commerce/fetch-graphql",
-    "version": "1.0.0",
+    "version": "1.0.1-alpha56",
     "license": "SEE LICENSE IN LICENSE.md",
     "description": "A library to fetch GraphQL queries and mutations",
     "engines": {

package/src/index.ts

@@ -27,6 +27,12 @@ export type FetchQueryError = Array<{
   extensions: { category: string };
 }>;
 
+export type BeforeHook = (requestInit: RequestInit) => RequestInit;
+export type AfterHook<T = any> = (
+    requestInit: RequestInit,
+    response: { errors?: FetchQueryError; data: T }
+) => { errors?: FetchQueryError; data: T };
+
 const defaultHeaders = {
   'Content-Type': 'application/json',
   Accept: 'application/json',
@@ -43,7 +49,11 @@ class FetchGraphQLMesh {
     return this._fetchGraphQlHeaders;
   }
 
-  public _fetchGraphQlHeaders: Header | undefined;
+  public _fetchGraphQlHeaders: Header = {};
+
+  public _beforeHooks: BeforeHook[] = [];
+
+  public _afterHooks: AfterHook[] = [];
 
   /**
    * Sets the GraphQL endpoint.
@@ -69,14 +79,66 @@ class FetchGraphQLMesh {
    * @param key - The key of the header.
    */
   public removeFetchGraphQlHeader(key: string) {
-    delete this._fetchGraphQlHeaders?.[key];
+    delete this._fetchGraphQlHeaders[key];
   }
   /**
    * Sets the GraphQL headers.
-   * @param header - The header object.
+   * @param header - The header object or a function that returns a header object.
+   * If a function is provided, it will be called with the previous headers.
+   * The returned object will be merged with the previous headers.
+   * @example
+   * ```js
+   * // set headers
+   * setFetchGraphQlHeaders({ test: 'test' });
+   * 
+   * // merge with previous headers
+   * setFetchGraphQlHeaders((prev) => ({
+   *   ...prev,
+   *  test: 'test2',
+   * }));
+   * ```
+   */
+  public setFetchGraphQlHeaders(header: Header | ((prev: Header) => Header)) {
+    if (typeof header === 'function') {
+      this._fetchGraphQlHeaders = {
+        ...this._fetchGraphQlHeaders,
+        ...header(this._fetchGraphQlHeaders),
+      };
+    } else {
+      this._fetchGraphQlHeaders = { ...header };
+    }
+  }
+  /**
+   * Adds a hook executed before the GraphQL call.
+   * @param hook - The hook function.
+   * @example
+   * ```js
+   * // add before hook
+   * addBeforeHook((requestInit) => console.log('About to execute ' + requestInit.method + ' call.'));
+   *
+   * // modify the requestInit before executing the request
+   * addBeforeHook((requestInit) => {method: requestInit.method, body: 'new body'});
+   * ```
    */
-  public setFetchGraphQlHeaders(header: Header) {
-    this._fetchGraphQlHeaders = { ...header };
+  public addBeforeHook(hook: BeforeHook): void {
+    this._beforeHooks.push(hook);
+  }
+  /**
+   * Adds a hook executed before the GraphQL call.
+   * @param hook - The hook function.
+   * @example
+   * ```js
+   * // add before hook
+   * addAfterHook((requestInit, response) => console.log(
+   *     'The result of ' + requestInit.method + ' call is ' + response.json().body
+   * ));
+   *
+   * // modify the response
+   * addAfterHook((requestInit, response) => new Response(JSON.stringify({ ...response, modified: true }));
+   * ```
+   */
+  public addAfterHook(hook: AfterHook): void {
+    this._afterHooks.push(hook);
   }
   /**
    * Fetches GraphQL data.
@@ -118,13 +180,25 @@ class FetchGraphQLMesh {
         url.searchParams.append('variables', JSON.stringify(options.variables));
     }
 
-    return await fetch(url, {
+    let requestInit: RequestInit = {
       method,
       headers,
       body,
       cache,
       signal,
-    }).then((r) => r.json());
+    };
+
+    requestInit = await this._beforeHooks.reduce(
+        async (prev, hook) => hook(await prev),
+        Promise.resolve(requestInit)
+    );
+
+    return await fetch(url, requestInit).then((r) => r.json().then(
+        (response) => this._afterHooks.reduce(
+            async (result, hook) => hook(requestInit, await result),
+            Promise.resolve(response)
+        )
+    ));
   }
   /**
    * Gets the configuration.
@@ -144,6 +218,8 @@ class FetchGraphQLMesh {
       setFetchGraphQlHeaders: this.setFetchGraphQlHeaders.bind(this),
       fetchGraphQl: this.fetchGraphQl.bind(this),
       getConfig: this.getConfig.bind(this),
+      addBeforeHook: this.addBeforeHook.bind(this),
+      addAfterHook: this.addAfterHook.bind(this),
     };
   }
 }
@@ -166,7 +242,7 @@ export class FetchGraphQL extends FetchGraphQLMesh {
     return (
       (this._endpoint
         ? this._fetchGraphQlHeaders
-        : { ...this._fetchGraphQlHeaders, ...mesh.fetchGraphQlHeaders }) || {}
+        : { ...this._fetchGraphQlHeaders, ...mesh.fetchGraphQlHeaders })
     );
   }
 }
@@ -199,4 +275,6 @@ export const {
   removeFetchGraphQlHeader,
   fetchGraphQl,
   getConfig,
+  addBeforeHook,
+  addAfterHook,
 } = mesh.getMethods();