@akinon/next 2.0.16-beta.0 → 2.0.16-rc.1

package/middlewares/masterpass-rest-callback.ts

@@ -7,224 +7,111 @@ import { getCheckoutPath } from '../utils';
 
 const withMasterpassRestCallback =
   (middleware: NextMiddleware) =>
-  async (req: PzNextRequest, event: NextFetchEvent) => {
-    const url = req.nextUrl.clone();
-    const ip = req.headers.get('x-forwarded-for') ?? '';
-    const sessionId = req.cookies.get('osessionid');
-
-    if (!url.pathname.includes('/orders/masterpass-rest-callback')) {
-      return middleware(req, event);
-    }
-
-    if (req.method !== 'POST') {
-      logger.warn('Invalid request method for masterpass REST callback', {
-        middleware: 'masterpass-rest-callback',
-        method: req.method,
-        ip
-      });
-
-      return NextResponse.redirect(
-        `${url.origin}${getUrlPathWithLocale(
-          '/orders/checkout/',
-          req.cookies.get('pz-locale')?.value
-        )}`,
-        303
-      );
-    }
-
-    const responseCode = url.searchParams.get('responseCode');
-    const token = url.searchParams.get('token');
-
-    if (!responseCode || !token) {
-      logger.warn('Missing required parameters for masterpass REST callback', {
-        middleware: 'masterpass-rest-callback',
-        responseCode,
-        token,
-        ip
-      });
-
-      return NextResponse.redirect(
-        `${url.origin}${getUrlPathWithLocale(
-          '/orders/checkout/',
-          req.cookies.get('pz-locale')?.value
-        )}`,
-        303
-      );
-    }
-
-    try {
-      const formData = await req.formData();
-      const body: Record<string, string> = {};
-
-      Array.from(formData.entries()).forEach(([key, value]) => {
-        body[key] = value.toString();
-      });
-
-      if (!sessionId) {
-        logger.warn(
-          'Make sure that the SESSION_COOKIE_SAMESITE environment variable is set to None in Commerce.',
-          {
-            middleware: 'masterpass-rest-callback',
-            ip
-          }
-        );
+    async (req: PzNextRequest, event: NextFetchEvent) => {
+      const url = req.nextUrl.clone();
+      const ip = req.headers.get('x-forwarded-for') ?? '';
 
-        return NextResponse.redirect(
-          `${url.origin}${getUrlPathWithLocale(
-            '/orders/checkout/',
-            req.cookies.get('pz-locale')?.value
-          )}`,
-          303
-        );
-      }
+      const isMasterpassCompletePage =
+        url.pathname.includes('/orders/checkout') &&
+        url.searchParams.get('page') === 'MasterpassRestCompletePage';
 
-      const isPostCheckout = req.cookies.get('pz-post-checkout-flow')?.value === 'true';
-      const requestUrl = new URL(getCheckoutPath(isPostCheckout), Settings.commerceUrl);
-      requestUrl.searchParams.set('page', 'MasterpassRestCompletePage');
-      requestUrl.searchParams.set('responseCode', responseCode);
-      requestUrl.searchParams.set('token', token);
-      requestUrl.searchParams.set(
-        'three_d_secure',
-        body.transactionType?.includes('3D') ? 'true' : 'false'
-      );
-      requestUrl.searchParams.set(
-        'transactionType',
-        body.transactionType || ''
-      );
-
-      const requestHeaders = {
-        'Content-Type': 'application/x-www-form-urlencoded',
-        'X-Requested-With': 'XMLHttpRequest',
-        Cookie: req.headers.get('cookie') ?? '',
-        'x-currency': req.cookies.get('pz-currency')?.value ?? '',
-        'x-forwarded-for': ip,
-        'User-Agent': req.headers.get('user-agent') ?? ''
-      };
-
-      const request = await fetch(requestUrl.toString(), {
-        method: 'POST',
-        headers: requestHeaders,
-        body: new URLSearchParams(body)
-      });
-
-      logger.info('Masterpass REST callback request', {
-        requestUrl: requestUrl.toString(),
-        status: request.status,
-        requestHeaders,
-        ip
-      });
-
-      const response = await request.json();
-
-      const { context_list: contextList, errors } = response;
-
-      let redirectUrl = response.redirect_url;
-
-      if (!redirectUrl && contextList && contextList.length > 0) {
-        for (const context of contextList) {
-          if (context.page_context && context.page_context.redirect_url) {
-            redirectUrl = context.page_context.redirect_url;
-            break;
-          }
-        }
+      if (!isMasterpassCompletePage) {
+        return middleware(req, event);
       }
 
-      if (errors && Object.keys(errors).length) {
-        logger.error('Error while processing masterpass REST callback', {
-          middleware: 'masterpass-rest-callback',
-          errors,
-          requestHeaders,
-          ip
+      try {
+        const isPostCheckout = req.cookies.get('pz-post-checkout-flow')?.value === 'true';
+        const requestUrl = new URL(getCheckoutPath(isPostCheckout), Settings.commerceUrl);
+
+        url.searchParams.forEach((value, key) => {
+          requestUrl.searchParams.set(key, value);
         });
 
-        const errorResponse = NextResponse.redirect(
-          `${url.origin}${getUrlPathWithLocale(
-            '/orders/checkout/',
-            req.cookies.get('pz-locale')?.value
-          )}`,
-          {
-            status: 303,
-            headers: {
-              'Set-Cookie': `pz-pos-error=${encodeURIComponent(JSON.stringify(errors))}; path=/;`
-            }
-          }
-        );
+        const formData = await req.formData();
+        const body: Record<string, string> = {};
 
-        // Add error cookie
-        errorResponse.cookies.set('pz-pos-error', JSON.stringify(errors), {
-          path: '/'
+        Array.from(formData.entries()).forEach(([key, value]) => {
+          body[key] = value.toString();
         });
 
-        return errorResponse;
-      }
+        const requestHeaders = {
+          'Content-Type': 'application/x-www-form-urlencoded',
+          'X-Requested-With': 'XMLHttpRequest',
+          Cookie: req.headers.get('cookie') ?? '',
+          'x-currency': req.cookies.get('pz-currency')?.value ?? '',
+          'x-forwarded-for': ip,
+          'User-Agent': req.headers.get('user-agent') ?? ''
+        };
+
+        const request = await fetch(requestUrl.toString(), {
+          method: 'POST',
+          headers: requestHeaders,
+          body: new URLSearchParams(body)
+        });
 
-      logger.info('Masterpass REST callback response', {
-        middleware: 'masterpass-rest-callback',
-        contextList,
-        redirectUrl,
-        ip
-      });
-
-      if (!redirectUrl) {
-        logger.warn(
-          'No redirection url found in response. Redirecting to checkout page.',
-          {
+        const response = await request.json();
+        const { errors } = response;
+
+        if (errors && Object.keys(errors).length) {
+          logger.error('Error while processing MasterpassRestCompletePage', {
             middleware: 'masterpass-rest-callback',
-            requestHeaders,
-            response: JSON.stringify(response),
+            errors,
             ip
-          }
-        );
-
-        const redirectUrlWithLocale = `${url.origin}${getUrlPathWithLocale(
-          '/orders/checkout/',
-          req.cookies.get('pz-locale')?.value
-        )}`;
-
-        return NextResponse.redirect(redirectUrlWithLocale, 303);
-      }
-
-      const redirectUrlWithLocale = `${url.origin}${getUrlPathWithLocale(
-        redirectUrl,
-        req.cookies.get('pz-locale')?.value
-      )}`;
+          });
+
+          const errorResponse = NextResponse.redirect(
+            `${url.origin}${getUrlPathWithLocale(
+              '/orders/checkout/',
+              req.cookies.get('pz-locale')?.value
+            )}`,
+            303
+          );
+
+          // Add error cookie
+          errorResponse.cookies.set('pz-pos-error', JSON.stringify(errors), {
+            path: '/'
+          });
+
+          return errorResponse;
+        }
 
-      logger.info('Redirecting after masterpass REST callback', {
-        middleware: 'masterpass-rest-callback',
-        redirectUrl: redirectUrlWithLocale,
-        ip
-      });
+        const redirectUrl =
+          response.redirect_url ||
+          response.context_list?.[0]?.page_context?.redirect_url;
+
+        if (redirectUrl) {
+          const nextResponse = NextResponse.redirect(
+            `${url.origin}${getUrlPathWithLocale(redirectUrl, req.cookies.get('pz-locale')?.value)}`,
+            303
+          );
+
+          // Forward set-cookie headers from the upstream response
+          const setCookieHeader = request.headers.get('set-cookie');
+          if (setCookieHeader) {
+            setCookieHeader.split(',').forEach((cookie) => {
+              nextResponse.headers.append('Set-Cookie', cookie.trim());
+            });
+          }
 
-      const nextResponse = NextResponse.redirect(redirectUrlWithLocale, 303);
+          return nextResponse;
+        }
 
-      // Forward set-cookie headers from the upstream response
-      const setCookieHeader = request.headers.get('set-cookie');
-      if (setCookieHeader) {
-        setCookieHeader.split(',').forEach((cookie) => {
-          nextResponse.headers.append('Set-Cookie', cookie.trim());
+        return NextResponse.redirect(
+          `${url.origin}${getUrlPathWithLocale('/orders/checkout/', req.cookies.get('pz-locale')?.value)}`,
+          303
+        );
+      } catch (error) {
+        logger.error('Error while processing MasterpassRestCompletePage', {
+          middleware: 'masterpass-rest-callback',
+          error,
+          ip
         });
-      }
 
-      return nextResponse;
-    } catch (error) {
-      logger.error('Error while processing masterpass REST callback', {
-        middleware: 'masterpass-rest-callback',
-        error,
-        requestHeaders: {
-          Cookie: req.headers.get('cookie') ?? '',
-          'x-currency': req.cookies.get('pz-currency')?.value ?? ''
-        },
-        ip
-      });
-
-      return NextResponse.redirect(
-        `${url.origin}${getUrlPathWithLocale(
-          '/orders/checkout/',
-          req.cookies.get('pz-locale')?.value
-        )}`,
-        303
-      );
-    }
-  };
+        return NextResponse.redirect(
+          `${url.origin}${getUrlPathWithLocale('/orders/checkout/', req.cookies.get('pz-locale')?.value)}`,
+          303
+        );
+      }
+    };
 
 export default withMasterpassRestCallback;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@akinon/next",
   "description": "Core package for Project Zero Next",
-  "version": "2.0.16-beta.0",
+  "version": "2.0.16-rc.1",
   "private": false,
   "license": "MIT",
   "bin": {
@@ -36,7 +36,7 @@
     "set-cookie-parser": "2.6.0"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "2.0.16-beta.0",
+    "@akinon/eslint-plugin-projectzero": "2.0.16-rc.1",
     "@babel/core": "7.26.10",
     "@babel/preset-env": "7.26.9",
     "@babel/preset-typescript": "7.27.0",

package/plugins.d.ts

@@ -37,6 +37,16 @@ declare module '@akinon/pz-cybersource-uc/src/redux/middleware' {
   export default middleware as any;
 }
 
+declare module '@akinon/pz-apple-pay' {}
+
+declare module '@akinon/pz-similar-products' {
+  export const SimilarProductsModal: any;
+  export const SimilarProductsFilterSidebar: any;
+  export const SimilarProductsResultsGrid: any;
+  export const SimilarProductsPlugin: any;
+  export const SimilarProductsButtonPlugin: any;
+}
+
 declare module '@akinon/pz-cybersource-uc/src/redux/reducer' {
   export default reducer as any;
 }

package/plugins.js

@@ -16,6 +16,7 @@ module.exports = [
   'pz-tabby-extension',
   'pz-apple-pay',
   'pz-tamara-extension',
+  'pz-similar-products',
   'pz-cybersource-uc',
   'pz-hepsipay',
   'pz-flow-payment',

package/redux/middlewares/checkout.ts

@@ -26,13 +26,28 @@ import {
 } from '../../redux/reducers/checkout';
 import { RootState, TypedDispatch } from 'redux/store';
 import { checkoutApi } from '../../data/client/checkout';
-import { CheckoutContext, PreOrder } from '../../types';
+import { CheckoutContext, MiddlewareAction, PreOrder } from '../../types';
 import { getCookie } from '../../utils';
 import settings from 'settings';
 import { LocaleUrlStrategy } from '../../localization';
 import { showMobile3dIframe } from '../../utils/mobile-3d-iframe';
 import { showRedirectionIframe } from '../../utils/redirection-iframe';
 
+const IFRAME_REDIRECTION_KEY = 'pz-iframe-redirection-active';
+
+const isIframeRedirectionActive = () =>
+  typeof window !== 'undefined' &&
+  sessionStorage.getItem(IFRAME_REDIRECTION_KEY) === 'true';
+
+const setIframeRedirectionActive = (active: boolean) => {
+  if (typeof window === 'undefined') return;
+  if (active) {
+    sessionStorage.setItem(IFRAME_REDIRECTION_KEY, 'true');
+  } else {
+    sessionStorage.removeItem(IFRAME_REDIRECTION_KEY);
+  }
+};
+
 interface CheckoutResult {
   payload: {
     errors?: Record<string, string[]>;
@@ -69,7 +84,7 @@ export const redirectUrlMiddleware: Middleware = () => {
     const result = next(action) as CheckoutResult;
     const redirectUrl = result?.payload?.redirect_url;
 
-    if (redirectUrl) {
+    if (redirectUrl && !isIframeRedirectionActive()) {
       const currentLocale = getCookie('pz-locale');
 
       let url = redirectUrl;
@@ -99,8 +114,15 @@ export const contextListMiddleware: Middleware = ({
     const { isMobileApp, userPhoneNumber } = getState().root;
     const result = next(action) as CheckoutResult;
     const preOrder = result?.payload?.pre_order;
+    const act = action as MiddlewareAction;
 
     if (result?.payload?.context_list) {
+      const endpointName = act.meta?.arg?.endpointName;
+      const isBinNumberResponse = endpointName === 'setBinNumber';
+      const hasCardTypeInContextList = result.payload.context_list.some(
+        (ctx) => ctx.page_context.card_type
+      );
+
       result.payload.context_list.forEach((context) => {
         const redirectUrl = context.page_context.redirect_url;
         const isIframe = context.page_context.is_iframe ?? false;
@@ -134,6 +156,7 @@ export const contextListMiddleware: Middleware = ({
           if (isMobileDevice && isIframePaymentOptionIncluded) {
             showMobile3dIframe(urlObj.toString());
           } else if (isIframe) {
+            setIframeRedirectionActive(true);
             showRedirectionIframe(urlObj.toString());
           } else {
             window.location.href = urlObj.toString();
@@ -209,15 +232,34 @@ export const contextListMiddleware: Middleware = ({
             (ctx) => ctx.page_name === 'DeliveryOptionSelectionPage'
           )
         ) {
+          const isCreditCardPayment =
+            preOrder?.payment_option?.payment_type === 'credit_card' ||
+            preOrder?.payment_option?.payment_type === 'masterpass';
+
           if (context.page_context.card_type) {
             dispatch(setCardType(context.page_context.card_type));
+          } else if (
+            isCreditCardPayment &&
+            isBinNumberResponse &&
+            !hasCardTypeInContextList
+          ) {
+            dispatch(setCardType(null));
+            dispatch(setInstallmentOptions([]));
           }
 
           if (
             context.page_context.installments &&
             preOrder?.payment_option?.payment_type !== 'masterpass_rest'
           ) {
-            dispatch(setInstallmentOptions(context.page_context.installments));
+            if (
+              !isCreditCardPayment ||
+              context.page_context.card_type ||
+              hasCardTypeInContextList
+            ) {
+              dispatch(
+                setInstallmentOptions(context.page_context.installments)
+              );
+            }
           }
         }
 

package/redux/middlewares/pre-order/installment-option.ts

@@ -14,9 +14,17 @@ export const installmentOptionMiddleware: Middleware = ({
       return result;
     }
 
-    const { installmentOptions } = getState().checkout;
+    const { installmentOptions, cardType } = getState().checkout;
     const { endpoints: apiEndpoints } = checkoutApi;
 
+    const isCreditCardPayment =
+      preOrder?.payment_option?.payment_type === 'credit_card' ||
+      preOrder?.payment_option?.payment_type === 'masterpass';
+
+    if (isCreditCardPayment && !cardType) {
+      return result;
+    }
+
     if (
       !preOrder?.installment &&
       preOrder?.payment_option?.payment_type !== 'saved_card' &&

package/types/index.ts

@@ -85,6 +85,31 @@ export interface Settings {
   };
   usePrettyUrlRoute?: boolean;
   commerceUrl: string;
+  /**
+   * This option allows you to track Sentry events on the client side, in addition to server and edge environments.
+   *
+   * It overrides process.env.NEXT_PUBLIC_SENTRY_DSN and process.env.SENTRY_DSN.
+   */
+  sentryDsn?: string;
+  /**
+   * CSRF cookie hardening settings.
+   *
+   * When `httpOnly` is `true`, the `csrftoken` cookie is set with the
+   * `HttpOnly`, `Secure` (production) and `SameSite=Lax` flags. The token is
+   * never exposed to the browser: instead of the client mirroring the cookie
+   * into the `x-csrftoken` header, the Next.js proxy (BFF) reads the cookie
+   * server-side and injects the header before forwarding state-changing
+   * requests to the commerce backend, after validating the request `Origin`.
+   *
+   * Because the token no longer reaches JS, brand code must NOT rely on
+   * reading `csrftoken` from `document.cookie` or `getCookie('csrftoken')`
+   * when this flag is enabled — all CSRF handling happens on the server.
+   *
+   * @default false
+   */
+  csrf?: {
+    httpOnly?: boolean;
+  };
   redis: {
     defaultExpirationTime: number;
   };
@@ -217,6 +242,7 @@ export interface Settings {
     separator?: string;
     segments: PzSegmentDefinition[];
   };
+  payloadOptimization?: import('../utils/payload-optimizer').PayloadOptimizationConfig;
 }
 
 export interface CacheOptions {
@@ -276,7 +302,9 @@ export interface PzSegmentsConfig {
 }
 
 // Search params type compatible with both Next.js resolved searchParams and URLSearchParams
-export type SearchParams = Record<string, string | string[] | undefined> | URLSearchParams;
+export type SearchParams =
+  | Record<string, string | string[] | undefined>
+  | URLSearchParams;
 
 // Raw Next 16 server prop shape, used at the middleware/HOC boundary before normalization
 export type RawSearchParams = Record<string, string | string[] | undefined>;
@@ -309,14 +337,16 @@ export interface RootLayoutProps<T = any> extends LayoutProps<T> {
 
 // Async versions for Next.js 16 generateMetadata and internal use
 export interface AsyncPageProps<T = any> {
-  params: Promise<T & {
-    pz?: string;
-    commerce?: string;
-    locale?: string;
-    currency?: string;
-    url?: string;
-    [key: string]: any;
-  }>;
+  params: Promise<
+    T & {
+      pz?: string;
+      commerce?: string;
+      locale?: string;
+      currency?: string;
+      url?: string;
+      [key: string]: any;
+    }
+  >;
   searchParams: Promise<{ [key: string]: string | string[] | undefined }>;
 }
 

package/utils/csrf.ts

@@ -0,0 +1,37 @@
+import settings from 'settings';
+
+/**
+ * Whether the Django `csrftoken` cookie should be hardened with the
+ * `HttpOnly` flag.
+ *
+ * When enabled, the token never reaches the browser: the Next.js proxy
+ * (BFF) reads the cookie server-side and injects the `x-csrftoken` header
+ * before forwarding state-changing requests to the commerce backend. See
+ * `api/client.ts`.
+ */
+export function isCsrfHttpOnly(): boolean {
+  return settings.csrf?.httpOnly === true;
+}
+
+export interface CsrfCookieFlags {
+  httpOnly: boolean;
+  secure: boolean;
+  sameSite: 'lax';
+}
+
+/**
+ * Cookie attributes applied to the `csrftoken` cookie wherever it is set
+ * (middleware bootstrap, auth login rotation, proxy passthrough).
+ *
+ * `SameSite=Lax` is the Next.js-layer CSRF defense: the browser will not
+ * attach the cookie on cross-site state-changing requests, so the proxy's
+ * server-side header injection cannot be abused from a third-party origin.
+ */
+export function getCsrfCookieFlags(): CsrfCookieFlags {
+  const httpOnly = isCsrfHttpOnly();
+  return {
+    httpOnly,
+    secure: process.env.NODE_ENV === 'production',
+    sameSite: 'lax'
+  };
+}

package/utils/get-root-hostname.ts

@@ -1,4 +1,5 @@
 import Settings from 'settings';
+import { LocaleUrlStrategy } from '../localization';
 
 export default function getRootHostname(
   url: string | undefined
@@ -26,3 +27,20 @@ export default function getRootHostname(
     return null;
   }
 }
+
+interface HeaderLike {
+  get(name: string): string | null;
+}
+
+export function getRequestRootHostname(
+  headerStore: HeaderLike
+): string | null {
+  if (Settings.localization.localeUrlStrategy !== LocaleUrlStrategy.Subdomain) {
+    return null;
+  }
+
+  const fallbackHost =
+    headerStore.get('x-forwarded-host') || headerStore.get('host');
+  const hostname = process.env.NEXT_PUBLIC_URL || `https://${fallbackHost}`;
+  return getRootHostname(hostname);
+}

package/utils/index.ts

@@ -10,6 +10,7 @@ export * from './get-currency-label';
 export * from './pz-segments';
 export * from './get-checkout-path';
 export * from './format-error-message';
+export * from './csrf';
 
 export function getCookie(name: string) {
   if (typeof document === 'undefined') {