@vtex/faststore-plugin-buyer-portal 1.1.104-experimental.4 → 1.1.106

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@vtex/faststore-plugin-buyer-portal",
-	"version": "1.1.104-experimental.4",
+	"version": "1.1.106",
 	"description": "A plugin for faststore with buyer portal",
 	"main": "index.js",
 	"scripts": {

package/src/features/shared/components/Error/Error.tsx

@@ -5,7 +5,6 @@ export type ErrorProps = {
   error?: {
     error: Error;
     query?: unknown;
-    rawData?: unknown;
     tags?: {
       component: string;
       errorType: string;
@@ -32,9 +31,6 @@ export default function Error({ error }: ErrorProps) {
         <p data-fs-bp-error-details-query>
           Query: {JSON.stringify(error?.query)}
         </p>
-        <p data-fs-bp-error-details-raw-data>
-          Raw Data: {JSON.stringify(error?.rawData)}
-        </p>
       </div>
     </div>
   );

package/src/features/shared/components/ErrorBoundary/types.ts

@@ -4,7 +4,6 @@ export type ErrorBoundaryProps = {
     name: string;
     stack?: string;
     query?: unknown;
-    rawData?: unknown;
   };
   tags: {
     component: string;

package/src/features/shared/utils/index.ts

@@ -34,5 +34,6 @@ export {
 export { toQueryParams } from "./toQueryParams";
 export { getValidPage } from "./getValidPage";
 export { isPluginError } from "./isPluginError";
+export { serializeLoaderData } from "./serializeLoaderData";
 export { withLoaderErrorBoundary } from "./withLoaderErrorBoundary";
 export { withClientErrorBoundary } from "./withClientErrorBoundary";

package/src/features/shared/utils/serializeLoaderData.ts

@@ -0,0 +1,10 @@
+export function serializeLoaderData<T>(data: T): T {
+  return JSON.parse(
+    JSON.stringify(data, (key, value) => {
+      if (value === undefined) {
+        return null;
+      }
+      return value;
+    })
+  );
+}

package/src/features/shared/utils/withLoaderErrorBoundary.ts

@@ -1,3 +1,6 @@
+import { getClientContext } from "./getClientContext";
+import { serializeLoaderData } from "./serializeLoaderData";
+
 import type { LoaderData } from "../types";
 
 interface WithLoaderErrorBoundaryOptions {
@@ -14,32 +17,68 @@ export function withLoaderErrorBoundary<TQuery, TReturn>(
 
   return async (data: LoaderData<TQuery>): Promise<TReturn> => {
     try {
-      return await loaderFn(data);
+      const result = await loaderFn(data);
+      return serializeLoaderData(result);
     } catch (error) {
+      console.error(`[${componentName || "Loader"}] Error:`, {
+        message: (error as Error).message,
+        query: data.query,
+      });
+
       if (onError) {
         onError(error as Error, data.query);
       }
 
       if (redirectToError) {
-        return {
+        let clientContext;
+        try {
+          clientContext = await getClientContext(data);
+        } catch (contextError) {
+          console.error(
+            `[${componentName || "Loader"}] Failed to get client context:`,
+            contextError
+          );
+          clientContext = {
+            cookie: "",
+            customerId: "",
+            userId: "",
+            vtexIdclientAutCookie: "",
+          };
+        }
+
+        // Serialize query to ensure it's JSON-safe (use null instead of undefined)
+        const serializedQuery = data.query
+          ? JSON.parse(JSON.stringify(data.query))
+          : null;
+
+        const errorResponse = {
           error: {
             error: {
               message: (error as Error).message,
               name: (error as Error).name,
-              stack: (error as Error).stack,
-              query: data.query,
-              rawData: data,
+              stack: (error as Error).stack || null,
+              query: serializedQuery,
             },
             tags: {
               component: componentName || "Unknown",
               errorType: "loader_error",
             },
             extra: {
-              query: data.query,
+              query: serializedQuery,
             },
           },
           hasError: true,
-        } as TReturn;
+          context: {
+            clientContext,
+            currentOrgUnit: null,
+            currentContract: null,
+            currentUser: null,
+          },
+          data: null,
+        };
+
+        // Ensure error response is also JSON-serializable
+        return serializeLoaderData(errorResponse) as TReturn;
       }
 
       throw error;

package/src/pages/address-details.tsx

@@ -85,6 +85,22 @@ const loaderFunction = async (
   const { customerId, cookie, userId, ...clientContext } =
     await getClientContext(data);
 
+  if (!contractId || !orgUnitId) {
+    return {
+      data: {
+        addressDetails: null,
+        recipientsData: null,
+        locationsData: null,
+      },
+      context: {
+        clientContext: { customerId, cookie, userId, ...clientContext },
+        currentOrgUnit: null,
+        currentContract: null,
+        currentUser: null,
+      },
+    };
+  }
+
   const orgUnit = await getOrgUnitBasicDataService({ cookie, id: orgUnitId });
 
   const contract = await getContractDetailsService({

package/src/pages/addresses.tsx

@@ -56,6 +56,21 @@ const loaderFunction = async (
   const { cookie, userId, customerId, ...clientContext } =
     await getClientContext(data);
 
+  if (!contractId || !orgUnitId) {
+    return {
+      data: [],
+      search: search ?? "",
+      total: 0,
+      page: page ?? 1,
+      context: {
+        clientContext: { customerId, cookie, userId, ...clientContext },
+        currentOrgUnit: null,
+        currentContract: null,
+        currentUser: null,
+      },
+    };
+  }
+
   const [currentOrgUnit, user, contract, addressesResponse] = await Promise.all(
     [
       getOrgUnitBasicDataService({

package/src/pages/budgets.tsx

@@ -46,6 +46,18 @@ const loaderFunction = async (
 
   const { contractId, orgUnitId } = data.query;
 
+  if (!contractId || !orgUnitId) {
+    return {
+      data: { data: [], total: 0 },
+      context: {
+        clientContext: { cookie, userId, customerId, ...clientContext },
+        currentOrgUnit: null,
+        currentContract: null,
+        currentUser: null,
+      },
+    };
+  }
+
   const [orgUnit, contract, user, budgetsData] = await Promise.all([
     getOrgUnitBasicDataService({
       cookie,

package/src/pages/buying-policies.tsx

@@ -57,6 +57,21 @@ const loaderFunction = async (
 
   const { cookie, userId, ...clientContext } = await getClientContext(data);
 
+  if (!contractId || !orgUnitId) {
+    return {
+      buyingPolicies: [],
+      total: 0,
+      search: search ?? "",
+      page: page ?? 1,
+      context: {
+        clientContext: { cookie, userId, ...clientContext },
+        currentOrgUnit: null,
+        currentContract: null,
+        currentUser: null,
+      },
+    };
+  }
+
   const [currentOrgUnit, user, contract, budgetData, buyingPoliciesResponse] =
     await Promise.all([
       getOrgUnitBasicDataService({

package/src/pages/cost-centers.tsx

@@ -23,7 +23,7 @@ export type CostCentersPageData = {
   data: ContractData | null;
   context: {
     clientContext: ClientContext;
-    currentOrgUnit: OrgUnitBasicData;
+    currentOrgUnit: OrgUnitBasicData | null;
     currentContract: ContractData | null;
     currentUser: UserData | null;
     search: string;
@@ -46,6 +46,19 @@ const loaderFunction = async (
 
   const { contractId, orgUnitId, search } = data.query;
 
+  if (!contractId || !orgUnitId) {
+    return {
+      data: null,
+      context: {
+        clientContext: { cookie, userId, customerId, ...clientContext },
+        currentContract: null,
+        currentUser: null,
+        currentOrgUnit: null,
+        search: "",
+      },
+    };
+  }
+
   const [orgUnit, contract, user] = await Promise.all([
     getOrgUnitBasicDataService({ id: orgUnitId, cookie }),
     getContractDetailsService({ contractId, unitId: orgUnitId, cookie }),

package/src/pages/profile.tsx

@@ -45,9 +45,15 @@ export async function loaderFunction(
   const { contractId, orgUnitId } = data.query ?? {};
 
   if (!contractId || !orgUnitId) {
-    throw new Error(
-      `Missing required query params: contractId=${contractId}, orgUnitId=${orgUnitId}`
-    );
+    return {
+      data: null,
+      context: {
+        clientContext: { customerId, cookie, userId, ...clientContext },
+        currentOrgUnit: null,
+        currentContract: null,
+        currentUser: null,
+      },
+    };
   }
 
   const [orgUnit, contract, user] = await Promise.all([

package/src/pages/users.tsx

@@ -58,6 +58,24 @@ const loaderFunction = async (
   const { orgUnitId, search = "", page = "1" } = data.query;
   const validPage = getValidPage(page);
 
+  if (!orgUnitId) {
+    return {
+      data: {
+        users: [],
+        total: 0,
+        search: "",
+        page: 1,
+        rolesOptions: [],
+      },
+      context: {
+        clientContext: { cookie, userId, ...clientContext },
+        currentUser: null,
+        currentOrgUnit: null,
+        rolesOptions: [],
+      },
+    };
+  }
+
   const [currentOrgUnit, usersResponse, user, rolesOptions] = await Promise.all(
     [
       getOrgUnitBasicDataService({