@akinon/projectzero 1.48.0-rc.1 → 1.48.0-rc.3

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @akinon/projectzero
 
+## 1.48.0-rc.3
+
+### Minor Changes
+
+- 90282b53: ZERO-2729: Audit packages for yarn and npm and also update app-template
+- 03c4c3eb: ZERO-2731: Update Project Zero CLI command
+- 64699d3: ZERO-2761: Fix invalid import for plugin module
+- 9b6bf91e: ZERO-2660: Change campaings to campaigns
+- 00ffde2f: ZERO-2637: enhance create command with improved messaging
+- d2f0f15c: ZERO-2723: Update sentry version and dependencies
+
+## 1.48.0-rc.2
+
 ## 1.48.0-rc.1
 
 ## 1.48.0-rc.0

package/app-template/CHANGELOG.md

@@ -1,5 +1,149 @@
 # projectzeronext
 
+## 1.48.0-rc.3
+
+### Minor Changes
+
+- 90282b53: ZERO-2729: Audit packages for yarn and npm and also update app-template
+- 572d2e84: ZERO-2667: Add iframe support for redirection payment methods
+- c53ea3e6: ZERO-2609: Reset additional form fields when selectedFormType is not company
+- 97b8bdc9: ZERO-2724: Remove onClick event in shipping options component
+- 714e0b46: ZERO-2759: update pz-click-collect peer dependencies
+- 7521265: ZERO-2787: Fix hover classname for favorite item
+- 8217463: ZERO-2887: Add LoaderSpinner to Filters component
+- 27a5296d: ZERO-2631:Fix Checkbox Click
+- 5a4c607: ZERO-2764: Add case-warning rule to eslint-plugin-projectzero
+- bc2b411: ZERO-2825: Add attribute-based shipping options to checkout page
+- e665a0a: ZERO-2625: Add click outside functionality to close mobile menu
+- 52c1373: ZERO-2619: Added fix flag for the staged linter
+- 552ee8a: ZERO-2777: fix link component usage
+- 03c4c3eb: ZERO-2731: Update Project Zero CLI command
+- 2e6104d: ZERO-2888:Edit the numbering in the pagination and the visibility of the prev and next buttons
+- 64699d3: ZERO-2761: Fix invalid import for plugin module
+- 0d3a913e: ZERO-2725: Update decimal scale in Price component
+- 778a9a0b: ZERO-2740: Upgrade next to 14.2.4
+- 9b6bf91e: ZERO-2660: Change campaings to campaigns
+- 06650ca: ZERO-2620: Remove unnecessary pointer-events-none class
+- 74a12699: ZERO-2658:Edit product name clickability on completed order page
+- 4e1c15c: ZERO-2617: Remove TODO comment in ProductInfo component
+- d3474c64: ZERO-2655: Add data source shipping option
+- d2f0f15c: ZERO-2723: Update sentry version and dependencies
+- 75080fd6: ZERO-2630: Add max limit to postcode area
+- 9609eb2: ZERO-2779: Upgrade for tailwind
+- 91265bba: ZERO-2551: Improve pretty url and caching performance
+- 38a634e: ZERO-2893: Refactor category filter handling and URL parameters
+- 959e1fa: ZERO-2778: Upgrade for nextjs
+- 902d828a: ZERO-2621:edit position of loaderSpinner in favorites page
+- 7a4bb764: ZERO-2610:Refactor FilterItem component for better readability and efficiency
+- dfabc06: ZERO-2836: Upgrade version for tailwind
+- dff0d595: ZERO-2659: add formData support to proxy api requests
+- eecb282: ZERO-2607: Update address-related functions to include invalidateTag option
+- 9e25a64: ZERO-2835: Update category page layout with breadcrumb
+- beb499e6: ZERO-2551: Add new tsconfig paths
+- f45aa87: ZERO-2904: Upgrade version for tailwindcss
+- fac2e5b: ZERO-2622: Add isMenuOpen state to Category reducer and update CategoryInfo component
+- 4614eeeb: ZERO-2602: The script that checks the build for standalone projects
+- e9a46acb: ZERO-2738: add CVC input to registered cards in Masterpass
+- f046f8e0: ZERO-2575: update version for react-number-format
+- b9273fd: ZERO-2889: add host headers to requests
+- 86d25315: ZERO-2693: resolve dependency collision warning for eslint-config-next
+
+### Patch Changes
+
+- Updated dependencies [90282b53]
+- Updated dependencies [50b9069]
+- Updated dependencies [572d2e84]
+- Updated dependencies [a4c8d6a9]
+- Updated dependencies [fda5b92]
+- Updated dependencies [2d9b2b2]
+- Updated dependencies [c53ea3e6]
+- Updated dependencies [d93a507]
+- Updated dependencies [8d9ac9a]
+- Updated dependencies [18e8197]
+- Updated dependencies [714e0b46]
+- Updated dependencies [70279e7]
+- Updated dependencies [6c25f66]
+- Updated dependencies [bc2b411]
+- Updated dependencies [3bf2dd9]
+- Updated dependencies [e9541a1]
+- Updated dependencies [c53ef7b9]
+- Updated dependencies [9d94f7e]
+- Updated dependencies [2e6104d]
+- Updated dependencies [64699d3]
+- Updated dependencies [0d3a913e]
+- Updated dependencies [1448a96e]
+- Updated dependencies [1ec2e9d]
+- Updated dependencies [d6edb1d]
+- Updated dependencies [d3474c64]
+- Updated dependencies [75080fd6]
+- Updated dependencies [17f8752]
+- Updated dependencies [c45b62c]
+- Updated dependencies [91265bba]
+- Updated dependencies [bbe18b9f]
+- Updated dependencies [d409996]
+- Updated dependencies [4920742]
+- Updated dependencies [12a873e]
+- Updated dependencies [69ca080]
+- Updated dependencies [7e56d6b]
+- Updated dependencies [94b6928]
+- Updated dependencies [98bb8dcd]
+- Updated dependencies [46b7aad]
+- Updated dependencies [dcc8a150]
+- Updated dependencies [8f47cca]
+- Updated dependencies [fad27689]
+- Updated dependencies [dff0d595]
+- Updated dependencies [fdd0b41]
+- Updated dependencies [eecb282]
+- Updated dependencies [f2c325c]
+- Updated dependencies [9e25a64]
+- Updated dependencies [beb499e6]
+- Updated dependencies [146ea39]
+- Updated dependencies [f2c92d5]
+- Updated dependencies [7bd3d99]
+- Updated dependencies [c47be30d]
+- Updated dependencies [e9a46acb]
+- Updated dependencies [f046f8e0]
+- Updated dependencies [b9273fd]
+- Updated dependencies [86d25315]
+- Updated dependencies [c670bd4]
+- Updated dependencies [3f9b8d7]
+  - @akinon/next@1.48.0-rc.3
+  - @akinon/pz-checkout-gift-pack@1.48.0-rc.3
+  - @akinon/pz-one-click-checkout@1.48.0-rc.3
+  - @akinon/pz-basket-gift-pack@1.48.0-rc.3
+  - @akinon/pz-click-collect@1.48.0-rc.3
+  - @akinon/pz-masterpass@1.48.0-rc.3
+  - @akinon/pz-akifast@1.48.0-rc.3
+  - @akinon/pz-gpay@1.48.0-rc.3
+  - @akinon/pz-b2b@1.48.0-rc.3
+  - @akinon/pz-bkm@1.48.0-rc.3
+  - @akinon/pz-otp@1.48.0-rc.3
+  - @akinon/pz-pay-on-delivery@1.48.0-rc.3
+  - @akinon/pz-credit-payment@1.48.0-rc.3
+
+## 1.48.0-rc.2
+
+### Minor Changes
+
+- 2e6104d: ZERO-2888:Edit the numbering in the pagination and the visibility of the prev and next buttons
+
+### Patch Changes
+
+- Updated dependencies [2e6104d]
+  - @akinon/next@1.48.0-rc.2
+  - @akinon/pz-akifast@1.48.0-rc.2
+  - @akinon/pz-b2b@1.48.0-rc.2
+  - @akinon/pz-basket-gift-pack@1.48.0-rc.2
+  - @akinon/pz-bkm@1.48.0-rc.2
+  - @akinon/pz-checkout-gift-pack@1.48.0-rc.2
+  - @akinon/pz-click-collect@1.48.0-rc.2
+  - @akinon/pz-credit-payment@1.48.0-rc.2
+  - @akinon/pz-gpay@1.48.0-rc.2
+  - @akinon/pz-masterpass@1.48.0-rc.2
+  - @akinon/pz-one-click-checkout@1.48.0-rc.2
+  - @akinon/pz-otp@1.48.0-rc.2
+  - @akinon/pz-pay-on-delivery@1.48.0-rc.2
+
 ## 1.48.0-rc.1
 
 ### Patch Changes

