@akinon/next 1.1.1 → 1.3.0

package/CHANGELOG.md

@@ -1,10 +1,21 @@
 # @akinon/next
 
-## 1.1.1
+## 1.3.0
 
-### Patch Changes
+### Minor Changes
+
+- Refactor currency and locale selection
+- Update TS types
+- Fix 3D redirection middleware
+- Refactor logging
+
+## 1.2.0
+
+### Minor Changes
 
-- Refactor Sentry configs
+- Refactor Sentry config.
+- Add localeIncludedPrettyUrlPattern option to settings.
+- Refactor getRetailStoreStock mutation.
 
 ## 1.1.0
 

package/components/client-root.tsx

@@ -1,15 +1,7 @@
 'use client';
 
 import { usePathname } from 'next/navigation';
-import { useEffect } from 'react';
-import { api } from '../data/client/api';
-import {
-  useClearBasketMutation,
-  useGetBasketQuery
-} from '../data/client/basket';
-import { useAppDispatch, useAppSelector } from '../redux/hooks';
-import { getCookie, removeCookie } from '../utils';
-import { useRouter } from '../hooks';
+import { useAppSelector } from '../redux/hooks';
 
 export default function ClientRoot({
   children,
@@ -18,39 +10,8 @@ export default function ClientRoot({
   children: React.ReactNode;
   sessionId?: string;
 }) {
-  const dispatch = useAppDispatch();
   const pathname = usePathname();
-  const router = useRouter();
   const { isMobileApp } = useAppSelector((state) => state.root);
-  const { data: basketData, isSuccess } = useGetBasketQuery();
-  const [clearBasket] = useClearBasketMutation();
-  const resetClientCache = getCookie('pz-reset-client-cache') === 'true';
-  const resetBasket = getCookie('pz-reset-basket') === 'true';
-
-  useEffect(() => {
-    if (basketData?.basketitem_set.length && resetBasket) {
-      dispatch(
-        api.util.invalidateTags([
-          'Checkout',
-          'Product',
-          'Addresses',
-          'Favorite',
-          'Basket'
-        ])
-      );
-
-      clearBasket();
-    }
-
-    removeCookie('pz-reset-basket');
-  }, [resetBasket, isSuccess, basketData]);
-
-  useEffect(() => {
-    if (resetClientCache) {
-      removeCookie('pz-reset-client-cache');
-      location.reload();
-    }
-  }, [resetClientCache]);
 
   if (isMobileApp && pathname.includes('/orders/completed')) {
     ((window.parent || window) as any)?.ReactNativeWebView?.postMessage?.(

package/components/selected-payment-option-view.tsx

@@ -51,6 +51,9 @@ export default function SelectedPaymentOptionView() {
             } else if (payment_option.payment_type === 'loyalty_money') {
               promise = import(`views/checkout/steps/payment/options/loyalty`);
             }
+            // else if (payment_option.payment_type === 'gpay') {
+            //   promise = import(`views/checkout/steps/payment/options/gpay`);
+            // }
           } catch (error) {}
 
           return promise

package/data/client/product.ts

@@ -23,7 +23,7 @@ type GetProduct = {
   pk: number;
   searchParams?: URLSearchParams;
   groupProduct?: boolean;
-  [key:string]: any;
+  [key: string]: any;
 };
 
 export const productApi = api.injectEndpoints({
@@ -34,7 +34,7 @@ export const productApi = api.injectEndpoints({
       })
     }),
     getProductByParams: build.query<ProductResult, GetProduct>({
-      query: ({pk, searchParams, groupProduct, ...params}) => {
+      query: ({ pk, searchParams, groupProduct, ...params }) => {
         let url = groupProduct
           ? product.getGroupProductByPk(pk)
           : product.getProductByPk(pk);
@@ -50,11 +50,10 @@ export const productApi = api.injectEndpoints({
     }),
     getRetailStoreStock: build.mutation<StockResultType, FindInStoreFormType>({
       query: (body) => {
-        const { productPk, store, variant } = body;
-        const hasVariant = variant ? `&integration_beden=${variant}` : '';
+        const { productPk, queryString } = body;
         return {
           url: buildClientRequestUrl(
-            product.getRetailStoreStock(productPk, store, hasVariant),
+            product.getRetailStoreStock(productPk, queryString),
             {
               contentType: 'application/json'
             }

package/data/urls.ts

@@ -116,8 +116,8 @@ export const product = {
   installments: (productId: number) => `/payments/cards/product/${productId}`,
   getProductByPk: (pk: number) => `/product/${pk}`,
   getGroupProductByPk: (pk: number) => `/group-product/${pk}`,
-  getRetailStoreStock: (productPk: string, store: string, hasVariant: string) =>
-    `/retail_store_stock/${productPk}?city_id=${store}${hasVariant}`,
+  getRetailStoreStock: (productPk: string, queryString: string) =>
+    `/retail_store_stock/${productPk}?${queryString}`,
   addProduct: '/baskets/basket',
   slug: (slug: string) => `/${slug}`,
   categoryUrl: (pk: number) => `/products/${pk}/category_nodes/?limit=1`,

package/hocs/server/with-segment-defaults.tsx

@@ -74,7 +74,10 @@ const checkRedisVariables = () => {
     process.env.CACHE_SECRET
   ];
 
-  if (!requiredVariableValues.every((v) => v)) {
+  if (
+    !requiredVariableValues.every((v) => v) &&
+    process.env.NODE_ENV === 'production'
+  ) {
     logger.warn('Redis cache variables are not set', {
       requiredVariables: ['CACHE_HOST', 'CACHE_PORT', 'CACHE_SECRET'],
       values: requiredVariableValues

package/hooks/use-localization.ts

@@ -2,7 +2,7 @@
 
 import { LocalizationContext } from '../localization/provider';
 import { useContext } from 'react';
-import { urlLocaleMatcherRegex } from '../utils';
+import { setCookie, urlLocaleMatcherRegex } from '../utils';
 import { LocaleUrlStrategy } from '../localization';
 import { useRouter } from 'next/navigation';
 
@@ -36,7 +36,21 @@ export const useLocalization = () => {
       ''
     );
 
-    router.push(`${localePath}${pathnameWithoutLocale}${location.search}`);
+    // router.push is not used because reloading the page also clears the client side cache.
+    location.href = `${localePath}${pathnameWithoutLocale}${location.search}`;
+  };
+
+  /**
+   * Sets the currency.
+   *
+   * If the currency is linked to the locale by using `getActiveCurrencyCode` function in the settings,
+   * you need to use `setLocale` instead of this.
+   * @param currency Currency code defined in the settings.
+   */
+  const setCurrency = (currency: string) => {
+    // It is a temp cookie to set currency in `currency` middleware.
+    setCookie('pz-set-currency', currency);
+    location.reload();
   };
 
   return {
@@ -52,12 +66,13 @@ export const useLocalization = () => {
      */
     t: (path: string) => translate(path),
     setLocale,
+    setCurrency,
     locale,
     currency,
     locales,
     currencies,
     defaultLocaleValue,
     defaultCurrencyCode,
-    localeUrlStrategy,
+    localeUrlStrategy
   };
 };

package/lib/cache.ts

@@ -140,7 +140,7 @@ export class Cache {
       }
     }
 
-    logger.info('Redis cache miss. Setting new value...', { key });
+    logger.debug('Redis cache miss. Setting new value...', { key });
 
     const data = await handler();
 

package/middlewares/currency.ts

@@ -1,8 +1,20 @@
 import { NextFetchEvent, NextMiddleware } from 'next/server';
-import { ROUTES } from 'routes';
 import settings from 'settings';
 import { PzNextRequest } from '.';
 import logger from '../utils/log';
+import { basket } from '../data/urls';
+
+const resetBasket = async (req: PzNextRequest) => {
+  await fetch(`${settings.commerceUrl}${basket.getBasket}`, {
+    method: 'DELETE',
+    headers: {
+      Cookie: req.headers.get('cookie') || '',
+      'Content-Type': 'application/json',
+      'X-CSRFToken': req.cookies.get('csrftoken')?.value ?? '',
+      Referer: settings.commerceUrl
+    }
+  });
+};
 
 const withCurrency =
   (middleware: NextMiddleware) =>
@@ -34,6 +46,10 @@ const withCurrency =
         defaultCurrencyCode
       });
 
+      if (req.cookies.get('pz-set-currency')) {
+        activeCurrency = req.cookies.get('pz-set-currency')?.value;
+      }
+
       if (
         !activeCurrency ||
         !currencies.find((c) => c.code === activeCurrency)
@@ -44,6 +60,10 @@ const withCurrency =
         activeCurrency = defaultCurrencyCode;
       }
 
+      if (req.cookies.get('pz-currency')?.value !== activeCurrency) {
+        resetBasket(req);
+      }
+
       req.middlewareParams.rewrites.currency = activeCurrency;
     } catch (error) {
       logger.error('withCurrency error', error);

package/middlewares/default.ts

@@ -154,18 +154,6 @@ const withPzDefault =
                         secure: true
                       });
 
-                      if (
-                        req.cookies.get('pz-currency') &&
-                        req.cookies.get('pz-currency').value !== currency
-                      ) {
-                        logger.debug('Currency changed', {
-                          currency,
-                          oldCurrency: req.cookies.get('pz-currency')?.value
-                        });
-
-                        middlewareResult.cookies.set('pz-reset-basket', 'true');
-                      }
-
                       if (
                         req.cookies.get('pz-locale') &&
                         req.cookies.get('pz-locale').value !== locale
@@ -174,11 +162,6 @@ const withPzDefault =
                           locale,
                           oldLocale: req.cookies.get('pz-locale')?.value
                         });
-
-                        middlewareResult.cookies.set(
-                          'pz-reset-client-cache',
-                          'true'
-                        );
                       }
 
                       middlewareResult.headers.set(
@@ -186,6 +169,10 @@ const withPzDefault =
                         req.nextUrl.toString()
                       );
 
+                      if (req.cookies.get('pz-set-currency')) {
+                        middlewareResult.cookies.delete('pz-set-currency');
+                      }
+
                       if (process.env.ACC_APP_VERSION) {
                         middlewareResult.headers.set(
                           'acc-app-version',

package/middlewares/pretty-url.ts

@@ -76,7 +76,13 @@ const withPrettyUrl =
       return middleware(req, event);
     }
 
-    const prettyUrlResult = await resolvePrettyUrl(prettyUrlPathname);
+    const prettyUrlResult = await resolvePrettyUrl(
+      Settings.localization.localeIncludedPrettyUrlPattern?.test(
+        prettyUrlPathname
+      )
+        ? url.pathname
+        : prettyUrlPathname
+    );
 
     if (prettyUrlResult.matched) {
       req.middlewareParams.rewrites.prettyUrl = prettyUrlResult.path;

package/middlewares/three-d-redirection.ts

@@ -38,25 +38,6 @@ const withThreeDRedirection =
     }
 
     const body = await streamToString(req.body);
-    const params = body.split('&');
-    const encodedPzParams = decodeURIComponent(
-      params.find((param) => param.startsWith('pzparams'))?.split('=')[1] ?? ''
-    );
-
-    logger.debug('Encoded 3D form extra params', encodedPzParams);
-
-    if (!encodedPzParams.length) {
-      logger.warn('No pzparams found in 3D form params');
-      return middleware(req, event);
-    }
-
-    const pzParams = JSON.parse(decodeURIComponent(encodedPzParams)) as {
-      session: string;
-      locale: string;
-    };
-
-    logger.debug('3D form extra params', pzParams);
-
     const requestUrl = `${Settings.commerceUrl}/orders/checkout/${url.search}`;
 
     const request = await fetch(requestUrl, {
@@ -64,7 +45,7 @@ const withThreeDRedirection =
       headers: {
         'X-Requested-With': 'XMLHttpRequest',
         'Content-Type': 'application/x-www-form-urlencoded',
-        Cookie: `osessionid=${pzParams.session}`
+        Cookie: `osessionid=${req.cookies.get('osessionid')?.value ?? ''}`
       },
       body
     });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@akinon/next",
   "description": "Core package for Project Zero Next",
-  "version": "1.1.1",
+  "version": "1.3.0",
   "private": false,
   "license": "MIT",
   "bin": {

package/plugins.js

@@ -4,4 +4,5 @@ module.exports = [
   'pz-one-click-checkout',
   'pz-pay-on-delivery',
   'pz-checkout-gift-pack',
+  'pz-gpay'
 ];

package/types/commerce/account.ts

@@ -42,18 +42,14 @@ export type AccountChangePasswordFormType = {
 };
 
 export type AccountProfileFormType = {
+  date_of_birth: string;
+  email_allowed: boolean;
   first_name: string;
+  gender: string;
   last_name: string;
   phone: string;
-  email_allowed: boolean;
   sms_allowed: boolean;
-  gender: string;
-  email: string;
-  birthdate_day: string;
-  birthdate_month: string;
-  birthdate_year: string;
-  country_code: string;
-  date_of_birth: string;
+  [key: string]: any;
 };
 
 export type ContactFormType = {

package/types/commerce/product.ts

@@ -83,9 +83,8 @@ export type StockResultType = [
 ];
 
 export type FindInStoreFormType = {
-  store: string;
-  variant: string;
   productPk: string;
+  queryString: string;
 };
 
 export interface ProductCategoryResult {

package/types/index.ts

@@ -148,6 +148,20 @@ export interface Settings {
       locale: string;
       defaultCurrencyCode: string;
     }) => string;
+    /**
+     * By default, pretty url resolver excludes locale from url.
+     * In some cases, you may want to create flatpages and include locale in urls.
+     * This is useful if you want to manage your flatpages for different countries by using locale value.
+     *
+     * @example
+     * // URL entered in Omnitron: /en-us/pages/about-us
+     * // Locale Strategy: LocaleUrlStrategy.ShowAllLocales
+     *
+     * // If you don't use this option, pretty url resolver will remove the locale and it will be resolved as '/pages/about-us' and you will get 404. Because there is no page with this url. But if you use this option, it will be resolved as '/en-us/pages/about-us' and you will get the page.
+     * // Following pattern will include locale for all urls including '/pages/'.
+     * localeIncludedPrettyUrlPattern: new RegExp('.+/pages/.+$')
+     */
+    localeIncludedPrettyUrlPattern?: RegExp;
   };
   rewrites?: Array<{
     source: string;

package/utils/index.ts

@@ -35,6 +35,9 @@ export function removeCookie(name: string) {
   document.cookie = name + '=' + '; expires=' + date + '; path=/';
 }
 
+/**
+ * @deprecated Use setCurrency method in useLocalization hook instead.
+ */
 export function setCurrency(currency: string) {
   if (getCookie('pz-currency') !== currency) {
     setCookie('pz-reset-basket', 'true');

package/utils/log.ts

@@ -1,5 +1,3 @@
-import * as Sentry from '@sentry/nextjs';
-
 enum LogLevel {
   TRACE = 'trace',
   DEBUG = 'debug',
@@ -94,15 +92,6 @@ const error: LoggerFn = (message, payload) => {
     message,
     payload
   });
-
-  Sentry.withScope(function (scope) {
-    scope.setLevel('error');
-
-    Sentry.captureException({
-      message,
-      extra: payload
-    });
-  });
 };
 
 const warn: LoggerFn = (message, payload) => {
@@ -111,15 +100,6 @@ const warn: LoggerFn = (message, payload) => {
     message,
     payload
   });
-
-  Sentry.withScope(function (scope) {
-    scope.setLevel('warning');
-
-    Sentry.captureEvent({
-      message,
-      extra: payload
-    });
-  });
 };
 
 const debug: LoggerFn = (message, payload) => {