@akinon/next 1.92.0-rc.9 → 1.92.0-snapshot-ZERO-3449-20250618101111

package/redux/middlewares/checkout.ts

@@ -20,8 +20,7 @@ import {
   setShippingOptions,
   setHepsipayAvailability,
   setWalletPaymentData,
-  setPayOnDeliveryOtpModalActive,
-  setUnavailablePaymentOptions
+  setPayOnDeliveryOtpModalActive
 } from '../../redux/reducers/checkout';
 import { RootState, TypedDispatch } from 'redux/store';
 import { checkoutApi } from '../../data/client/checkout';
@@ -51,11 +50,7 @@ export const errorMiddleware: Middleware = ({ dispatch }: MiddlewareParams) => {
     const result: CheckoutResult = next(action);
     const errors = result?.payload?.errors;
 
-    if (
-      !!errors &&
-      ((typeof errors === 'object' && Object.keys(errors).length > 0) ||
-        (Array.isArray(errors) && errors.length > 0))
-    ) {
+    if (errors) {
       dispatch(setErrors(errors));
     }
 
@@ -181,14 +176,6 @@ export const contextListMiddleware: Middleware = ({
           dispatch(setPaymentOptions(context.page_context.payment_options));
         }
 
-        if (context.page_context.unavailable_options) {
-          dispatch(
-            setUnavailablePaymentOptions(
-              context.page_context.unavailable_options
-            )
-          );
-        }
-
         if (context.page_context.credit_payment_options) {
           dispatch(
             setCreditPaymentOptions(context.page_context.credit_payment_options)

package/redux/reducers/checkout.ts

@@ -40,7 +40,6 @@ export interface CheckoutState {
   shippingOptions: ShippingOption[];
   dataSourceShippingOptions: DataSource[];
   paymentOptions: PaymentOption[];
-  unavailablePaymentOptions: PaymentOption[];
   creditPaymentOptions: CheckoutCreditPaymentOption[];
   selectedCreditPaymentPk: number;
   paymentChoices: PaymentChoice[];
@@ -61,8 +60,6 @@ export interface CheckoutState {
       countryCode: string;
       currencyCode: string;
       version: string;
-      public_key: string;
-      [key: string]: any;
     };
     detail: {
       label: string;
@@ -97,7 +94,6 @@ const initialState: CheckoutState = {
   shippingOptions: [],
   dataSourceShippingOptions: [],
   paymentOptions: [],
-  unavailablePaymentOptions: [],
   creditPaymentOptions: [],
   selectedCreditPaymentPk: null,
   paymentChoices: [],
@@ -161,9 +157,6 @@ const checkoutSlice = createSlice({
     setPaymentOptions(state, { payload }) {
       state.paymentOptions = payload;
     },
-    setUnavailablePaymentOptions(state, { payload }) {
-      state.unavailablePaymentOptions = payload;
-    },
     setPaymentChoices(state, { payload }) {
       state.paymentChoices = payload;
     },
@@ -225,10 +218,9 @@ export const {
   setShippingOptions,
   setDataSourceShippingOptions,
   setPaymentOptions,
-  setUnavailablePaymentOptions,
-  setPaymentChoices,
   setCreditPaymentOptions,
   setSelectedCreditPaymentPk,
+  setPaymentChoices,
   setCardType,
   setInstallmentOptions,
   setBankAccounts,

package/sentry/index.ts

@@ -13,73 +13,36 @@ const ALLOWED_CLIENT_LOG_TYPES: ClientLogType[] = [
   ClientLogType.CHECKOUT
 ];
 
-const isNetworkError = (exception: unknown): boolean => {
-  if (!(exception instanceof Error)) return false;
-
-  const networkErrorPatterns = [
-    'networkerror',
-    'failed to fetch',
-    'network request failed',
-    'network error',
-    'loading chunk',
-    'chunk load failed'
-  ];
-
-  if (exception.name === 'NetworkError') return true;
-
-  if (exception.name === 'TypeError') {
-    return networkErrorPatterns.some((pattern) =>
-      exception.message.toLowerCase().includes(pattern)
-    );
-  }
-
-  return networkErrorPatterns.some((pattern) =>
-    exception.message.toLowerCase().includes(pattern)
-  );
-};
-
 export const initSentry = (
   type: 'Server' | 'Client' | 'Edge',
   options: Sentry.BrowserOptions | Sentry.NodeOptions | Sentry.EdgeOptions = {}
 ) => {
-  // TODO: Remove Zero Project DSN
+  // TODO: Handle options with ESLint rules
 
-  const baseConfig = {
+  Sentry.init({
     dsn:
-      SENTRY_DSN ||
       options.dsn ||
+      SENTRY_DSN ||
       'https://d8558ef8997543deacf376c7d8d7cf4b@o64293.ingest.sentry.io/4504338423742464',
     initialScope: {
       tags: {
         APP_TYPE: 'ProjectZeroNext',
-        TYPE: type,
-        ...((options.initialScope as any)?.tags || {})
+        TYPE: type
       }
     },
     tracesSampleRate: 0,
-    integrations: []
-  };
-
-  if (type === 'Server' || type === 'Edge') {
-    Sentry.init(baseConfig);
-  } else if (type === 'Client') {
-    Sentry.init({
-      ...baseConfig,
-      beforeSend: (event, hint) => {
-        if (
-          !ALLOWED_CLIENT_LOG_TYPES.includes(
-            event.tags?.LOG_TYPE as ClientLogType
-          )
-        ) {
-          return null;
-        }
-
-        if (isNetworkError(hint?.originalException)) {
-          return null;
-        }
-
-        return event;
+    integrations: [],
+    beforeSend: (event, hint) => {
+      if (
+        type === 'Client' &&
+        !ALLOWED_CLIENT_LOG_TYPES.includes(
+          event.tags?.LOG_TYPE as ClientLogType
+        )
+      ) {
+        return null;
       }
-    });
-  }
+
+      return event;
+    }
+  });
 };

package/types/commerce/order.ts

@@ -114,7 +114,6 @@ export interface Order {
     pk: number;
     name: string;
     slug: string;
-    logo: string;
     [key: string]: any;
   };
 }

package/types/index.ts

@@ -83,6 +83,12 @@ 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;
   redis: {
     defaultExpirationTime: number;
   };
@@ -283,13 +289,7 @@ export interface ButtonProps
   target?: '_blank' | '_self' | '_parent' | '_top';
 }
 
-export interface FileInputProps extends React.HTMLProps<HTMLInputElement> {
-  fileClassName?: string;
-  fileNameWrapperClassName?: string;
-  fileInputClassName?: string;
-  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-  buttonClassName?: string;
-}
+export type FileInputProps = React.HTMLProps<HTMLInputElement>;
 
 export interface PriceProps {
   currencyCode?: string;
@@ -310,19 +310,15 @@ export interface InputProps extends React.HTMLProps<HTMLInputElement> {
 
 export interface AccordionProps {
   isCollapse?: boolean;
-  collapseClassName?: string;
   title?: string;
   subTitle?: string;
   icons?: string[];
   iconSize?: number;
   iconColor?: string;
   children?: ReactNode;
-  headerClassName?: string;
   className?: string;
   titleClassName?: string;
-  subTitleClassName?: string;
   dataTestId?: string;
-  contentClassName?: string;
 }
 
 export interface PluginModuleComponentProps {
@@ -348,19 +344,70 @@ export interface PaginationProps {
   isLoading?: boolean;
 }
 
-export interface ModalProps {
-  portalId: string;
-  children?: React.ReactNode;
-  open?: boolean;
-  setOpen?: (open: boolean) => void;
-  title?: React.ReactNode;
-  showCloseButton?: React.ReactNode;
-  className?: string;
-  overlayClassName?: string;
-  headerWrapperClassName?: string;
-  titleClassName?: string;
-  closeButtonClassName?: string;
-  iconName?: string;
-  iconSize?: number;
-  iconClassName?: string;
+export interface FilterSidebarProps {
+  isFilterMenuOpen: boolean;
+  setIsFilterMenuOpen: (open: boolean) => void;
+  searchResults: any;
+  isLoading: boolean;
+  handleFacetChange: (facetKey: string, choiceValue: string | number) => void;
+  removeFacetFilter: (facetKey: string, choiceValue: string | number) => void;
+  currentImageUrl: string;
+  isCropping: boolean;
+  imageRef: React.RefObject<HTMLImageElement>;
+  fileInputRef: React.RefObject<HTMLInputElement>;
+  crop: any;
+  setCrop: (crop: any) => void;
+  completedCrop: any;
+  setCompletedCrop: (crop: any) => void;
+  handleCropComplete: any;
+  toggleCropMode: () => void;
+  processCompletedCrop: (crop: any) => void;
+  resetCrop: () => void;
+  product: any;
+  activeIndex: number;
+  hasUploadedImage: boolean;
+  handleFileUpload: (event: React.ChangeEvent<HTMLInputElement>) => void;
+  handleResetToOriginal: () => void;
+  fileError: string;
+  showResetButton?: boolean;
+}
+
+export interface SimilarProductsModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  searchResults: any;
+  resultsKey: number;
+  isLoading: boolean;
+  isFilterMenuOpen: boolean;
+  setIsFilterMenuOpen: (open: boolean) => void;
+  handleSortChange: (value: string) => void;
+  handlePageChange: (page: number, sortValue?: string) => void;
+  handleFacetChange: (facetKey: string, choiceValue: string | number) => void;
+  removeFacetFilter: (facetKey: string, choiceValue: string | number) => void;
+  currentImageUrl: string;
+  isCropping: boolean;
+  imageRef: React.RefObject<HTMLImageElement>;
+  fileInputRef: React.RefObject<HTMLInputElement>;
+  crop: any;
+  setCrop: (crop: any) => void;
+  completedCrop: any;
+  setCompletedCrop: (crop: any) => void;
+  handleCropComplete: any;
+  toggleCropMode: () => void;
+  processCompletedCrop: (crop: any) => void;
+  resetCrop: () => void;
+  product: any;
+  activeIndex: number;
+  hasUploadedImage: boolean;
+  handleFileUpload: (event: React.ChangeEvent<HTMLInputElement>) => void;
+  handleResetToOriginal: () => void;
+  fileError: string;
+  showResetButton?: boolean;
+}
+
+export interface ResultsGridProps {
+  searchResults: any;
+  resultsKey: number;
+  isLoading: boolean;
+  handlePageChange: (page: number, sortValue?: string) => void;
 }

package/utils/app-fetch.ts

@@ -43,12 +43,12 @@ const appFetch = async <T>({
     const requestURL = `${decodeURIComponent(commerceUrl)}${url}`;
 
     init.headers = {
-      cookie: nextCookies.toString(),
       ...(init.headers ?? {}),
       ...(ServerVariables.globalHeaders ?? {}),
       'Accept-Language': currentLocale.apiValue,
       'x-currency': currency,
-      'x-forwarded-for': ip
+      'x-forwarded-for': ip,
+      cookie: nextCookies.toString()
     };
 
     init.next = {

package/utils/image-validation.ts

@@ -0,0 +1,303 @@
+export interface ImageValidationResult {
+  isValid: boolean;
+  error?: string;
+}
+
+const IMAGE_SIGNATURES = {
+  jpeg: [
+    { bytes: 'ffd8', minLength: 2, description: 'JPEG (Generic)' },
+    { bytes: 'ffd8ffe0', minLength: 4, description: 'JPEG/JFIF' },
+    { bytes: 'ffd8ffe1', minLength: 4, description: 'JPEG/EXIF' },
+    { bytes: 'ffd8ffe2', minLength: 4, description: 'JPEG/Canon' },
+    { bytes: 'ffd8ffe3', minLength: 4, description: 'JPEG/Samsung' },
+    { bytes: 'ffd8ffe8', minLength: 4, description: 'JPEG/SPIFF' },
+    { bytes: 'ffd8ffed', minLength: 4, description: 'JPEG/Photoshop' }
+  ],
+
+  png: [{ bytes: '89504e470d0a1a0a', minLength: 8, description: 'PNG' }],
+
+  gif: [
+    { bytes: '474946383761', minLength: 6, description: 'GIF87a' },
+    { bytes: '474946383961', minLength: 6, description: 'GIF89a' }
+  ],
+
+  webp: {
+    riff: '52494646',
+    webp: '57454250',
+    minLength: 12,
+    description: 'WebP'
+  },
+
+  avif: {
+    ftyp: '66747970',
+    avif: '61766966',
+    minLength: 12,
+    description: 'AVIF'
+  },
+
+  heic: [
+    {
+      ftyp: '66747970',
+      brand: '68656963',
+      minLength: 12,
+      description: 'HEIC'
+    },
+    {
+      ftyp: '66747970',
+      brand: '6d696631',
+      minLength: 12,
+      description: 'HEIF'
+    }
+  ],
+
+  bmp: [{ bytes: '424d', minLength: 2, description: 'BMP' }],
+
+  tiff: [
+    { bytes: '49492a00', minLength: 4, description: 'TIFF (Little Endian)' },
+    { bytes: '4d4d002a', minLength: 4, description: 'TIFF (Big Endian)' }
+  ]
+} as const;
+
+const SUPPORTED_MIME_TYPES = {
+  'image/jpeg': 'jpeg',
+  'image/jpg': 'jpeg',
+  'image/png': 'png',
+  'image/gif': 'gif',
+  'image/webp': 'webp',
+  'image/avif': 'avif',
+  'image/heic': 'heic',
+  'image/heif': 'heic',
+  'image/bmp': 'bmp',
+  'image/tiff': 'tiff',
+  'image/tif': 'tiff'
+} as const;
+
+const FORMAT_NAMES = {
+  jpeg: 'JPEG',
+  png: 'PNG',
+  gif: 'GIF',
+  webp: 'WebP',
+  avif: 'AVIF',
+  heic: 'HEIC/HEIF',
+  bmp: 'BMP',
+  tiff: 'TIFF'
+} as const;
+
+export const isValidImage = (file: File): Promise<boolean> => {
+  return new Promise((resolve) => {
+    if (!(file.type in SUPPORTED_MIME_TYPES)) {
+      resolve(false);
+      return;
+    }
+
+    const img = new Image();
+    img.onload = () => resolve(img.width > 0 && img.height > 0);
+    img.onerror = () => resolve(false);
+    img.src = URL.createObjectURL(file);
+  });
+};
+
+export const checkImageSignature = (file: File): Promise<boolean> => {
+  return new Promise((resolve) => {
+    const formatKey =
+      SUPPORTED_MIME_TYPES[file.type as keyof typeof SUPPORTED_MIME_TYPES];
+    if (!formatKey) {
+      resolve(false);
+      return;
+    }
+
+    const reader = new FileReader();
+    reader.onloadend = (e) => {
+      const result = e.target?.result as ArrayBuffer;
+      const arr = new Uint8Array(result);
+      const header = Array.from(arr)
+        .map((b) => b.toString(16).padStart(2, '0'))
+        .join('');
+
+      let isValid = false;
+
+      switch (formatKey) {
+        case 'jpeg':
+        case 'png':
+        case 'gif':
+        case 'bmp':
+        case 'tiff':
+          const signatures = IMAGE_SIGNATURES[formatKey];
+          isValid = signatures.some((sig) => header.startsWith(sig.bytes));
+          break;
+
+        case 'webp':
+          if (header.length >= 24) {
+            const hasRiff = header.startsWith(IMAGE_SIGNATURES.webp.riff);
+            const hasWebp = header.substr(16, 8) === IMAGE_SIGNATURES.webp.webp;
+            isValid = hasRiff && hasWebp;
+          }
+          break;
+
+        case 'avif':
+          if (header.length >= 24) {
+            const hasFtyp = header.substr(8, 8) === IMAGE_SIGNATURES.avif.ftyp;
+            const hasAvif = header.indexOf(IMAGE_SIGNATURES.avif.avif) !== -1;
+            isValid = hasFtyp && hasAvif;
+          }
+          break;
+
+        case 'heic':
+          if (header.length >= 24) {
+            const hasFtyp =
+              header.substr(8, 8) === IMAGE_SIGNATURES.heic[0].ftyp;
+            const hasHeic = IMAGE_SIGNATURES.heic.some(
+              (variant) => header.indexOf(variant.brand) !== -1
+            );
+            isValid = hasFtyp && hasHeic;
+          }
+          break;
+      }
+
+      resolve(isValid);
+    };
+
+    reader.onerror = () => resolve(false);
+
+    const bytesToRead = ['webp', 'avif', 'heic'].includes(formatKey) ? 24 : 8;
+    reader.readAsArrayBuffer(file.slice(0, bytesToRead));
+  });
+};
+
+export const validateImageMetadata = (dataUrl: string): Promise<boolean> => {
+  return new Promise((resolve) => {
+    const img = new Image();
+    img.onload = () => {
+      if (img.width > 10000 || img.height > 10000) {
+        resolve(false);
+        return;
+      }
+
+      const ratio = img.width / img.height;
+      if (ratio > 5 || ratio < 0.2) {
+        resolve(false);
+        return;
+      }
+
+      resolve(true);
+    };
+    img.onerror = () => resolve(false);
+    img.src = dataUrl;
+  });
+};
+
+export const validateImageFile = async (
+  file: File,
+  maxSizeInMB: number = 5
+): Promise<ImageValidationResult> => {
+  const supportedFormats = Object.values(FORMAT_NAMES);
+  const supportedTypes = Object.keys(SUPPORTED_MIME_TYPES);
+
+  if (file.size > maxSizeInMB * 1024 * 1024) {
+    return {
+      isValid: false,
+      error: `File size should be less than ${maxSizeInMB}MB. Supported formats: ${supportedFormats.join(
+        ', '
+      )}`
+    };
+  }
+
+  if (!supportedTypes.includes(file.type)) {
+    return {
+      isValid: false,
+      error: `Unsupported file type. Please use: ${supportedFormats.join(', ')}`
+    };
+  }
+
+  const isImage = await isValidImage(file);
+  if (!isImage) {
+    return {
+      isValid: false,
+      error: `The selected file is not a valid image. Supported formats: ${supportedFormats.join(
+        ', '
+      )}`
+    };
+  }
+
+  const validSignature = await checkImageSignature(file);
+  if (!validSignature) {
+    return {
+      isValid: false,
+      error: `Invalid image format detected. Supported formats: ${supportedFormats.join(
+        ', '
+      )}`
+    };
+  }
+
+  return { isValid: true };
+};
+
+export const validateImageFromDataUrl = async (
+  dataUrl: string
+): Promise<ImageValidationResult> => {
+  const validMetadata = await validateImageMetadata(dataUrl);
+  if (!validMetadata) {
+    return {
+      isValid: false,
+      error: 'Invalid image properties detected (dimensions or aspect ratio)'
+    };
+  }
+
+  return { isValid: true };
+};
+
+export const debugImageSignature = async (
+  file: File
+): Promise<{
+  mimeType: string;
+  format: string;
+  expectedSignatures: string[];
+  actualHeader: string;
+  isValid: boolean;
+}> => {
+  const formatKey =
+    SUPPORTED_MIME_TYPES[file.type as keyof typeof SUPPORTED_MIME_TYPES];
+
+  return new Promise((resolve) => {
+    const reader = new FileReader();
+    reader.onloadend = (e) => {
+      const result = e.target?.result as ArrayBuffer;
+      const arr = new Uint8Array(result);
+      const header = Array.from(arr.slice(0, 24))
+        .map((b) => b.toString(16).padStart(2, '0'))
+        .join('');
+
+      let expectedSignatures: string[] = [];
+
+      if (formatKey && formatKey in IMAGE_SIGNATURES) {
+        const sigs = IMAGE_SIGNATURES[formatKey];
+        if (Array.isArray(sigs)) {
+          expectedSignatures = sigs.map((s) => s.bytes);
+        } else if ('riff' in sigs) {
+          expectedSignatures = [sigs.riff + 'XXXXXXXX' + sigs.webp];
+        } else if ('ftyp' in sigs) {
+          expectedSignatures = [sigs.ftyp];
+        }
+      }
+
+      resolve({
+        mimeType: file.type,
+        format: formatKey || 'unknown',
+        expectedSignatures,
+        actualHeader: header,
+        isValid: formatKey ? true : false
+      });
+    };
+
+    reader.onerror = () =>
+      resolve({
+        mimeType: file.type,
+        format: 'error',
+        expectedSignatures: [],
+        actualHeader: '',
+        isValid: false
+      });
+
+    reader.readAsArrayBuffer(file.slice(0, 24));
+  });
+};

package/utils/redirect.ts

@@ -3,23 +3,21 @@ import Settings from 'settings';
 import { headers } from 'next/headers';
 import { ServerVariables } from '@akinon/next/utils/server-variables';
 import { getUrlPathWithLocale } from '@akinon/next/utils/localization';
-import { urlLocaleMatcherRegex } from '@akinon/next/utils';
 
 export const redirect = (path: string, type?: RedirectType) => {
   const nextHeaders = headers();
   const pageUrl = new URL(
-    nextHeaders.get('pz-url') ?? process.env.NEXT_PUBLIC_URL ?? ''
+    nextHeaders.get('pz-url') ?? process.env.NEXT_PUBLIC_URL
   );
 
   const currentLocale = Settings.localization.locales.find(
     (locale) => locale.value === ServerVariables.locale
   );
 
-  const callbackUrl = pageUrl.pathname.replace(urlLocaleMatcherRegex, '');
-
+  const callbackUrl = pageUrl.pathname;
   const redirectUrlWithLocale = getUrlPathWithLocale(
     path,
-    currentLocale?.value
+    currentLocale.localePath ?? currentLocale.value
   );
 
   const redirectUrl = `${redirectUrlWithLocale}?callbackUrl=${callbackUrl}`;

package/with-pz-config.js

@@ -16,8 +16,12 @@ const defaultConfig = {
     remotePatterns: [
       {
         protocol: 'https',
-        hostname: '**'
+        hostname: '**.akinoncloud.com'
       },
+      {
+        protocol: 'https',
+        hostname: '**.akinoncdn.com'
+      }
     ]
   },
   modularizeImports: {