package/app-template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "projectzeronext",
-  "version": "1.48.0-rc.1",
+  "version": "1.48.0-rc.3",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -22,19 +22,19 @@
     "prestart": "pz-prestart"
   },
   "dependencies": {
-    "@akinon/next": "1.48.0-rc.1",
-    "@akinon/pz-akifast": "1.48.0-rc.1",
-    "@akinon/pz-b2b": "1.48.0-rc.1",
-    "@akinon/pz-basket-gift-pack": "1.48.0-rc.1",
-    "@akinon/pz-bkm": "1.48.0-rc.1",
-    "@akinon/pz-checkout-gift-pack": "1.48.0-rc.1",
-    "@akinon/pz-click-collect": "1.48.0-rc.1",
-    "@akinon/pz-credit-payment": "1.48.0-rc.1",
-    "@akinon/pz-gpay": "1.48.0-rc.1",
-    "@akinon/pz-masterpass": "1.48.0-rc.1",
-    "@akinon/pz-one-click-checkout": "1.48.0-rc.1",
-    "@akinon/pz-otp": "1.48.0-rc.1",
-    "@akinon/pz-pay-on-delivery": "1.48.0-rc.1",
+    "@akinon/next": "1.48.0-rc.3",
+    "@akinon/pz-akifast": "1.48.0-rc.3",
+    "@akinon/pz-b2b": "1.48.0-rc.3",
+    "@akinon/pz-basket-gift-pack": "1.48.0-rc.3",
+    "@akinon/pz-bkm": "1.48.0-rc.3",
+    "@akinon/pz-checkout-gift-pack": "1.48.0-rc.3",
+    "@akinon/pz-click-collect": "1.48.0-rc.3",
+    "@akinon/pz-credit-payment": "1.48.0-rc.3",
+    "@akinon/pz-gpay": "1.48.0-rc.3",
+    "@akinon/pz-masterpass": "1.48.0-rc.3",
+    "@akinon/pz-one-click-checkout": "1.48.0-rc.3",
+    "@akinon/pz-otp": "1.48.0-rc.3",
+    "@akinon/pz-pay-on-delivery": "1.48.0-rc.3",
     "@hookform/resolvers": "2.9.0",
     "@next/third-parties": "14.1.0",
     "@react-google-maps/api": "2.17.1",
@@ -58,7 +58,7 @@
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "1.48.0-rc.1",
+    "@akinon/eslint-plugin-projectzero": "1.48.0-rc.3",
     "@semantic-release/changelog": "6.0.2",
     "@semantic-release/exec": "6.0.3",
     "@semantic-release/git": "10.0.1",
@@ -94,7 +94,7 @@
     "stylelint-config-standard": "25.0.0",
     "stylelint-scss": "4.2.0",
     "stylelint-selector-bem-pattern": "2.1.1",
-    "tailwindcss": "3.4.10",
+    "tailwindcss": "3.4.12",
     "ts-jest": "29.1.1",
     "ts-node": "10.7.0",
     "typescript": "5.2.2"

package/app-template/src/components/pagination.tsx

@@ -1,8 +1,8 @@
-import { MouseEvent, useCallback, useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { PaginationProps } from '@theme/components/types';
 import { twMerge } from 'tailwind-merge';
 import clsx from 'clsx';
-import { Link, Button } from '@theme/components';
+import { Button } from '@theme/components';
 import usePagination from '@akinon/next/hooks/use-pagination';
 import { useLocalization } from '@akinon/next/hooks';
 import { useRouter } from '@akinon/next/hooks';
@@ -92,9 +92,7 @@ export const Pagination = (props: PaginationProps) => {
     }
   }, [numberOfPages, page, pageList, threshold]);
 
