@akinon/projectzero 1.108.0-rc.87 → 1.108.0-rc.9

package/app-template/src/views/header/search/index.tsx

@@ -87,7 +87,16 @@ export default function Search() {
                 ref={inputRef}
               />
 
-              <PluginModule component={Component.HeaderImageSearchFeature} />
+              <PluginModule
+                component={Component.HeaderImageSearchFeature}
+                props={{
+                  settings: {
+                    customStyles: {
+                      controlsInner: 'bg-red-500'
+                    }
+                  }
+                }}
+              />
 
               <Icon
                 name="close"

package/app-template/src/views/product/layout.tsx

@@ -22,6 +22,16 @@ export default async function ProductLayout({
   breadcrumbData,
   children
 }: ProductPageProps) {
+  const categoryIds = breadcrumbData
+    ?.map((item) => item.extra_context?.attributes?.category_id)
+    .filter(Boolean)
+    .join(',');
+
+  const categoryPaths = breadcrumbData
+    ?.map((item) => item.path)
+    .filter(Boolean)
+    .join(',');
+
   return (
     <div className="container mx-auto">
       <div className="max-w-5xl mx-auto my-5 px-7">
@@ -31,7 +41,11 @@ export default async function ProductLayout({
         <div className="col-span-5 lg:col-span-3">
           <ProductInfoSlider product={data.product} />
         </div>
-        <div className="flex flex-col items-center col-span-5 lg:col-span-2">
+        <div
+          className="flex flex-col items-center col-span-5 lg:col-span-2"
+          data-category-ids={categoryIds}
+          data-category-paths={categoryPaths}
+        >
           <div className="w-full">{children}</div>
         </div>
       </div>

package/app-template/src/views/product/product-info.tsx

@@ -13,6 +13,7 @@ import { useStockAlert } from '../../hooks/use-stock-alert';
 import { ProductVariants } from './product-variants';
 import { ProductActions } from './product-actions';
 import { ProductShare } from './product-share';
+import PluginModule, { Component } from '@akinon/next/components/plugin-module';
 
 export default function ProductInfo({ data }: ProductPageProps) {
   const { data: session } = useSession();
@@ -105,6 +106,13 @@ export default function ProductInfo({ data }: ProductPageProps) {
         onCloseModal={closeModal}
       />
 
+      <PluginModule
+        component={Component.VirtualTryOnPlugin}
+        props={{
+          product: data.product
+        }}
+      />
+
       <MiscButtons
         productName={data.product.name}
         productPk={data.product.pk}

package/commands/plugins.ts

@@ -29,14 +29,7 @@ async function checkVersion(pkg: PackageJson) {
 
     if (!semver.satisfies(pkg.dependencies['@akinon/next'], latestVersion)) {
       console.warn(
-        `\x1b[43m Warning: The "${packageName}" package is currently at`,
-        `\x1b[41m version ${pkg.dependencies['@akinon/next']}`,
-        `\x1b[43m Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`,
-        '\x1b[0m\n'
-      );
-    } else {
-      console.log(
-        `\x1b[42m Info: The package "${packageName}" is currently in the current version (${latestVersion}).`,
+        `\x1b[43mWarning: The "${packageName}" package is currently at version ${pkg.dependencies['@akinon/next']}. Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`,
         '\x1b[0m\n'
       );
     }
@@ -61,27 +54,7 @@ export default async () => {
     }
   }
 
-  function findPackageJson(): PackageJson {
-    const packageJsonPaths = [
-      path.resolve(rootDir, './package.json'),
-      path.resolve(rootDir, './apps/projectzeronext/package.json')
-    ];
-
-    for (const packageJsonPath of packageJsonPaths) {
-      try {
-        const pkg = require(packageJsonPath);
-        if (pkg.dependencies['@akinon/next']) {
-          return pkg;
-        }
-      } catch (error) {
-        continue;
-      }
-    }
-
-    throw new Error('Could not find package.json with @akinon/next dependency');
-  }
-
-  const pkg = findPackageJson();
+  const pkg: PackageJson = require(path.resolve(rootDir, './package.json'));
   await checkVersion(pkg);
 
   const pluginsFilePath = findPluginsFilePath();
@@ -164,6 +137,10 @@ export default async () => {
       name: 'Tamara Payment Extension',
       value: 'pz-tamara-extension'
     },
+    {
+      name: 'Similar Products',
+      value: 'pz-similar-products'
+    },
     {
       name: 'Hepsipay',
       value: 'pz-hepsipay'
@@ -171,6 +148,14 @@ export default async () => {
     {
       name: 'Flow Payment',
       value: 'pz-flow-payment'
+    },
+    {
+      name: 'Virtual Try-On',
+      value: 'pz-virtual-try-on'
+    },
+    {
+      name: 'CyberSource UC',
+      value: 'pz-cybersource-uc'
     }
   ];
 

package/dist/commands/plugins.js

@@ -50,10 +50,7 @@ function checkVersion(pkg) {
             const pkgInfo = (yield response.json());
             const latestVersion = pkgInfo['dist-tags'].latest;
             if (!semver_1.default.satisfies(pkg.dependencies['@akinon/next'], latestVersion)) {
-                console.warn(`\x1b[43m Warning: The "${packageName}" package is currently at`, `\x1b[41m version ${pkg.dependencies['@akinon/next']}`, `\x1b[43m Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`, '\x1b[0m\n');
-            }
-            else {
-                console.log(`\x1b[42m Info: The package "${packageName}" is currently in the current version (${latestVersion}).`, '\x1b[0m\n');
+                console.warn(`\x1b[43mWarning: The "${packageName}" package is currently at version ${pkg.dependencies['@akinon/next']}. Please upgrade it to the latest version (${latestVersion}) to ensure plugin compatibility.`, '\x1b[0m\n');
             }
         }
         catch (error) {
@@ -75,25 +72,7 @@ exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
             throw new Error('plugins.js was not found in either of the expected locations.');
         }
     }
-    function findPackageJson() {
-        const packageJsonPaths = [
-            path_1.default.resolve(rootDir, './package.json'),
-            path_1.default.resolve(rootDir, './apps/projectzeronext/package.json')
-        ];
-        for (const packageJsonPath of packageJsonPaths) {
-            try {
-                const pkg = require(packageJsonPath);
-                if (pkg.dependencies['@akinon/next']) {
-                    return pkg;
-                }
-            }
-            catch (error) {
-                continue;
-            }
-        }
-        throw new Error('Could not find package.json with @akinon/next dependency');
-    }
-    const pkg = findPackageJson();
+    const pkg = require(path_1.default.resolve(rootDir, './package.json'));
     yield checkVersion(pkg);
     const pluginsFilePath = findPluginsFilePath();
     let installedPlugins = [];
@@ -173,6 +152,10 @@ exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
             name: 'Tamara Payment Extension',
             value: 'pz-tamara-extension'
         },
+        {
+            name: 'Similar Products',
+            value: 'pz-similar-products'
+        },
         {
             name: 'Hepsipay',
             value: 'pz-hepsipay'
@@ -180,6 +163,14 @@ exports.default = () => __awaiter(void 0, void 0, void 0, function* () {
         {
             name: 'Flow Payment',
             value: 'pz-flow-payment'
+        },
+        {
+            name: 'Virtual Try-On',
+            value: 'pz-virtual-try-on'
+        },
+        {
+            name: 'CyberSource UC',
+            value: 'pz-cybersource-uc'
         }
     ];
     try {

package/package.json

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

package/app-template/src/app/[commerce]/[locale]/[currency]/product/[pk]/loading.tsx

@@ -1,67 +0,0 @@
-import { Skeleton, SkeletonWrapper } from 'components';
-
-export default function Loading() {
-  return (
-    <div className="container mx-auto">
-      <div className="max-w-5xl mx-auto my-5 px-7">
-        <SkeletonWrapper className="md:mb-7">
-          <Skeleton className="w-[17.25rem] h-4 lg:w-64" />
-        </SkeletonWrapper>
-      </div>
-      <div className="grid max-w-5xl grid-cols-2 lg:gap-8 mx-auto px-7">
-        <div className="col-span-2 mb-7 md:mb-0 lg:col-span-1">
-          <div className="flex gap-1">
-            <SkeletonWrapper className="hidden md:block md:mb-7">
-              {Array(5)
-                .fill(null)
-                .map((_, index) => (
-                  <Skeleton key={index} className="w-20	h-24 mb-2" />
-                ))}
-            </SkeletonWrapper>
-
-            <div className="flex-1">
-              <SkeletonWrapper className="md:mb-7">
-                <Skeleton className="w-full h-[30.375rem] md:h-[36.375rem]" />
-              </SkeletonWrapper>
-            </div>
-          </div>
-        </div>
-        <div className="flex flex-col items-center col-span-2 lg:col-span-1">
-          <div className="w-full">
-            <SkeletonWrapper className="w-full md:mb-7 flex justify-center items-center">
-              <Skeleton className="w-96 h-16 mb-9" />
-              <Skeleton className="hidden w-36	h-14 mb-9 md:block" />
-
-              <div className="flex flex-col justify-center items-center mb-9">
-                <Skeleton className="w-36 h-4 mb-2" />
-                <div className="flex items-center gap-2">
-                  {Array(3)
-                    .fill(null)
-                    .map((_, index) => (
-                      <Skeleton key={index} className="w-24	h-10" />
-                    ))}
-                </div>
-              </div>
-
-              <div className="flex flex-col justify-center items-center mb-4">
-                <Skeleton className="w-36 h-4 mb-2" />
-                <div className="flex items-center gap-2">
-                  {Array(5)
-                    .fill(null)
-                    .map((_, index) => (
-                      <Skeleton key={index} className="w-11 h-11" />
-                    ))}
-                </div>
-              </div>
-
-              <Skeleton className="hidden w-full h-14 mb-6 md:block" />
-              <Skeleton className="w-40 h-10 mb-9 md:w-72" />
-              <Skeleton className="w-24 h-10 mb-7" />
-              <Skeleton className="w-full h-36" />
-            </SkeletonWrapper>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

package/app-template/src/views/basket/basket-content.tsx

@@ -1,106 +0,0 @@
-'use client';
-
-import { useLocalization } from '@akinon/next/hooks';
-import { Basket } from '@akinon/next/types';
-import { Button, LoaderSpinner, Link } from '@theme/components';
-import { BasketItem, Summary } from '@theme/views/basket';
-import { ROUTES } from '@theme/routes';
-import PluginModule, { Component } from '@akinon/next/components/plugin-module';
-import { useEffect, useState } from 'react';
-import { pushCartView } from '@theme/utils/gtm';
-
-interface BasketContentProps {
-  initialBasket: Basket;
-  multiBasket: boolean;
-}
-
-export function BasketContent({
-  initialBasket,
-  multiBasket
-}: BasketContentProps) {
-  const { t } = useLocalization();
-  const [basket, setBasket] = useState<Basket>(initialBasket);
-
-  useEffect(() => {
-    if (basket) {
-      const products = basket.basketitem_set.map((basketItem) => ({
-        ...basketItem.product
-      }));
-      pushCartView(products);
-    }
-  }, [basket]);
-
-  const handleBasketUpdate = (updatedBasket: Basket) => {
-    setBasket(updatedBasket);
-  };
-
-  if (!basket) {
-    return (
-      <div className="flex justify-center w-full">
-        <LoaderSpinner />
-      </div>
-    );
-  }
-
-  return (
-    <div className="max-w-screen-xl p-4 flex flex-col text-primary-800 lg:p-8 xl:flex-row xl:mx-auto">
-      {basket.basketitem_set && basket.basketitem_set.length > 0 ? (
-        <>
-          <div className="flex-1 xl:mr-16">
-            <div className="flex items-center justify-between py-2 border-b border-gray-200 lg:py-3">
-              <h2 className="text-xl lg:text-2xl font-light">
-                {t('basket.my_cart')}
-              </h2>
-              <Link
-                href={ROUTES.HOME}
-                className="text-xs hover:text-secondary-500"
-              >
-                {t('basket.back_to_shopping')}
-              </Link>
-            </div>
-            <ul>
-              {multiBasket ? (
-                <PluginModule
-                  component={Component.MultiBasket}
-                  props={{
-                    BasketItem,
-                    onBasketUpdate: handleBasketUpdate
-                  }}
-                />
-              ) : (
-                basket.basketitem_set.map((basketItem, index) => (
-                  <BasketItem
-                    key={index}
-                    basketItem={basketItem}
-                    onBasketUpdate={handleBasketUpdate}
-                  />
-                ))
-              )}
-            </ul>
-          </div>
-          <Summary basket={basket} onBasketUpdate={handleBasketUpdate} />
-        </>
-      ) : (
-        <div className="flex flex-col items-center container max-w-screen-sm py-4 px-4 xs:py-6 xs:px-6 sm:py-8 sm:px-8 lg:max-w-screen-xl">
-          <h1
-            className="w-full text-xl font-light text-secondary text-center sm:text-2xl"
-            data-testid="basket-empty"
-          >
-            {t('basket.empty.title')}
-          </h1>
-
-          <div className="w-full text-sm text-black-800 text-center my-4 mb-2 sm:text-base">
-            <p>{t('basket.empty.content_first')}</p>
-            <p>{t('basket.empty.content_second')}.</p>
-          </div>
-
-          <Link href={ROUTES.HOME} passHref>
-            <Button className="px-10 mt-2" appearance="filled">
-              {t('basket.empty.button')}
-            </Button>
-          </Link>
-        </div>
-      )}
-    </div>
-  );
-}