@evenicanpm/storefront-core 2.0.0 → 2.1.0

package/src/api-manager/index.ts

@@ -1,140 +1,23 @@
-// @ts-expect-error - this will be picked up by webpack
-import rawConfig from "@api-manager-config";
 import { D365Datasource } from "@evenicanpm/storefront-core/src/api-manager/datasources/d365/index";
 import { getContextFromCookie } from "@evenicanpm/storefront-core/src/api-manager/datasources/d365/utils/get-context-cookie";
 import E4Datasource from "@evenicanpm/storefront-core/src/api-manager/datasources/e4/e4.datasource";
-import type {
-	Datasource,
-	DatasourceApis,
-} from "@evenicanpm/storefront-core/src/api-manager/types/Datasource";
-import { z } from "zod";
-
-type EntityNames = keyof DatasourceApis;
-
-interface Config {
-	primary: string;
-	secondary: string[];
-	overrides?: Partial<Record<EntityNames, string>>;
-}
-
-const Config = z.object({
-	primary: z.string(),
-	secondary: z.array(z.string()),
-	overrides: z.record(z.string(), z.string()),
-});
-
-const OVERRIDES_FILE = "./overrides.datasource.ts";
-const CORE_DATASOURCES = [
-	"user",
-	"session",
-	"cart",
-	"product",
-	"categories",
-	"order",
-	"address",
-	"organization",
-];
+import type { Datasource } from "@evenicanpm/storefront-core/src/api-manager/types/Datasource";
 
 /**
- * Loads up all specified apis/datasources based on parsed config
- * and returns the ApiManager object. Also handles "project" overrides
- * by checking inside a specific folder for API's. Will grab default export
- * from specified folder, validate the API schema and then prioritize returning
- * that from api-manager.
+ * Returns the active commerce datasource based on the API_MANAGER_PRIMARY
+ * environment variable. Defaults to "e4" when the variable is not set.
  *
- * In this way, we have two levels of configuration of the api-manager.
- * 1. actual JSON config
- * 2. overrides from storefront
- *
- * @returns ApiManager object.
+ * Supported values: "e4" | "d365"
  */
