@akinon/projectzero 2.0.50-beta.0 → 2.0.50

package/CHANGELOG.md

@@ -1,6 +1,10 @@
 # @akinon/projectzero
 
-## 2.0.50-beta.0
+## 2.0.50
+
+### Patch Changes
+
+- 79d611c: ZERO-4745: Mount the login body slot and anchor the auth route rules to segment boundaries
 
 ## 2.0.49
 

package/app-template/CHANGELOG.md

@@ -1,37 +1,37 @@
 # projectzeronext
 
-## 2.0.50-beta.0
-
-### Patch Changes
-
-- Updated dependencies [cbbbfd75]
-  - @akinon/next@2.0.50-beta.0
-  - @akinon/pz-theme@2.0.50-beta.0
-  - @akinon/pz-virtual-try-on@2.0.50-beta.0
-  - @akinon/pz-akifast@2.0.50-beta.0
-  - @akinon/pz-apple-pay@2.0.50-beta.0
-  - @akinon/pz-b2b@2.0.50-beta.0
-  - @akinon/pz-basket-gift-pack@2.0.50-beta.0
-  - @akinon/pz-bkm@2.0.50-beta.0
-  - @akinon/pz-checkout-gift-pack@2.0.50-beta.0
-  - @akinon/pz-click-collect@2.0.50-beta.0
-  - @akinon/pz-credit-payment@2.0.50-beta.0
-  - @akinon/pz-cybersource-uc@2.0.50-beta.0
-  - @akinon/pz-flow-payment@2.0.50-beta.0
-  - @akinon/pz-google-pay@2.0.50-beta.0
-  - @akinon/pz-gpay@2.0.50-beta.0
-  - @akinon/pz-haso@2.0.50-beta.0
-  - @akinon/pz-hepsipay@2.0.50-beta.0
-  - @akinon/pz-masterpass@2.0.50-beta.0
-  - @akinon/pz-masterpass-rest@2.0.50-beta.0
-  - @akinon/pz-multi-basket@2.0.50-beta.0
-  - @akinon/pz-one-click-checkout@2.0.50-beta.0
-  - @akinon/pz-otp@2.0.50-beta.0
-  - @akinon/pz-pay-on-delivery@2.0.50-beta.0
-  - @akinon/pz-saved-card@2.0.50-beta.0
-  - @akinon/pz-similar-products@2.0.50-beta.0
-  - @akinon/pz-tabby-extension@2.0.50-beta.0
-  - @akinon/pz-tamara-extension@2.0.50-beta.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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "projectzeronext",
-  "version": "2.0.50-beta.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-beta.0",
-    "@akinon/pz-akifast": "2.0.50-beta.0",
-    "@akinon/pz-apple-pay": "2.0.50-beta.0",
-    "@akinon/pz-b2b": "2.0.50-beta.0",
-    "@akinon/pz-basket-gift-pack": "2.0.50-beta.0",
-    "@akinon/pz-bkm": "2.0.50-beta.0",
-    "@akinon/pz-checkout-gift-pack": "2.0.50-beta.0",
-    "@akinon/pz-click-collect": "2.0.50-beta.0",
-    "@akinon/pz-credit-payment": "2.0.50-beta.0",
-    "@akinon/pz-cybersource-uc": "2.0.50-beta.0",
-    "@akinon/pz-flow-payment": "2.0.50-beta.0",
-    "@akinon/pz-google-pay": "2.0.50-beta.0",
-    "@akinon/pz-gpay": "2.0.50-beta.0",
-    "@akinon/pz-haso": "2.0.50-beta.0",
-    "@akinon/pz-hepsipay": "2.0.50-beta.0",
-    "@akinon/pz-masterpass": "2.0.50-beta.0",
-    "@akinon/pz-masterpass-rest": "2.0.50-beta.0",
-    "@akinon/pz-multi-basket": "2.0.50-beta.0",
-    "@akinon/pz-one-click-checkout": "2.0.50-beta.0",
-    "@akinon/pz-otp": "2.0.50-beta.0",
-    "@akinon/pz-pay-on-delivery": "2.0.50-beta.0",
-    "@akinon/pz-saved-card": "2.0.50-beta.0",
-    "@akinon/pz-similar-products": "2.0.50-beta.0",
-    "@akinon/pz-tabby-extension": "2.0.50-beta.0",
-    "@akinon/pz-tamara-extension": "2.0.50-beta.0",
-    "@akinon/pz-theme": "2.0.50-beta.0",
-    "@akinon/pz-virtual-try-on": "2.0.50-beta.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",
@@ -74,7 +74,7 @@
     "yup": "0.32.11"
   },
   "devDependencies": {
-    "@akinon/eslint-plugin-projectzero": "2.0.50-beta.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",

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/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/package.json

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