@akinon/projectzero 2.0.50-rc.0 → 2.0.50

package/CHANGELOG.md

@@ -1,12 +1,10 @@
 # @akinon/projectzero
 
-## 2.0.50-rc.0
+## 2.0.50
 
 ### Patch Changes
 
-- 143be2b9d: ZERO-3457: Crop styles are customizable and logic improved for rendering similar products modal
-- d99a6a7d5: ZERO-3457_1: Fixed the settings prop and made sure everything is customizable.
-- e18836b20: ZERO-4160: Restore scope in Sentry addon configuration in akinon.json
+- 79d611c: ZERO-4745: Mount the login body slot and anchor the auth route rules to segment boundaries
 
 ## 2.0.49
 

package/app-template/.env.example

@@ -7,7 +7,6 @@ NEXT_PUBLIC_URL=http://localhost:3000
 SERVICE_BACKEND_URL=https://02fde10fee4440269e695aa10707dfaf.lb.akinoncloud.com
 SITEMAP_S3_BUCKET_NAME=0fb534
 NEXT_PUBLIC_VIRTUAL_TRY_ON_API_URL=https://d2a26507c7094f359aba349b96a96881.lb.akinoncloud.com
-NEXT_PUBLIC_ENABLE_IMAGE_SEARCH=true
 
 # PZ Dashboard dataLayer observability (unset = observer disabled)
 # NEXT_PUBLIC_PZ_DASHBOARD_URL=http://localhost:3005

package/app-template/AGENTS.md

@@ -1,11 +1,3 @@
-<!-- BEGIN:nextjs-agent-rules -->
-
-# Next.js: ALWAYS read docs before coding
-
-Before any Next.js work, find and read the relevant doc in `node_modules/next/dist/docs/`. Your training data is outdated — the docs are the source of truth.
-
-<!-- END:nextjs-agent-rules -->
-
 # Project Zero Next.js - Developer Instructions
 
 ## 📚 Available Instruction Files

package/app-template/CHANGELOG.md

@@ -1,83 +1,37 @@
 # projectzeronext
 