-  const handleClick = (e: MouseEvent<HTMLAnchorElement>, url: string) => {
-    e.preventDefault();
-
+  const handleClick = (url: string) => {
     const newUrl = new URL(url, window.location.origin);
     const page = newUrl.searchParams.get('page');
 
@@ -129,7 +127,7 @@ export const Pagination = (props: PaginationProps) => {
     if (type === 'list') {
       createListItems();
     }
-  }, []); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [createListItems, type]);
 
   useEffect(() => {
     if (total && total !== paginationTotal) {
@@ -200,9 +198,8 @@ export const Pagination = (props: PaginationProps) => {
         >
           {prev && currentPage !== 1 && (
             <li>
-              <Link
-                onClick={(e) => handleClick(e, prev)}
-                href={prev}
+              <button
+                onClick={() => handleClick(prev)}
                 className={twMerge(
                   'flex cursor-pointer text-sm px-2',
                   prevClassName
@@ -212,16 +209,15 @@ export const Pagination = (props: PaginationProps) => {
                 <span className="hidden lg:inline-block ms-4">
                   {t('category.pagination.previous')}
                 </span>
-              </Link>
+              </button>
             </li>
           )}
 
           {paginationItems.map((item, i) => (
             <li key={i}>
               {item?.url != '#' ? (
-                <Link
-                  onClick={(e) => handleClick(e, item.url)}
-                  href={item.url}
+                <button
+                  onClick={() => handleClick(item.url)}
                   className={twMerge(
                     clsx(
                       'text-xs px-2 cursor-pointer',
@@ -234,7 +230,7 @@ export const Pagination = (props: PaginationProps) => {
                   )}
                 >
                   {item?.page}
-                </Link>
+                </button>
               ) : (
                 <span className="cursor-default text-xs flex items-center justify-center">
                   {item?.page}
@@ -245,9 +241,8 @@ export const Pagination = (props: PaginationProps) => {
 
           {showNext && (
             <li>
-              <Link
-                onClick={(e) => handleClick(e, next)}
-                href={next}
+              <button
+                onClick={() => handleClick(next)}
                 className={twMerge(
                   'flex cursor-pointer text-xs px-2',
                   nextClassName
@@ -257,7 +252,7 @@ export const Pagination = (props: PaginationProps) => {
                   {t('category.pagination.next')}
                 </span>
                 <span>&gt;</span>
-              </Link>
+              </button>
             </li>
           )}
         </ul>

package/app-template/src/views/category/category-active-filters.tsx

@@ -22,17 +22,28 @@ const CategoryActiveFilters = () => {
   const handleRemoveFilter = ({ facet, choice }) => {
     if (facet.widget_type === WIDGET_TYPE.category) {
       dispatch(removeCategoryFacet({ facet, choice }));
-      return;
+    } else {
+      dispatch(toggleFacet({ facet, choice }));
     }
 
-    dispatch(toggleFacet({ facet, choice }));
+    const urlSearchParams = new URLSearchParams(window.location.search);
+    urlSearchParams.delete(facet.search_key);
+    router.replace(pathname + '?' + urlSearchParams.toString());
   };
 
   const url = useMemo(() => {
-    const facetSearchParams =
-      convertFacetSearchParams(selectedFacets).toString();
+    const facetSearchParams = convertFacetSearchParams(selectedFacets);
+    const urlSearchParams = new URLSearchParams(searchParams.toString());
 
-    const urlSearchParams = new URLSearchParams(facetSearchParams);
+    for (const key of Array.from(urlSearchParams.keys())) {
+      if (facetSearchParams.has(key)) {
+        urlSearchParams.delete(key);
+      }
+    }
+
+    for (const [key, value] of Array.from(facetSearchParams.entries())) {
+      urlSearchParams.append(key, value);
+    }
 
     const searchText = searchParams.get('search_text');
     const page = searchParams.get('page');
@@ -53,7 +64,6 @@ const CategoryActiveFilters = () => {
 
   useEffect(() => {
     router.push(url);
-
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [url]);
 

package/app-template/src/views/category/filters/filter-item.tsx

@@ -1,12 +1,14 @@
 import clsx from 'clsx';
 import { useAppDispatch } from '@akinon/next/redux/hooks';
 import { Facet, FacetChoice } from '@akinon/next/types';
-import { Accordion, Radio, Checkbox } from '../../../components';
+import { Accordion, Radio, Checkbox, LoaderSpinner } from '../../../components';
 import { WIDGET_TYPE } from '../../../types';
 import { SizeFilter } from './size-filter';
 import { toggleFacet } from '@theme/redux/reducers/category';
 import { commonProductAttributes } from '@theme/settings';
 import { useRouter } from '@akinon/next/hooks';
+import { usePathname } from 'next/navigation';
+import { useState } from 'react';
 
 const COMPONENT_TYPES = {
   [WIDGET_TYPE.category]: Radio,
@@ -19,6 +21,8 @@ const sizeKey = commonProductAttributes.find(
 
 interface Props {
   facet: Facet;
+  isPending: boolean;
+  startTransition: (callback: () => void) => void;
 }
 
 const sortByPredefinedOrder = (
@@ -78,16 +82,33 @@ const getComponentByWidgetType = (widgetType: string, facetKey: string) => {
   return COMPONENT_TYPES[widgetType] || COMPONENT_TYPES[WIDGET_TYPE.category];
 };
 
-export const FilterItem = ({ facet }: Props) => {
+export const FilterItem = ({ facet, isPending, startTransition }: Props) => {
   const dispatch = useAppDispatch();
   const router = useRouter();
-
-  const handleSelectFilter = (choice: FacetChoice) => {
-    if (facet.key === 'category_ids') {
-      router.push(choice.url);
-    } else {
-      dispatch(toggleFacet({ facet, choice }));
-    }
+  const pathname = usePathname();
+
+  const [pendingChoice, setPendingChoice] = useState<string | null>(null);
+
+  const handleSelectFilter = ({
+    facet,
+    choice
+  }: {
+    facet: Facet;
+    choice: FacetChoice;
+  }) => {
+    setPendingChoice(choice.label);
+    startTransition(() => {
+      if (facet.key === 'category_ids') {
+        router.push(choice.url);
+      } else {
+        dispatch(toggleFacet({ facet, choice }));
+      }
+      setPendingChoice(null);
+
+      const urlSearchParams = new URLSearchParams(window.location.search);
+      urlSearchParams.delete(facet.search_key);
+      router.replace(pathname + '?' + urlSearchParams.toString());
+    });
   };
 
   const Component = getComponentByWidgetType(facet.widget_type, facet.key);
@@ -107,23 +128,34 @@ export const FilterItem = ({ facet }: Props) => {
         })}
       >
         {choices.map((choice, index) => (
-          <Component
-            key={choice.label}
-            data={choice}
-            name={facet.key}
-            onChange={() => facet.key !== sizeKey && handleSelectFilter(choice)}
-            onClick={() => facet.key === sizeKey && handleSelectFilter(choice)}
-            checked={choice.is_selected}
-            data-testid={`${choice.label.trim()}`}
-          >
-            {choice.label} (
-            <span
-              data-testid={`filter-count-${facet.name.toLowerCase()}-${index}`}
+          <div key={choice.label} className="relative">
+            <Component
+              key={choice.label}
+              data={choice}
+              name={facet.key}
+              onChange={() => handleSelectFilter({ facet, choice })}
+              onClick={() =>
+                facet.key === sizeKey && handleSelectFilter({ facet, choice })
+              }
+              checked={choice.is_selected}
+              data-testid={`${choice.label.trim()}`}
+              disabled={isPending}
             >
-              {choice.quantity}
-            </span>
-            )
-          </Component>
+              {choice.label} (
+              <span
+                data-testid={`filter-count-${facet.name.toLowerCase()}-${index}`}
+              >
+                {choice.quantity}
+              </span>
+              )
+            </Component>
+
+            {isPending && pendingChoice === choice.label && (
+              <div className="absolute inset-0 flex items-center justify-center z-50">
+                <LoaderSpinner />
+              </div>
+            )}
+          </div>
         ))}
       </div>
     </Accordion>

package/app-template/src/views/category/filters/index.tsx

@@ -1,13 +1,12 @@
 'use client';
 
 import clsx from 'clsx';
-
 import { Button, Icon } from '@theme/components';
 import { useLocalization } from '@akinon/next/hooks';
 import { useAppDispatch, useAppSelector } from '@akinon/next/redux/hooks';
 import { resetSelectedFacets } from '@theme/redux/reducers/category';
 import CategoryActiveFilters from '@theme/views/category/category-active-filters';
-import { useMemo } from 'react';
+import { useMemo, useState, useTransition } from 'react';
 import { FilterItem } from './filter-item';
 
 interface Props {
@@ -21,12 +20,11 @@ export const Filters = (props: Props) => {
   const { t } = useLocalization();
   const { isMenuOpen, setIsMenuOpen } = props;
 
+  const [isPending, startTransition] = useTransition();
+
   const haveFilter = useMemo(() => {
-    return (
-      facets.filter(
-        (facet) =>
-          facet.data.choices.filter((choice) => choice.is_selected).length > 0
-      ).length > 0
+    return facets.some((facet) =>
+      facet.data.choices.some((choice) => choice.is_selected)
     );
   }, [facets]);
 
@@ -51,12 +49,22 @@ export const Filters = (props: Props) => {
         <span className="text-sm">1 {t('category.filters.results')}</span>
         <span>{t('category.filters.ready_to_wear')}</span>
       </div>
+
       {facets.map((facet) => {
-        return <FilterItem key={facet.key} facet={facet} />;
+        return (
+          <FilterItem
+            key={facet.key}
+            facet={facet}
+            isPending={isPending}
+            startTransition={startTransition}
+          />
+        );
       })}
+
       <div className="lg:hidden">
         <CategoryActiveFilters />
       </div>
+
       {haveFilter && (
         <div className="lg:hidden">
           <Button

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@akinon/projectzero",
-  "version": "1.48.0-rc.1",
+  "version": "1.48.0-rc.3",
   "private": false,
   "description": "CLI tool to manage your Project Zero Next project",
   "bin": {