@akinon/next 1.2.0 → 1.3.0

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @akinon/next
 
+## 1.3.0
+
+### Minor Changes
+
+- Refactor currency and locale selection
+- Update TS types
+- Fix 3D redirection middleware
+- Refactor logging
+
 ## 1.2.0
 
 ### Minor Changes

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/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/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.2.0",
+  "version": "1.3.0",
   "private": false,
   "license": "MIT",
   "bin": {

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/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) => {