-## 2.0.50-rc.0
-
-### Patch Changes
-
-- 1a8622a9b: ZERO-3392: Implemented AI Search functionality and update env
-- 2fea414: ZERO-4620: Add runtime access to `NEXT_PUBLIC_*` environment variables from Client Components
-- b55acb768: ZERO-2577: Fix pagination bug and update usePagination hook and ensure pagination controls rendering correctly
-- 143be2b9d: ZERO-3457: Crop styles are customizable and logic improved for rendering similar products modal
-- 9f8cd3bc5: ZERO-3449: AI Search Active Filters & Crop Style changes have been implemented
-- d99a6a7d5: ZERO-3457_1: Fixed the settings prop and made sure everything is customizable.
-- ccf21475: ZERO-4404: Add Next.js 16.2 AI improvements
-- c0228aff0: ZERO-4159: Upgrade the package versions
-- b05c35435: ZERO-2570: Category filters routes to absolute url
-- e18836b20: ZERO-4160: Restore scope in Sentry addon configuration in akinon.json
-- c3244a310: ZERO-4013: Update runtime version to node:25-alpine in project configuration
-- Updated dependencies [a3e2acbf]
-- Updated dependencies [0cf9ea239]
-- Updated dependencies [324f97d5]
-- Updated dependencies [51ea0688]
-- Updated dependencies
-- Updated dependencies [c97525a3]
-- Updated dependencies [eba125b24]
-- Updated dependencies [2fea414]
-- Updated dependencies [119f0c1]
-- Updated dependencies [823a4449a]
-- Updated dependencies [b55acb768]
-- Updated dependencies [760258c1c]
-- Updated dependencies [5da13fff]
-- Updated dependencies [143be2b9d]
-- Updated dependencies [7889b08f]
-- Updated dependencies [fb4aa9b4]
-- Updated dependencies [9f8cd3bc5]
-- Updated dependencies [bfafa3f49]
-- Updated dependencies [00b9f488f]
-- Updated dependencies [57d7eb30]
-- Updated dependencies [d99a6a7d5]
-- Updated dependencies [9db81a71]
-- Updated dependencies [591e345e1]
-- Updated dependencies [0df6bc1f8]
-- Updated dependencies [4de5303c5]
-- Updated dependencies [63a720003]
-- Updated dependencies [95b139dc1]
-- Updated dependencies [1d00f2d0]
-- Updated dependencies [4ac7b2a1]
-- Updated dependencies [e9598c7]
-- Updated dependencies [4998a9631]
-- Updated dependencies [804d2bd6]
-- Updated dependencies [c0228aff0]
-- Updated dependencies [3909d3224]
-- Updated dependencies [6a3d8a63]
-- Updated dependencies [e18836b20]
-  - @akinon/pz-tabby-extension@2.0.50-rc.0
-  - @akinon/next@2.0.50-rc.0
-  - @akinon/pz-checkout-gift-pack@2.0.50-rc.0
-  - @akinon/pz-masterpass-rest@2.0.50-rc.0
-  - @akinon/pz-one-click-checkout@2.0.50-rc.0
-  - @akinon/pz-basket-gift-pack@2.0.50-rc.0
-  - @akinon/pz-pay-on-delivery@2.0.50-rc.0
-  - @akinon/pz-credit-payment@2.0.50-rc.0
-  - @akinon/pz-click-collect@2.0.50-rc.0
-  - @akinon/pz-multi-basket@2.0.50-rc.0
-  - @akinon/pz-masterpass@2.0.50-rc.0
-  - @akinon/pz-gpay@2.0.50-rc.0
-  - @akinon/pz-b2b@2.0.50-rc.0
-  - @akinon/pz-bkm@2.0.50-rc.0
-  - @akinon/pz-otp@2.0.50-rc.0
-  - @akinon/pz-similar-products@2.0.50-rc.0
-  - @akinon/pz-virtual-try-on@2.0.50-rc.0
-  - @akinon/pz-theme@2.0.50-rc.0
-  - @akinon/pz-akifast@2.0.50-rc.0
-  - @akinon/pz-apple-pay@2.0.50-rc.0
-  - @akinon/pz-cybersource-uc@2.0.50-rc.0
-  - @akinon/pz-flow-payment@2.0.50-rc.0
-  - @akinon/pz-google-pay@2.0.50-rc.0
-  - @akinon/pz-haso@2.0.50-rc.0
-  - @akinon/pz-hepsipay@2.0.50-rc.0
-  - @akinon/pz-saved-card@2.0.50-rc.0
-  - @akinon/pz-tamara-extension@2.0.50-rc.0
+## 2.0.50
+
+### Patch Changes
+
+- Updated dependencies [79d611c]
+  - @akinon/pz-theme@2.0.50
+  - @akinon/next@2.0.50
+  - @akinon/pz-akifast@2.0.50
+  - @akinon/pz-apple-pay@2.0.50
+  - @akinon/pz-b2b@2.0.50
+  - @akinon/pz-basket-gift-pack@2.0.50
+  - @akinon/pz-bkm@2.0.50
+  - @akinon/pz-checkout-gift-pack@2.0.50
+  - @akinon/pz-click-collect@2.0.50
+  - @akinon/pz-credit-payment@2.0.50
+  - @akinon/pz-cybersource-uc@2.0.50
+  - @akinon/pz-flow-payment@2.0.50
+  - @akinon/pz-google-pay@2.0.50
+  - @akinon/pz-gpay@2.0.50
+  - @akinon/pz-haso@2.0.50
+  - @akinon/pz-hepsipay@2.0.50
+  - @akinon/pz-masterpass@2.0.50
+  - @akinon/pz-masterpass-rest@2.0.50
+  - @akinon/pz-multi-basket@2.0.50
+  - @akinon/pz-one-click-checkout@2.0.50
+  - @akinon/pz-otp@2.0.50
+  - @akinon/pz-pay-on-delivery@2.0.50
+  - @akinon/pz-saved-card@2.0.50
+  - @akinon/pz-similar-products@2.0.50
+  - @akinon/pz-tabby-extension@2.0.50
+  - @akinon/pz-tamara-extension@2.0.50
+  - @akinon/pz-virtual-try-on@2.0.50
 
 ## 2.0.49
 

package/app-template/README.md

@@ -12,30 +12,6 @@ Run `cp .env.example .env && yarn` command at project root and all dependencies
 
 - `SITEMAP_S3_BUCKET_NAME`: S3 bucket name for XML sitemaps (e.g., "0fb534"). This is required for the sitemap route to function correctly.
 
-### Optional Environment Variables
-
-- `NEXT_PUBLIC_ENABLE_IMAGE_SEARCH`: Set to `true` to enable image search feature for all users. If not set or `false`, the feature will only be visible to users who have enabled it via localStorage.
-
-## Image Search Feature
-
-The image search functionality allows users to search for similar products by uploading images or cropping existing product images.
-
-### Feature Visibility Control
-
-The image search feature can be controlled in two ways:
-
-1. **Environment Variable (Global)**: Set `NEXT_PUBLIC_ENABLE_IMAGE_SEARCH=true` to enable for all users
-2. **localStorage (Individual Users)**: Users can enable it locally using browser developer tools
-
-````
-
-### Feature Locations
-
-When enabled, the image search feature appears in:
-
-- **Header Search**: Camera icon next to the search input
-- **Product Detail Page**: "View Similar Styles" button on product images
-
 ### Build
 
 To build the app, run the following command:
@@ -43,7 +19,7 @@ To build the app, run the following command:
 ```bash
 cd projectzeronext # Project root
 yarn build
-````
+```
 
 ### Develop
 

package/app-template/next.config.mjs

@@ -38,9 +38,6 @@ const nextConfig = {
         ]
       }
     ];
-  },
-  logging: {
-    browserToTerminal: 'error'
   }
 };
 
@@ -53,12 +50,9 @@ const withSerwist = withSerwistInit({
 const sentryConfig = {
   silent: true,
   dryRun: !process.env.SENTRY_DSN,
-  org: 'akinon',
+  org: 'akinon'
   // project: 'enter_your_project_name_here',
   // authToken: 'enter_your_auth_token_here'
-  sourcemaps: {
-    deleteSourcemapsAfterUpload: true
-  }
 };
 
 const enhancedConfig = withPzConfig(nextConfig);

package/app-template/package.json

@@ -1,6 +1,6 @@
 {
   "name": "projectzeronext",
-  "version": "2.0.50-rc.0",
+  "version": "2.0.50",
   "private": true,
   "license": "MIT",
   "scripts": {
@@ -24,33 +24,33 @@
     "test:middleware": "jest middleware-matcher.test.ts --bail"
   },
   "dependencies": {
-    "@akinon/next": "2.0.50-rc.0",
-    "@akinon/pz-akifast": "2.0.50-rc.0",
-    "@akinon/pz-apple-pay": "2.0.50-rc.0",
-    "@akinon/pz-b2b": "2.0.50-rc.0",
-    "@akinon/pz-basket-gift-pack": "2.0.50-rc.0",
-    "@akinon/pz-bkm": "2.0.50-rc.0",
-    "@akinon/pz-checkout-gift-pack": "2.0.50-rc.0",
-    "@akinon/pz-click-collect": "2.0.50-rc.0",
-    "@akinon/pz-credit-payment": "2.0.50-rc.0",
-    "@akinon/pz-cybersource-uc": "2.0.50-rc.0",
-    "@akinon/pz-flow-payment": "2.0.50-rc.0",
-    "@akinon/pz-google-pay": "2.0.50-rc.0",
-    "@akinon/pz-gpay": "2.0.50-rc.0",
-    "@akinon/pz-haso": "2.0.50-rc.0",
-    "@akinon/pz-hepsipay": "2.0.50-rc.0",
-    "@akinon/pz-masterpass": "2.0.50-rc.0",
-    "@akinon/pz-masterpass-rest": "2.0.50-rc.0",
-    "@akinon/pz-multi-basket": "2.0.50-rc.0",
-    "@akinon/pz-one-click-checkout": "2.0.50-rc.0",
-    "@akinon/pz-otp": "2.0.50-rc.0",
-    "@akinon/pz-pay-on-delivery": "2.0.50-rc.0",
-    "@akinon/pz-saved-card": "2.0.50-rc.0",
-    "@akinon/pz-similar-products": "2.0.50-rc.0",
-    "@akinon/pz-tabby-extension": "2.0.50-rc.0",
-    "@akinon/pz-tamara-extension": "2.0.50-rc.0",
-    "@akinon/pz-theme": "2.0.50-rc.0",
-    "@akinon/pz-virtual-try-on": "2.0.50-rc.0",
+    "@akinon/next": "2.0.50",
+    "@akinon/pz-akifast": "2.0.50",
+    "@akinon/pz-apple-pay": "2.0.50",
+    "@akinon/pz-b2b": "2.0.50",
+    "@akinon/pz-basket-gift-pack": "2.0.50",
+    "@akinon/pz-bkm": "2.0.50",
+    "@akinon/pz-checkout-gift-pack": "2.0.50",
+    "@akinon/pz-click-collect": "2.0.50",
+    "@akinon/pz-credit-payment": "2.0.50",
+    "@akinon/pz-cybersource-uc": "2.0.50",
+    "@akinon/pz-flow-payment": "2.0.50",
+    "@akinon/pz-google-pay": "2.0.50",
+    "@akinon/pz-gpay": "2.0.50",
+    "@akinon/pz-haso": "2.0.50",
+    "@akinon/pz-hepsipay": "2.0.50",
+    "@akinon/pz-masterpass": "2.0.50",
+    "@akinon/pz-masterpass-rest": "2.0.50",
+    "@akinon/pz-multi-basket": "2.0.50",
+    "@akinon/pz-one-click-checkout": "2.0.50",
+    "@akinon/pz-otp": "2.0.50",
+    "@akinon/pz-pay-on-delivery": "2.0.50",
+    "@akinon/pz-saved-card": "2.0.50",
+    "@akinon/pz-similar-products": "2.0.50",
+    "@akinon/pz-tabby-extension": "2.0.50",
+    "@akinon/pz-tamara-extension": "2.0.50",
+    "@akinon/pz-theme": "2.0.50",
+    "@akinon/pz-virtual-try-on": "2.0.50",
     "@hookform/resolvers": "2.9.0",
     "@next/third-parties": "16.2.6",
     "@react-google-maps/api": "2.17.1",
@@ -59,7 +59,7 @@
     "next": "16.2.6",
     "@serwist/next": "9.5.11",
     "next-auth": "5.0.0-beta.30",
-    "pino": "8.21.0",
+    "pino": "8.11.0",
     "serwist": "9.5.11",
     "postcss": "8.4.49",
     "react": "19.2.5",
@@ -67,14 +67,14 @@
     "react-google-recaptcha": "2.1.0",
     "react-hook-form": "7.71.2",
     "react-intersection-observer": "9.4.0",
-    "react-multi-carousel": "2.8.5",
-    "react-string-replace": "1.1.1",
-    "start-server-and-test": "2.0.8",
-    "tailwind-merge": "1.14.0",
+    "react-multi-carousel": "2.8.4",
+    "react-string-replace": "1.1.0",
+    "start-server-and-test": "2.0.3",
+    "tailwind-merge": "1.8.0",
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "2.0.50-rc.0",
+    "@akinon/eslint-plugin-projectzero": "2.0.50",
     "@semantic-release/changelog": "6.0.2",
     "@semantic-release/exec": "6.0.3",
     "@semantic-release/git": "10.0.1",
@@ -89,25 +89,25 @@
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "client-only": "0.0.1",
-    "clsx": "1.2.1",
+    "clsx": "1.1.1",
     "currency-symbol-map": "5.1.0",
     "eslint": "9.39.4",
     "eslint-config-next": "16.2.4",
     "eslint-config-prettier": "10.1.1",
     "husky": "8.0.0",
     "jest": "29.7.0",
-    "jest-css-modules-transform": "4.4.2",
+    "jest-css-modules-transform": "4.3.0",
     "jest-environment-jsdom": "29.7.0",
-    "lint-staged": "13.3.0",
-    "prettier": "2.8.8",
+    "lint-staged": "13.1.0",
+    "prettier": "2.6.2",
     "react-number-format": "5.3.4",
-    "sass": "1.83.0",
+    "sass": "1.49.9",
     "semantic-release": "19.0.5",
     "server-only": "0.0.1",
-    "stylelint": "14.16.1",
+    "stylelint": "14.6.0",
     "stylelint-config-sass-guidelines": "9.0.1",
     "stylelint-config-standard": "25.0.0",
-    "stylelint-scss": "4.7.0",
+    "stylelint-scss": "4.2.0",
     "stylelint-selector-bem-pattern": "2.1.1",
     "tailwindcss": "4.2.0",
     "ts-jest": "29.2.6",

package/app-template/src/app/[pz]/auth/(login)/layout.tsx

@@ -0,0 +1,37 @@
+import ChromeSlot from '@akinon/pz-theme/src/chrome/chrome-slot';
+import { PLACEHOLDER_SLUGS } from '@akinon/pz-theme/src/chrome/placeholder-slugs';
+
+/**
+ * The login screen is handed to the theme editor here rather than in page.tsx,
+ * because the slot is an async server component and the page is a client one.
+ * With no composition published the slot renders the page untouched.
+ *
+ * The slot lives in a `(login)` route group so the composition covers exactly
+ * this screen: `auth/oauth-login` is a provider callback, and a login body
+ * mounted one level up would replace it too.
+ *
+ * No `pageContext`: an auth screen fetches no commerce data, and the blocks a
+ * designer rebuilds it from (`auth-form`, `register-form`, `oauth-buttons`)
+ * read the session client-side.
+ *
+ * Login and register stay on this ONE screen. Whether they read as tabs or as
+ * two forms side by side is composed here (the starter templates ship both
+ * shapes), so no second route is involved.
+ */
+export default function LoginLayout({
+  children
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    // `contents` on both wrappers keeps the slot chain layout-transparent, so
+    // an uncomposed login page keeps its own box model even where a brand's
+    // <main> is a flex or grid container.
+    <ChromeSlot
+      slug={PLACEHOLDER_SLUGS.auth}
+      fallback={children}
+      className="contents"
+      fallbackClassName="contents"
+    />
+  );
+}

package/app-template/src/app/[pz]/users/password/reset/layout.tsx

@@ -0,0 +1,21 @@
+import ChromeSlot from '@akinon/pz-theme/src/chrome/chrome-slot';
+import { PLACEHOLDER_SLUGS } from '@akinon/pz-theme/src/chrome/placeholder-slugs';
+
+/**
+ * The forgot-password body, handed over the same way as the login screen: the
+ * slot is an async server component and the page is a client one. This route
+ * holds a single page, so it needs no route group to keep the composition off
+ * a sibling screen.
+ *
+ * Brands that route it at `/auth/forgot-password` instead resolve to the same
+ * placeholder, so one composition serves both spellings.
+ */
+export default function ForgotPasswordLayout({
+  children
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <ChromeSlot slug={PLACEHOLDER_SLUGS.forgotPassword} fallback={children} />
+  );
+}

package/app-template/src/hooks/index.ts

@@ -1,3 +1 @@
-export * from './use-contract';
-export * from './use-fav-button';
 export * from './use-add-product-to-basket';

package/app-template/src/plugins.js

@@ -19,7 +19,6 @@ module.exports = [
   'pz-hepsipay',
   'pz-flow-payment',
   'pz-virtual-try-on',
-  'pz-similar-products',
   'pz-cybersource-uc',
   'pz-hepsipay',
   'pz-masterpass-rest',

package/app-template/src/proxy.ts

@@ -14,8 +14,7 @@ export const config = {
     '/((?!api|_next|[\\w-\\/*]+\\.\\w+).*)',
     '/(.*sitemap\\.xml)',
     '/(.+\\.)(html|htm|aspx|asp|php)',
-    '/(.*orders\\/checkout-with-token.*)',
-    '/(.*orders\\/post-checkout.*)'
+    '/(.*orders\\/checkout-with-token.*)'
   ]
 };
 

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

@@ -4,7 +4,8 @@ import { useEffect, useRef, useState } from 'react';
 import { useAppDispatch, useAppSelector } from '@akinon/next/redux/hooks';
 import { closeSearch } from '@akinon/next/redux/reducers/header';
 import clsx from 'clsx';
-import { Icon, Input } from '@theme/components';
+
+import { Icon } from '@theme/components';
 import Results from './results';
 import { ROUTES } from '@theme/routes';
 import { useLocalization, useRouter } from '@akinon/next/hooks';
@@ -41,14 +42,6 @@ export default function Search() {
     };
   }, [isSearchOpen, dispatch]);
 
-  const handleSearchTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setSearchText(e.target.value);
-  };
-
-  const handleCloseSearch = () => {
-    dispatch(closeSearch());
-  };
-
   return (
     <>
       <div
@@ -74,9 +67,9 @@ export default function Search() {
               {t('common.search.results_for')}
             </span>
             <div className="flex items-center">
-              <Input
+              <input
                 value={searchText}
-                onChange={handleSearchTextChange}
+                onChange={(e) => setSearchText(e.target.value)}
                 onKeyDown={(e) => {
                   if (e.key === 'Enter' && searchText.trim() !== '') {
                     router.push(`${ROUTES.LIST}/?search_text=${searchText}`);
@@ -98,12 +91,11 @@ export default function Search() {
               <Icon
                 name="close"
                 size={14}
-                onClick={handleCloseSearch}
+                onClick={() => dispatch(closeSearch())}
                 className="cursor-pointer"
               />
             </div>
           </div>
-
           <Results searchText={searchText} />
         </div>
       </div>

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

@@ -36,100 +36,53 @@ export default function ProductInfoSlider({ product }: ProductSliderItem) {
     carouselRef.current?.next();
   };
 
-  const handleThumbnailClick = (index: number) => {
+  const handleThumbnailClick = (index) => {
     setActiveIndex(index);
     carouselRef.current?.goToSlide(index);
   };
 
   return (
-    <>
-      <div className="lg:grid lg:grid-cols-6">
-        <div className="lg:col-span-1">
-          <div className="flex flex-col items-center justify-center md:mr-[6px]">
-            <button
-              onClick={goToPrev}
-              className={twMerge(
-                'hidden justify-center p-2 mb-3 border border-gray-100 rounded-full cursor-pointer lg:block',
-                [activeIndex === 0 && 'cursor-not-allowed opacity-45']
-              )}
-              disabled={activeIndex === 0}
-            >
-              <Icon name="chevron-up" size={15} className="fill-[#000000]" />
-            </button>
-            <div className="hidden flex-col items-center overflow-scroll w-[80px] max-h-[620px] lg:block">
-              {product?.productimage_set?.map((item, index) => (
-                <Image
-                  key={index}
-                  src={item.image}
-                  alt={`Thumbnail ${index}`}
-                  width={80}
-                  height={128}
-                  aspectRatio={80 / 128}
-                  className={twMerge('cursor-pointer', [
-                    activeIndex === index && 'border-2 border-primary'
-                  ])}
-                  onClick={() => handleThumbnailClick(index)}
-                />
-              ))}
-            </div>
-            <button
-              onClick={goToNext}
-              className={twMerge(
-                'hidden justify-center p-2 mt-3 border border-gray-100 rounded-full cursor-pointer lg:block',
-                [
-                  activeIndex === product.productimage_set.length - 1 &&
-                    'cursor-not-allowed opacity-45'
-                ]
-              )}
-              disabled={activeIndex === product.productimage_set.length - 1}
-            >
-              <Icon name="chevron-down" size={15} className="fill-[#000000]" />
-            </button>
-          </div>
-        </div>
-
-        <div className="relative lg:col-span-5">
-          <FavButton className="absolute right-8 top-6 z-[20] sm:hidden" />
-
-          <PluginModule
-            component={Component.ProductImageSearchFeature}
-            props={{
-              product,
-              activeIndex,
-              showResetButton: true
-            }}
-          />
-
-          <CarouselCore
-            responsive={{
-              all: {
-                breakpoint: { max: 5000, min: 0 },
-                items: 1
-              }
-            }}
-            arrows={false}
-            swipeable={true}
-            ref={carouselRef}
-            afterChange={(previousSlide, { currentSlide }) => {
-              setActiveIndex(currentSlide);
-            }}
-            containerAspectRatio={{ mobile: 520 / 798, desktop: 484 / 726 }}
+    <div className="lg:grid lg:grid-cols-6">
+      <div className="lg:col-span-1">
+        <div className="flex flex-col items-center justify-center md:mr-[6px]">
+          <button
+            onClick={goToPrev}
+            className={twMerge(
+              'hidden justify-center p-2 mb-3 border border-gray-100 rounded-full cursor-pointer lg:block',
+              [activeIndex === 0 && 'cursor-not-allowed opacity-45']
+            )}
+            disabled={activeIndex === 0}
           >
-            {product?.productimage_set?.map((item, i) => (
+            <Icon name="chevron-up" size={15} className="fill-[#000000]" />
+          </button>
+          <div className="hidden flex-col items-center overflow-scroll w-[80px] max-h-[620px] lg:block">
+            {product?.productimage_set?.map((item, index) => (
               <Image
-                key={i}
+                key={index}
                 src={item.image}
-                alt={product?.name || 'Product image'}
-                draggable={false}
-                aspectRatio={484 / 726}
-                sizes="(min-width: 425px) 512px,
-              (min-width: 601px) 576px,
-              (min-width: 768px) 336px,
-              (min-width: 1024px) 484px, 368px"
-                fill
+                alt={`Thumbnail ${index}`}
+                width={80}
+                height={128}
+                className={twMerge('cursor-pointer', [
+                  activeIndex === index && 'border-2 border-primary'
+                ])}
+                onClick={() => handleThumbnailClick(index)}
               />
             ))}
-          </CarouselCore>
+          </div>
+          <button
+            onClick={goToNext}
+            className={twMerge(
+              'hidden justify-center p-2 mt-3 border border-gray-100 rounded-full cursor-pointer lg:block',
+              [
+                activeIndex === product.productimage_set.length - 1 &&
+                  'cursor-not-allowed opacity-45'
+              ]
+            )}
+            disabled={activeIndex === product.productimage_set.length - 1}
+          >
+            <Icon name="chevron-down" size={15} className="fill-[#000000]" />
+          </button>
         </div>
       </div>
 
@@ -187,6 +140,6 @@ export default function ProductInfoSlider({ product }: ProductSliderItem) {
           ))}
         </CarouselCore>
       </div>
-    </>
+    </div>
   );
 }

package/codemods/composable-auth/index.js

@@ -0,0 +1,220 @@
+/**
+ * composable-auth
+ *
+ * Opens the brand's login screen to the theme editor without adding a route.
+ *
+ * What it does, per `auth` route directory found under src/app:
+ *   1. moves `auth/page.tsx` into `auth/(login)/page.tsx` (a route group — the
+ *      URL does not change);
+ *   2. writes `auth/(login)/layout.tsx`, which mounts the login body slot with
+ *      the page itself as the fallback.
+ *
+ * Why the route group: the slot has to sit in a layout, because a ChromeSlot is
+ * an async server component and the login page is a client one. A layout at
+ * `auth/layout.tsx` would also wrap `auth/oauth-login`, the OAuth callback —
+ * whose whole job is a `signIn()` effect and which renders no markup at all, so
+ * a login composition placed over it would break social sign-in with nothing on
+ * screen to notice. The group scopes the mount to the login screen alone.
+ *
+ * Login and register stay on this one screen; whether they read as tabs or as
+ * two forms side by side is composed in the editor (starter templates ship both
+ * shapes), so no `/auth/register` route is created here.
+ *
+ * A brand that already owns an `auth/layout.tsx` is triaged rather than refused
+ * wholesale. Nested layouts compose, so when that layout simply wraps
+ * `children` the group layout goes underneath it and the brand's frame keeps
+ * rendering around the composition. Two shapes cannot be handled and are
+ * reported instead of touched: a layout that imports `./page` itself (moving the
+ * page would break the import) and a layout that never renders `children` (the
+ * nested slot would never render). Both mean the "layout" is really the page.
+ *
+ * Usage:
+ *   node codemods/composable-auth/index.js [--dry-run]
+ *   npx @akinon/projectzero codemod --codemod=composable-auth [--dry-run]
+ */
+
+const path = require('path');
+const fs = require('fs');
+
+const GROUP_DIR = '(login)';
+
+const LAYOUT_SOURCE = `import ChromeSlot from '@akinon/pz-theme/src/chrome/chrome-slot';
+import { PLACEHOLDER_SLUGS } from '@akinon/pz-theme/src/chrome/placeholder-slugs';
+
+/**
+ * The login screen is handed to the theme editor here rather than in page.tsx,
+ * because the slot is an async server component and the page is a client one.
+ * With no composition published the slot renders the page untouched.
+ *
+ * The slot lives in a \`(login)\` route group so the composition covers exactly
+ * this screen: \`auth/oauth-login\` is a provider callback, and a login body
+ * mounted one level up would replace it too.
+ *
+ * No \`pageContext\`: an auth screen fetches no commerce data, and the blocks a
+ * designer rebuilds it from (\`auth-form\`, \`register-form\`, \`oauth-buttons\`)
+ * read the session client-side.
+ */
+export default function LoginLayout({
+  children
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    // \`contents\` on both wrappers keeps the slot chain layout-transparent, so
+    // an uncomposed login page keeps its own box model even where a brand's
+    // <main> is a flex or grid container.
+    <ChromeSlot
+      slug={PLACEHOLDER_SLUGS.auth}
+      fallback={children}
+      className="contents"
+      fallbackClassName="contents"
+    />
+  );
+}
+`;
+
+function log(msg) {
+  const ts = new Date().toISOString().replace('T', ' ').slice(0, 19);
+  console.log(`[${ts}] ${msg}`);
+}
+
+/**
+ * Every directory named `auth` that holds a login page, anywhere under src/app.
+ * An already-migrated brand keeps its page inside the group, so both spellings
+ * count — otherwise a second run would report "nothing to do" and a brand whose
+ * layout went missing could never be repaired.
+ */
+function findAuthPageDirs(appRoot) {
+  const found = [];
+
+  const visit = (dir) => {
+    for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+      if (!entry.isDirectory()) continue;
+
+      const entryPath = path.join(dir, entry.name);
+
+      if (
+        entry.name === 'auth' &&
+        (fs.existsSync(path.join(entryPath, 'page.tsx')) ||
+          fs.existsSync(path.join(entryPath, GROUP_DIR, 'page.tsx')))
+      ) {
+        found.push(entryPath);
+      }
+
+      visit(entryPath);
+    }
+  };
+
+  visit(appRoot);
+
+  return found;
+}
+
+const transform = () => {
+  const cwd = path.resolve(process.cwd());
+  const dryRun = process.argv.includes('--dry-run');
+  const appRoot = path.join(cwd, 'src', 'app');
+
+  if (!fs.existsSync(appRoot)) {
+    log(`composable-auth: no src/app at ${cwd}, skipping`);
+    return;
+  }
+
+  const authDirs = findAuthPageDirs(appRoot);
+
+  if (authDirs.length === 0) {
+    log('composable-auth: no auth/page.tsx found, nothing to do');
+    return;
+  }
+
+  let mounted = 0;
+  let already = 0;
+  let manual = 0;
+
+  for (const authDir of authDirs) {
+    const relative = path.relative(cwd, authDir).split(path.sep).join('/');
+    const groupDir = path.join(authDir, GROUP_DIR);
+    const layoutPath = path.join(groupDir, 'layout.tsx');
+    const groupPagePath = path.join(groupDir, 'page.tsx');
+    const pagePath = path.join(authDir, 'page.tsx');
+
+    if (fs.existsSync(groupPagePath) && fs.existsSync(layoutPath)) {
+      log(`composable-auth: ${relative} already mounted, skipping`);
+      already++;
+      continue;
+    }
+
+    const brandLayoutPath = path.join(authDir, 'layout.tsx');
+    let nestsUnderBrandLayout = false;
+
+    if (fs.existsSync(brandLayoutPath)) {
+      const brandLayout = fs.readFileSync(brandLayoutPath, 'utf8');
+
+      if (/(from|require\()\s*['"]\.\/page['"]/.test(brandLayout)) {
+        log(
+          `composable-auth: ${relative}/layout.tsx imports ./page itself, so ` +
+            'moving the page would break that import. Mount the slot inside ' +
+            'that file by hand. Skipping.'
+        );
+        manual++;
+        continue;
+      }
+
+      if (!brandLayout.includes('children')) {
+        log(
+          `composable-auth: ${relative}/layout.tsx never renders children — it ` +
+            'is the login screen wearing a layout filename, so a nested slot ' +
+            'would never render. Mount the slot inside that file by hand. ' +
+            'Skipping.'
+        );
+        manual++;
+        continue;
+      }
+
+      // Nested layouts compose: the brand's frame stays outside the slot and
+      // keeps wrapping whatever the designer composes.
+      nestsUnderBrandLayout = true;
+    }
+
+    const needsMove = !fs.existsSync(groupPagePath);
+
+    if (dryRun) {
+      log(
+        needsMove
+          ? `composable-auth: would move ${relative}/page.tsx into ` +
+              `${GROUP_DIR}/ and write ${GROUP_DIR}/layout.tsx`
+          : `composable-auth: would write the missing ${relative}/${GROUP_DIR}/layout.tsx`
+      );
+      mounted++;
+      continue;
+    }
+
+    fs.mkdirSync(groupDir, { recursive: true });
+
+    if (needsMove) {
+      fs.renameSync(pagePath, groupPagePath);
+    }
+
+    fs.writeFileSync(layoutPath, LAYOUT_SOURCE, 'utf8');
+
+    log(
+      nestsUnderBrandLayout
+        ? `composable-auth: mounted the login body slot in ${relative}, nested ` +
+            'under the existing auth layout — that frame still renders around ' +
+            'the composition'
+        : `composable-auth: mounted the login body slot in ${relative}`
+    );
+    mounted++;
+  }
+
+  log(
+    `composable-auth: ${mounted} mounted, ${already} already done, ` +
+      `${manual} need a manual merge${dryRun ? ' (dry-run, nothing written)' : ''}`
+  );
+};
+
+module.exports = { transform };
+
+if (require.main === module) {
+  transform();
+}

package/commands/plugins.ts

@@ -164,10 +164,6 @@ export default async () => {
       name: 'Tamara Payment Extension',
       value: 'pz-tamara-extension'
     },
-    {
-      name: 'Similar Products',
-      value: 'pz-similar-products'
-    },
     {
       name: 'Hepsipay',
       value: 'pz-hepsipay'

package/dist/commands/plugins.js

@@ -183,10 +183,6 @@ 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'

package/package.json

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

package/app-template/src/app/api/client-env/route.ts

@@ -1,5 +0,0 @@
-export { GET } from '@akinon/next/api/client-env';
-
-// NEXT_PUBLIC_* values are read from the server runtime, not the build. Force
-// dynamic so Next never statically caches an (empty) build-time response.
-export const dynamic = 'force-dynamic';

package/app-template/src/app/global-error.tsx

@@ -1,22 +0,0 @@
-'use client';
-
-import { useSentryUncaughtErrors } from '@akinon/next/hooks';
-
-export default function GlobalError({
-  error,
-  reset
-}: {
-  error: Error & { digest?: string };
-  reset: () => void;
-}) {
-  useSentryUncaughtErrors(error);
-
-  return (
-    <html>
-      <body>
-        <h2>Something went wrong!</h2>
-        <button onClick={() => reset()}>Try again</button>
-      </body>
-    </html>
-  );
-}