-async function createApiManager() {
-	try {
-		Config.parse(rawConfig);
-	} catch (error) {
-		if (error instanceof z.ZodError) {
-			console.error("Config validation failed:", error.issues);
-		}
-	}
+async function createApiManager(): Promise<Datasource> {
+	const primary = process.env.API_MANAGER_PRIMARY ?? "e4";
 
-	const storefrontOverrides: { [key: string]: any } = {};
-
-	// @ts-expect-error
-	function importAll(r) {
-		r.keys().forEach((key: keyof typeof storefrontOverrides) => {
-			storefrontOverrides[key] = r(key);
-		});
+	if (primary === "d365") {
+		const context = await getContextFromCookie();
+		return new D365Datasource("d365", context);
 	}
 
-	// Arguments must be literals not variables.
-	importAll(
-		// @ts-expect-error
-		require.context(
-			"@storefront/extensions/api-manager-overrides",
-			true,
-			/overrides\.datasource\.ts/,
-		),
-	);
-
-	const context = await getContextFromCookie();
-	const datasourceMap: Record<string, Datasource> = {
-		d365: new D365Datasource("d365", context),
-		e4: E4Datasource,
-		// Add more datasources here as needed
-	};
-
-	const config = rawConfig as Config;
-	const primaryDatasource = datasourceMap[config.primary];
-	const secondaryDatasources = config.secondary.map(
-		(name) => datasourceMap[name],
-	);
-
-	const getDatasource = (entityName: EntityNames) => {
-		// Project-Level Overrides
-		let projectOverrides: { [key: string]: any } = {};
-		if (storefrontOverrides?.[OVERRIDES_FILE]?.["default"]?.[entityName]) {
-			projectOverrides =
-				storefrontOverrides[OVERRIDES_FILE]["default"][entityName];
-		}
-
-		// Config-Level Overrides
-		const override = config?.overrides?.[entityName];
-
-		// Build the base entity from api-manager config settings
-		let baseEntity: { [key: string]: any } = {};
-		if (override) {
-			baseEntity =
-				secondaryDatasources.find((ds) => ds.name === override) ??
-				primaryDatasource;
-		} else {
-			baseEntity = primaryDatasource;
-		}
-
-		// Attach Project Overrides to Entity
-		for (const key in projectOverrides) {
-			baseEntity[entityName][key] = projectOverrides[key];
-		}
-
-		return baseEntity;
-	};
-
-	const datasources: { [key: string]: any } = {};
-
-	CORE_DATASOURCES.forEach((entityName) => {
-		const datasource = getDatasource(entityName as EntityNames);
-		datasources[entityName] = datasource[entityName as keyof Datasource];
-	});
-
-	storefrontOverrides[OVERRIDES_FILE]?.default &&
-		Object.keys(storefrontOverrides[OVERRIDES_FILE]["default"]).forEach(
-			(key) => {
-				if (!CORE_DATASOURCES.includes(key)) {
-					datasources[key as keyof Datasource] =
-						storefrontOverrides[OVERRIDES_FILE]["default"][key];
-				}
-			},
-		);
-	return datasources;
+	return E4Datasource;
 }
 
 export default createApiManager;

package/src/api-manager/lib/get-graphql-client.ts

@@ -24,13 +24,13 @@ const getGraphQLClient = async (withAuth = false) => {
 	// This session cookie solution only works when all api calls are through server actions.
 	// If not we need to route all e4 client api calls through an custom api route.
 	if (sessionCookie) {
-		headers["Cookie"] = `storefront=${sessionCookie.value}`;
+		headers.Cookie = `storefront=${sessionCookie.value}`;
 	}
 
 	if (withAuth) {
 		const session = await getServerSession(authOptions());
 		if (session?.accessToken) {
-			headers["Authorization"] = `Bearer ${session.accessToken}`;
+			headers.Authorization = `Bearer ${session.accessToken}`;
 		}
 	}
 

package/src/api-manager/schemas/product.schema.ts

@@ -43,6 +43,7 @@ export const productSchema = z.object({
 	Name: z.string(),
 	Price: z.number().optional(),
 	BasePrice: z.number().optional(),
+	AdjustedPrice: z.number().optional(),
 	Description: z.string().optional(),
 	PrimaryImageUrl: z.string().or(z.null()).optional(), // adding a null for nextjs/image component
 	Variants: z.array(z.any()).optional(),
@@ -52,6 +53,14 @@ export const productSchema = z.object({
 	Reviews: z.array(reviewSchema).optional(),
 	categoryFilter: z.string().optional(),
 	ExtensionProperties: z.array(commercePropertySchema).optional(),
+	/** From merge(productData, productDetailsMap); must be kept through .parse() or Zod strips unknown keys. */
+	MasterProductId: z.union([z.number(), z.string()]).optional(),
+	Dimensions: z.array(z.any()).default([]),
+	DimensionValues: z
+		.array(z.array(z.custom<ProductDimensionValueInventoryAvailability>()))
+		.default([]),
+	Images: z.array(z.string()).optional(),
+	Attributes: z.array(z.custom<AttributeValue>()).default([]),
 });
 
 export const productWCategorySchema = productSchema.extend({

package/src/api-manager/services/create-extension-query.ts

@@ -15,7 +15,7 @@ import type { QueryFunction } from "@tanstack/react-query";
  * @param queryFn
  * @returns
  */
-const buildQueryData = <TQueryFnData = unknown, TQueryFnInput = unknown>(
+const buildQueryData = <TQueryFnData = unknown, _TQueryFnInput = unknown>(
 	queryKey: string,
 	queryFn: QueryFunction<TQueryFnData>,
 ) => {

package/src/api-manager/services/create-query.ts

@@ -1,5 +1,3 @@
-/* eslint-disable  @typescript-eslint/no-explicit-any */
-// TODO: use api manager types to remove type any
 import createApiManager from "@evenicanpm/storefront-core/src/api-manager/index";
 import type { DatasourceApis } from "@evenicanpm/storefront-core/src/api-manager/types/Datasource";
 import { isServer, type QueryClient } from "@tanstack/query-core";
@@ -18,277 +16,130 @@ import signOut from "@/auth/signout";
 const QUERY_ROUTE = "/api";
 const mutex = new Mutex();
 
-/**
- * Creates a react-query query with all data access methods exported.
- * Handles switching between direct api-manager calls and accessing api manager through
- * route handler. If no query key provided, use api manager path as cache key prefix.
- * @param queryKey a prefix to add to cache key
- * @param route the route to the corresponding route handler
- * @param apiManagerPath a tuple of two items, entity name and method
- * @param options.disableProperty if these input properties are undefined then disable query
- * @param options.enabled raw enabled for certain use cases
- * @returns
- */
-export const createQuery = <TInput, TOutput>(
-	apiManagerPath: ApiPath<keyof DatasourceApis>,
-	config?: {
-		queryKey?: string;
-		disableProperties?: Array<keyof TInput>;
-	},
-) => {
-	/**
-	 * Generates the configuration object for a query, including the query function, cache key, and enabled state.
-	 *
-	 * The query function (`queryFn`) is determined based on the execution environment (server or client):
-	 * - On the server, it checks for token expiry, refreshes the token if needed, creates an API manager, and invokes the appropriate API function.
-	 * - On the client, it checks for token expiry and either refreshes the token or performs a fetch operation.
-	 *
-	 * The `enabled` property is computed based on the presence and truthiness of specified properties in the input, if `disableProperties` are provided in options.
-	 *
-	 * @param input - Optional input parameters for the query and API function.
-	 * @returns An object containing:
-	 *   - `queryKey`: The cache key for the query, built from the input.
-	 *   - `queryFn`: The asynchronous function to execute for the query.
-	 *   - `enabled`: A boolean indicating whether the query should be enabled.
-	 */
-	const getQueryData = (input?: TInput) => {
-		const queryFn = isServer
-			? /// Server ///
-				async () => {
-					const apiManager = await createApiManager();
-					const apiFunction = getApiFromPath(apiManager, apiManagerPath);
-					const result = await apiFunction(input);
-					return result;
-				}
-			: /// Client ///
-				async () => {
-					// Check if token is expired
-					const shouldRefreshToken = await checkTokenExpiry();
-					if (shouldRefreshToken) {
-						return await handleTokenRefreshClient(input);
-					} else {
-						return await doFetch(input, apiManagerPath);
-					}
-				};
-
-		// if disable props specified then use them to compute enabled
-		const enabled: boolean = config?.disableProperties
-			? config.disableProperties.every((prop) => !!input?.[prop])
-			: true;
-
-		const data = {
-			queryKey: buildCacheKey(input),
-			queryFn,
-			enabled,
-		};
-		return data;
-	};
-
-	/**
-	 * Sends a POST request to the specified route with the provided input and API manager path.
-	 *
-	 * @template TInput - The type of the input parameter.
-	 * @param input - The input data to be sent in the request body. Can be undefined.
-	 * @param route - The endpoint URL to which the request is sent.
-	 * @param apiManagerPath - The API manager path used to identify the API endpoint.
-	 * @returns A promise that resolves to the response of the fetch request.
-	 */
-	const doFetch = async (
-		input: TInput | undefined,
-		apiManagerPath: ApiPath<keyof DatasourceApis>,
-		additionalHeaders?: HeadersInit,
-	) => {
-		// Merge headers
-		const headers = new Headers(additionalHeaders);
-		// generic route handler (new) - will refactor all queries to use this
-		const result = await fetch(QUERY_ROUTE, {
-			method: "POST",
-			body: JSON.stringify({ input, apiManagerPath }),
-			headers,
-		});
-
-		if (result.status === 401) {
-			// If unauthenticated , sign out the user
-			signOut();
-		}
-		return await result.json();
-	};
+export type ApiPath<T extends keyof DatasourceApis = keyof DatasourceApis> = [
+	T,
+	keyof DatasourceApis[T],
+];
 
-	/**
-	 * Client-side hook to call data from react query cache
-	 * @returns
-	 */
-	const useData = (
-		input?: TInput,
-		options?: { enabled: boolean },
-	): UseQueryResult<TOutput> => {
-		return useQuery({ ...getQueryData(input), enabled: options?.enabled });
-	};
+export type Query<TInput, TOutput> = ReturnType<
+	typeof createQuery<TInput, TOutput>
+>;
 
-	/**
-	 * Client-side hook to call data from react query cache,
-	 * used with suspense for suspense loading state handling
-	 * @returns
-	 */
-	const useSuspenseData = (input?: TInput): UseSuspenseQueryResult<TOutput> => {
-		return useSuspenseQuery(getQueryData(input));
-	};
+// --- Shared helpers (no closure dependencies) ---
 
-	/**
-	 * Called on server to fetch query and load cache
-	 * @param queryClient
-	 * @returns
-	 */
-	const fetchData = async (queryClient: QueryClient, input?: TInput) => {
-		return await queryClient.fetchQuery(getQueryData(input));
-	};
+const checkTokenExpiry = async (): Promise<boolean> => {
+	let token: string | undefined;
+	if (isServer) {
+		const session = (await manuallyRetrieveSessionCookie()) ?? undefined;
+		token = session?.accessToken;
+	} else {
+		const session = await getSession();
+		token = session?.accessToken;
+	}
+	const decoded = token && (jwt.decode(token) as { exp?: number } | null);
+	const currentTime = Math.floor(Date.now() / 1000);
+	return (
+		!!decoded && typeof decoded.exp === "number" && decoded.exp < currentTime
+	);
+};
 
-	/**
-	 * Called on server to fetch query and load cache in anticipation
-	 * of client using data
-	 * @param queryClient
-	 */
-	const prefetchData = async (queryClient: QueryClient, input?: TInput) => {
-		return await queryClient.prefetchQuery(getQueryData(input));
-	};
+const doFetch = async <TInput>(
+	input: TInput | undefined,
+	apiManagerPath: ApiPath,
+	additionalHeaders?: HeadersInit,
+) => {
+	const headers = new Headers(additionalHeaders);
+	const result = await fetch(QUERY_ROUTE, {
+		method: "POST",
+		body: JSON.stringify({ input, apiManagerPath }),
+		headers,
+	});
+	if (result.status === 401) {
+		signOut();
+	}
+	return result.json();
+};
 
-	/**
-	 * Wrapper on getQueryData
-	 * TODO: need to fix this naming so we're properly shadowing
-	 * the names of tanstack-query
-	 */
-	const getData = async (
-		queryClient: QueryClient,
-	): Promise<TOutput | undefined> => {
-		const cacheKey = buildCacheKey();
-		return await queryClient.getQueryData(cacheKey);
-	};
+// Acquires a mutex before fetching so concurrent requests don't each trigger
+// a token refresh simultaneously (double-check pattern after acquiring lock).
+const withTokenRefresh = async <TInput>(
+	input: TInput | undefined,
+	apiManagerPath: ApiPath,
+) => {
+	const release = await mutex.acquire();
+	try {
+		const headers = new Headers();
+		if (await checkTokenExpiry()) {
+			headers.append("should-refresh-token", "true");
+		}
+		return await doFetch(input, apiManagerPath, headers);
+	} catch (error) {
+		console.error("Error fetching data:", error);
+		throw new Error("Failed to fetch data");
+	} finally {
+		release();
+	}
+};
 
-	/**
-	 *
-	 * @param queryClient react-query client
-	 * @param data the data to set the query to
-	 * @param input the input of the query that's used to generate cache key
-	 * returns a promise of QueryResult for query
-	 */
-	const setQueryData = async (
-		queryClient: QueryClient,
-		data: TOutput,
-		input?: TInput,
-	) => {
-		const key = buildCacheKey(input);
-		return await queryClient.setQueryData(key, data);
-	};
+// --- Factory ---
 
-	/**
-	 *
-	 * @param input the input for the query of TInput
-	 * @returns if no input, the query key, if input, query key and input in array
-	 */
+export const createQuery = <TInput, TOutput>(
+	apiManagerPath: ApiPath<keyof DatasourceApis>,
+	config?: {
+		queryKey?: string;
+		disableProperties?: Array<keyof TInput>;
+	},
+) => {
 	const buildCacheKey = (input?: TInput) => {
 		const prefix = config?.queryKey ?? apiManagerPath;
 		return input ? [prefix, input] : [prefix];
 	};
 
-	/**
-	 * Asynchronously checks whether the current session's access token has expired.
-	 *
-	 * Retrieves the current session and decodes the access token to extract its expiration time.
-	 * Compares the token's expiration (`exp`) claim with the current time.
-	 *
-	 * @returns A promise that resolves to `true` if the token is expired, or `false` otherwise.
-	 */
-	const checkTokenExpiry = async () => {
-		let token: string | undefined;
-		if (isServer) {
-			// Server-side: retrieve session from cookies
-			const session = (await manuallyRetrieveSessionCookie()) ?? undefined;
-			token = session?.accessToken;
-		} else {
-			const session = await getSession();
-			token = session?.accessToken;
-		}
-
-		const decoded = token && (jwt.decode(token) as { exp?: number } | null);
-
-		const currentTime = Math.floor(Date.now() / 1000);
-
-		// Use this for testing - expires after 60 seconds (1 min) from issued-at time
-		// const isExpired = !!decoded && typeof decoded.iat === "number" && currentTime > decoded.iat + 60;
-
-		const isExpired =
-			!!decoded && typeof decoded.exp === "number" && decoded.exp < currentTime;
-
-		return isExpired;
-	};
-
-	/**
-	 * Handles fetching data with token refresh logic in a thread-safe manner.
-	 *
-	 * Acquires a mutex lock to ensure only one token refresh operation occurs at a time.
-	 * Checks if the token is expired and, if so, adds a header to indicate that the token should be refreshed.
-	 * Performs the fetch operation with the appropriate headers and returns the parsed JSON response.
-	 * Releases the mutex lock after the operation completes, regardless of success or failure.
-	 *
-	 * @param input - The input data for the fetch operation, which may be undefined.
-	 * @returns A promise that resolves to the parsed JSON response from the fetch operation.
-	 * @throws An error if the fetch operation fails.
-	 */
-	const handleTokenRefreshClient = async (input: TInput | undefined) => {
-		const release = await mutex.acquire();
-		try {
-			// Check if token is expired again
-			const stillShouldRefreshToken = await checkTokenExpiry();
-			const headers = new Headers();
-			if (stillShouldRefreshToken) {
-				// Add refresh token header
-				headers.append("should-refresh-token", "true");
-			}
-			// Call do fetch with the headers
-			return await doFetch(input, apiManagerPath, headers);
-		} catch (error) {
-			// Handle API Error
-			console.error("Error fetching data:", error);
-			throw new Error("Failed to fetch data");
-		} finally {
-			release();
-		}
-	};
+	const getQueryOptions = (input?: TInput) => ({
+		queryKey: buildCacheKey(input),
+		queryFn: isServer
+			? async () => {
+					const apiManager = await createApiManager();
+					return getApiFromPath(apiManager, apiManagerPath)(input);
+				}
+			: async () => {
+					const isExpired = await checkTokenExpiry();
+					return isExpired
+						? withTokenRefresh(input, apiManagerPath)
+						: doFetch(input, apiManagerPath);
+				},
+		enabled: config?.disableProperties
+			? config.disableProperties.every((prop) => !!input?.[prop])
+			: true,
+	});
 
 	return {
-		useData,
-		useSuspenseData,
-		setQueryData,
-		fetchData,
-		prefetchData,
+		useData: (
+			input?: TInput,
+			options?: { enabled: boolean },
+		): UseQueryResult<TOutput> =>
+			useQuery({ ...getQueryOptions(input), enabled: options?.enabled }),
+		useSuspenseData: (input?: TInput): UseSuspenseQueryResult<TOutput> =>
+			useSuspenseQuery(getQueryOptions(input)),
+		fetchData: (queryClient: QueryClient, input?: TInput) =>
+			queryClient.fetchQuery(getQueryOptions(input)),
+		prefetchData: (queryClient: QueryClient, input?: TInput) =>
+			queryClient.prefetchQuery(getQueryOptions(input)),
+		getData: (queryClient: QueryClient): TOutput | undefined =>
+			queryClient.getQueryData(buildCacheKey()),
+		setQueryData: (queryClient: QueryClient, data: TOutput, input?: TInput) =>
+			queryClient.setQueryData(buildCacheKey(input), data),
 		buildCacheKey,
-		getData,
 	};
 };
 
-/**
- * A tuple type where api manager entity is first item and second item is method
- * of first item
- */
-export type ApiPath<T extends keyof DatasourceApis = keyof DatasourceApis> = [
-	T,
-	keyof DatasourceApis[T],
-];
+// --- Utilities ---
 
-/// Utilities ///
-/**
- * Takes an apiManager and reaches into nested sub api's based on array path
- * @param apiManager
- * @param path array of path steps
- * @returns the function at the specified path
- */
 export function getApiFromPath<TInput, TOutput>(
-	apiManager: any,
+	apiManager: Awaited<ReturnType<typeof createApiManager>>,
 	path: ApiPath,
 ): (input?: TInput) => Promise<TOutput> {
 	const [entity, method] = path;
-	// Typescript is doing heavy lifting to ensure correct api path
-	// so safe to call method directly
 	const result = apiManager[entity][method];
 
 	if (process.env.NODE_ENV === "development") {
@@ -300,30 +151,19 @@ export function getApiFromPath<TInput, TOutput>(
 		});
 	}
 
-	// Function reference loses 'this' context.
-	// Re-bind for d365 classes.
+	// Function reference loses 'this' context — re-bind for d365 classes.
 	if (typeof result === "function") {
-		return result.bind(apiManager[entity]);
+		return (result as (input?: TInput) => Promise<TOutput>).bind(
+			apiManager[entity],
+		);
 	}
 	return result;
 }
 
-/**
- *
- * @param key
- * @param method
- * @returns
- */
 export function createApiPath<T extends keyof DatasourceApis>(
 	key: T,
 	method: keyof DatasourceApis[T],
 ) {
-	// have to re-cast to general keyof DatasourceApi after
-	// using stricter type for type narrowing and intellisense
-	console.log([key, method]);
+	// re-cast to general ApiPath after using stricter type for intellisense
 	return [key, method] as ApiPath<keyof DatasourceApis>;
 }
-
-export type Query<TInput, TOutput> = ReturnType<
-	typeof createQuery<TInput, TOutput>
->;

package/src/api-manager/types/Datasource.ts

@@ -111,9 +111,6 @@ export interface UserApi {
 	copyCartToWishlist(
 		input: userSchemas.CopyCartToWishlistInput,
 	): Promise<userSchemas.Wishlist>;
-	updateUser(user: userSchemas.User): Promise<userSchemas.User>;
-	getUser(): Promise<userSchemas.User | null>;
-	getUserCounts(userId: string): Promise<userSchemas.UserCounts>;
 }
 
 /**

package/src/cms/blocks/components/category-card.tsx

@@ -2,7 +2,6 @@ import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 import Card from "@mui/material/Card";
 import Image from "next/image";
-import React from "react";
 
 import cmsEndPoints from "@/cms/endpoints";
 

package/src/cms/blocks/components/category-carousel/index.tsx

@@ -5,7 +5,6 @@ import BazaarCard from "@evenicanpm/storefront-core/src/components/BazaarCard";
 import { Carousel } from "@evenicanpm/storefront-core/src/components/carousel/index";
 import { Section } from "@evenicanpm/storefront-core/src/components/section";
 import NextLink from "next/link";
-import React from "react";
 // LOCAL CUSTOM COMPONENT
 import TopCategoriesCard from "@/cms/blocks/components/shared/top-categories-card";
 // CUSTOM ICON COMPONENT

package/src/cms/blocks/components/featured-categories.tsx

@@ -1,6 +1,5 @@
 import { Box, Container } from "@mui/material";
 import Grid from "@mui/material/Grid2";
-import React from "react";
 
 // Local components
 import CategoryCard from "@/cms/blocks/components/category-card";
@@ -26,7 +25,7 @@ const FeaturedCategories = (categoriesData: FeaturedCategoriesBlock) => {
 								size={3}
 								display="flex"
 								justifyContent="center"
-								key={"category_index_" + i}
+								key={`category_index_${i}`}
 							>
 								<CategoryCard
 									name={category.name}