@akinon/pz-theme 2.0.154-rc.6 → 2.0.154

package/CHANGELOG.md

@@ -1,51 +1,12 @@
 # @akinon/pz-theme
 
-## 2.0.154-rc.6
-
-### Patch Changes
-
-- 8e040731: ZERO-5235: let brands hang actions on order detail lines
-  - @akinon/next@2.0.154-rc.6
-  - @akinon/theme-contract@2.0.154-rc.6
-
-## 2.0.154-rc.5
-
-### Patch Changes
-
-- ad5240c4: ZERO-5254: add custom render and theme editor support to pz-rate-review
-- Updated dependencies [219164a3]
-- Updated dependencies [86187b1c2]
-- Updated dependencies [0cf9ea239]
-- Updated dependencies [97d29893]
-- Updated dependencies [324f97d55]
-- Updated dependencies [51ea06888]
-- Updated dependencies
-- Updated dependencies [2fea41430]
-- Updated dependencies [b55acb768]
-- Updated dependencies [760258c1c]
-- Updated dependencies [143be2b9d]
-- Updated dependencies [7889b08fe]
-- Updated dependencies [9f8cd3bc5]
-- Updated dependencies [bfafa3f49]
-- Updated dependencies [57d7eb305]
-- Updated dependencies [d99a6a7d5]
-- Updated dependencies [9db81a714]
-- Updated dependencies [591e345e1]
-- Updated dependencies [4de5303c5]
-- Updated dependencies [95b139dc1]
-- Updated dependencies [1d00f2d06]
-- Updated dependencies [4ac7b2a1e]
-- Updated dependencies [4998a9631]
-- Updated dependencies [804d2bd6c]
-- Updated dependencies [3909d3224]
-- Updated dependencies [6a3d8a631]
-- Updated dependencies [e18836b20]
-- Updated dependencies [b1111d7b1]
-- Updated dependencies [1595d458e]
-- Updated dependencies [dca128112]
-- Updated dependencies [9c778307]
-  - @akinon/next@2.0.154-rc.5
-  - @akinon/theme-contract@2.0.154-rc.5
+## 2.0.154
+
+### Patch Changes
+
+- 51a88b89: ZERO-5183: Give the order cancellation screen its own placeholder (`account-order-cancellation-body`) so it can be composed in the theme editor. The `order-detail` block gains an "Easy return" link for orders that can be returned and, per returned line, the return method (scheduled pickup or standard), the carrier and the pickup date, each behind its own switch. Order rows now keep units of one product together only while they share a status and cancellation/return request, so returning one of two units no longer reads as both returned.
+  - @akinon/next@2.0.154
+  - @akinon/theme-contract@2.0.154
 
 ## 2.0.153
 

package/package.json

@@ -1,19 +1,19 @@
 {
   "name": "@akinon/pz-theme",
   "description": "Theme package for Project Zero Next — ThemePlaceholder system and theme editor infrastructure",
-  "version": "2.0.154-rc.6",
+  "version": "2.0.154",
   "license": "MIT",
   "main": "src/index.ts",
   "scripts": {
     "test": "jest"
   },
   "peerDependencies": {
-    "@akinon/next": "2.0.154-rc.6",
+    "@akinon/next": "2.0.154",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@akinon/theme-contract": "2.0.154-rc.6",
+    "@akinon/theme-contract": "2.0.154",
     "clsx": "2.1.1",
     "lottie-web": "^5.13.0",
     "react-multi-carousel": "2.8.4",
@@ -21,7 +21,7 @@
     "zod": "4.4.1"
   },
   "devDependencies": {
-    "@akinon/next": "2.0.154-rc.6",
+    "@akinon/next": "2.0.154",
     "@testing-library/jest-dom": "5.16.4",
     "@testing-library/react": "16.3.2",
     "@testing-library/user-event": "14.1.1",

package/src/__tests__/account-slot-coverage.test.ts

@@ -27,6 +27,7 @@ const EXPECTED_MOUNTS: Record<string, string> = {
   accountDashboard: '(dashboard)/layout.tsx',
   accountOrders: 'orders/(list)/layout.tsx',
   accountOrderDetail: 'orders/[id]/(detail)/layout.tsx',
+  accountOrderCancellation: 'orders/[id]/cancellation/layout.tsx',
   accountAddresses: 'address/layout.tsx',
   accountProfile: 'profile/layout.tsx',
   accountChangePassword: 'change-password/layout.tsx',

package/src/__tests__/custom-css.test.ts

@@ -61,6 +61,18 @@ describe('scoped custom CSS', () => {
     expect(css).toContain(`${SCOPE} button`);
   });
 
+  it('leaves commas inside :has(), :is() and attribute values alone', () => {
+    // ZERO-5183: the second half of `:has(a, b)` used to come out as
+    // `:has(a, <scope> b)` — a selector that can never match.
+    const css = scopeCustomCss(
+      '& li:has([data-a], [data-b]) { display: flex; }\n& :is(p, span)[title="x, y"], em { color: red; }',
+      SCOPE
+    );
+
+    expect(css).toContain(`${SCOPE} li:has([data-a], [data-b]) {`);
+    expect(css).toContain(`${SCOPE} :is(p, span)[title="x, y"], ${SCOPE} em {`);
+  });
+
   it('scopes inside a media query and keeps the condition', () => {
     const css = scopeCustomCss(
       '@media (max-width: 768px) { & [data-part="option"] { flex: 1 1 100%; } }',

package/src/__tests__/route-slug.test.ts

@@ -80,6 +80,13 @@ describe('resolveBodySlug', () => {
       PLACEHOLDER_SLUGS.accountAddresses
     );
     expect(resolveBodySlug('/users/orders/5/cancellation')).toBe(
+      PLACEHOLDER_SLUGS.accountOrderCancellation
+    );
+    expect(resolveBodySlug('/account/orders/5/cancellation/')).toBe(
+      PLACEHOLDER_SLUGS.accountOrderCancellation
+    );
+    // Any other screen under an order stays on the detail body.
+    expect(resolveBodySlug('/account/orders/5/invoice')).toBe(
       PLACEHOLDER_SLUGS.accountOrderDetail
     );
   });

package/src/blocks/__tests__/group-order-items.test.ts

@@ -0,0 +1,87 @@
+import { groupOrderItems } from '../product-block-utils';
+
+/**
+ * ZERO-5183 — pz writes one order line per unit and the order blocks collapse
+ * the units of a product into one row. A row shows its first unit's status and
+ * return details, so units only share it while they are in the same state:
+ * returning 1 of 2 must not read as both returned.
+ */
+const product = { pk: 7, name: 'Gömlek', image: '/x.jpg', absolute_url: '#' };
+
+const unit = (id: number, extra: Record<string, unknown> = {}) => ({
+  id,
+  price: '100.00',
+  quantity: 1,
+  status: { value: '550', label: 'Teslim Edildi' },
+  active_cancellation_request: null,
+  product,
+  ...extra
+});
+
+describe('groupOrderItems', () => {
+  it('still collapses units of a product that share a state', () => {
+    const rows = groupOrderItems([unit(1), unit(2), unit(3)]);
+
+    expect(rows).toHaveLength(1);
+    expect(rows[0]).toMatchObject({ key: '7', quantity: 3, total: 300 });
+  });
+
+  it('gives a returned unit its own row', () => {
+    const returned = unit(2, {
+      status: { value: '600', label: 'İade Edildi' },
+      active_cancellation_request: { easy_return: { code: 'R1' } }
+    });
+    const rows = groupOrderItems([unit(1), returned]);
+
+    expect(rows.map((row) => [row.key, row.quantity, row.item.id])).toEqual([
+      ['7', 1, 1],
+      ['7-2', 1, 2]
+    ]);
+  });
+
+  it('splits on a pending request even before the status moves', () => {
+    const requested = unit(2, {
+      active_cancellation_request: [{ id: 31, easy_return: { code: 'R1' } }]
+    });
+
+    expect(groupOrderItems([unit(1), requested])).toHaveLength(2);
+  });
+
+  it('keeps units returned under the same request together, and separate requests apart', () => {
+    const returned = (id: number, code: string) =>
+      unit(id, {
+        status: { value: '600', label: 'İade Edildi' },
+        active_cancellation_request: { easy_return: { code } }
+      });
+
+    expect(
+      groupOrderItems([returned(1, 'R1'), returned(2, 'R1')]).map(
+        (row) => row.quantity
+      )
+    ).toEqual([2]);
+    expect(
+      groupOrderItems([returned(1, 'R1'), returned(2, 'R2')]).map(
+        (row) => row.key
+      )
+    ).toEqual(['7', '7-2']);
+  });
+
+  it('merges a later unit back into the row of its state', () => {
+    const cancelled = unit(2, { status: { value: '100', label: 'İptal' } });
+    const rows = groupOrderItems([unit(1), cancelled, unit(3)]);
+
+    expect(rows.map((row) => [row.key, row.quantity])).toEqual([
+      ['7', 2],
+      ['7-2', 1]
+    ]);
+  });
+
+  it('never merges lines without a product pk', () => {
+    const rows = groupOrderItems([
+      { id: 1, price: '1', quantity: 1, product: { name: 'A' } },
+      { id: 2, price: '1', quantity: 1, product: { name: 'A' } }
+    ]);
+
+    expect(rows.map((row) => row.key)).toEqual(['1', '2']);
+  });
+});

package/src/blocks/__tests__/order-detail-return.test.tsx

@@ -0,0 +1,208 @@
+import React from 'react';
+import { render } from '@testing-library/react';
+import OrderDetailBlock from '../order-detail-block';
+
+/**
+ * ZERO-5183 — the order detail is where an easy return starts and where a
+ * returned line says how it goes back: a "Kolay iade" link on an order that
+ * can be returned, and per line the method (a booked pickup or a standard
+ * drop-off), the carrier and the pickup day, each behind its own switch.
+ */
+let order: Record<string, unknown> | null = null;
+
+jest.mock('next/navigation', () => ({
+  useParams: () => ({ id: '42' }),
+  useSearchParams: () => null
+}));
+
+jest.mock('next-auth/react', () => ({
+  useSession: () => ({ data: null, status: 'authenticated' })
+}));
+
+jest.mock('@akinon/next/hooks', () => ({
+  __esModule: true,
+  useLocalization: () => ({ locale: 'tr', currency: 'try' })
+}));
+
+jest.mock('@akinon/next/data/client/account', () => ({
+  __esModule: true,
+  useGetOrderQuery: () => ({ data: order, isLoading: false })
+}));
+
+const line = (id: number, request: unknown) => ({
+  id,
+  price: '5499.00',
+  quantity: 1,
+  status: { value: '600', label: 'İade Edildi' },
+  active_cancellation_request: request,
+  product: { pk: id, name: `Gömlek ${id}`, image: '/x.jpg', absolute_url: '#' }
+});
+
+const blockOf = (properties: Record<string, unknown>) => ({
+  id: 'order-detail-1',
+  type: 'order-detail',
+  properties,
+  styles: {},
+  blocks: []
+});
+
+const ALL_ON = {
+  showReturnLink: { desktop: true },
+  returnLinkLabel: { desktop: 'Kolay iade' },
+  showReturnMethod: { desktop: true },
+  returnMethodLabel: { desktop: 'İade yöntemi:' },
+  appointmentReturnLabel: { desktop: 'Randevulu' },
+  standardReturnLabel: { desktop: 'Standart' },
+  showReturnCarrier: { desktop: true },
+  returnCarrierLabel: { desktop: 'Kargo:' },
+  showPickupDate: { desktop: true },
+  pickupDateLabel: { desktop: 'Randevu tarihi:' }
+};
+
+const texts = (root: ParentNode, part: string) =>
+  Array.from(root.querySelectorAll(`[data-part="${part}"]`)).map((e) =>
+    (e.textContent || '').replace(/\s+/g, ' ').trim()
+  );
+
+beforeEach(() => {
+  order = {
+    id: 42,
+    number: 'G-42',
+    amount: '10998.00',
+    is_cancellable: false,
+    is_refundable: true,
+    status: { value: '550', label: 'Teslim edildi' },
+    orderitem_set: [
+      line(1, [
+        {
+          pickup_date: { date: '2026-04-11' },
+          easy_return: {
+            code: 'R-1',
+            shipping_company: { label: 'Hepsijet' }
+          }
+        }
+      ]),
+      line(2, {
+        easy_return: {
+          code: 'R-2',
+          shipping_company: { label: 'Yurtiçi Kargo' }
+        }
+      }),
+      { ...line(3, null), status: { value: '550', label: 'Teslim edildi' } }
+    ]
+  };
+});
+
+describe('order detail — easy returns', () => {
+  it('links a returnable order to the easy-return screen', () => {
+    const { container } = render(
+      <OrderDetailBlock
+        block={blockOf(ALL_ON) as never}
+        placeholderId="p1"
+        sectionId="s1"
+        isDesigner={false}
+      />
+    );
+    const link = container.querySelector('[data-part="return-link"]');
+
+    expect(link?.textContent).toContain('Kolay iade');
+    expect(link?.getAttribute('href')).toBe('/account/orders/42/cancellation');
+    // The cancel link stays for orders that can still be cancelled.
+    expect(container.querySelector('[data-part="cancel-link"]')).toBeNull();
+  });
+
+  it('says how each returned line goes back', () => {
+    const { container } = render(
+      <OrderDetailBlock
+        block={blockOf(ALL_ON) as never}
+        placeholderId="p1"
+        sectionId="s1"
+        isDesigner={false}
+      />
+    );
+
+    expect(texts(container, 'item-return-method')).toEqual([
+      'İade yöntemi: Randevulu',
+      'İade yöntemi: Standart'
+    ]);
+    expect(texts(container, 'item-return-carrier')).toEqual([
+      'Kargo: Hepsijet',
+      'Kargo: Yurtiçi Kargo'
+    ]);
+    expect(texts(container, 'item-pickup-date')).toEqual([
+      'Randevu tarihi: 11.04.2026'
+    ]);
+  });
+
+  it('keeps every new line behind its switch', () => {
+    const { container } = render(
+      <OrderDetailBlock
+        block={blockOf({}) as never}
+        placeholderId="p1"
+        sectionId="s1"
+        isDesigner={false}
+      />
+    );
+
+    expect(container.querySelector('[data-part="return-link"]')).toBeNull();
+    expect(texts(container, 'item-return-method')).toEqual([]);
+    expect(texts(container, 'item-return-carrier')).toEqual([]);
+    expect(texts(container, 'item-pickup-date')).toEqual([]);
+  });
+
+  it('offers no return link on an order that cannot be returned', () => {
+    order = { ...order, is_refundable: false };
+    const { container } = render(
+      <OrderDetailBlock
+        block={blockOf(ALL_ON) as never}
+        placeholderId="p1"
+        sectionId="s1"
+        isDesigner={false}
+      />
+    );
+
+    expect(container.querySelector('[data-part="return-link"]')).toBeNull();
+  });
+
+  it('links only a delivered line that has no request yet', () => {
+    // As commerce answers after a return: the order and its lines stay
+    // refundable while the request is open.
+    const flagged: Record<string, unknown>[] = (
+      order.orderitem_set as Record<string, unknown>[]
+    ).map((item) => ({ ...item, is_refundable: true }));
+    const returnLink = () =>
+      render(
+        <OrderDetailBlock
+          block={blockOf(ALL_ON) as never}
+          placeholderId="p1"
+          sectionId="s1"
+          isDesigner={false}
+        />
+      ).container.querySelector('[data-part="return-link"]');
+
+    // Line 3 has no request yet: it can still be returned.
+    order = { ...order, orderitem_set: flagged };
+    expect(returnLink()).not.toBeNull();
+
+    order = {
+      ...order,
+      orderitem_set: flagged.map((item) =>
+        item.id === 3
+          ? { ...item, active_cancellation_request: { id: 54766 } }
+          : item
+      )
+    };
+    expect(returnLink()).toBeNull();
+
+    // Commerce calls a shipped line refundable too; it is not returned yet.
+    order = {
+      ...order,
+      orderitem_set: flagged.map((item) =>
+        item.id === 3
+          ? { ...item, status: { value: '500', label: 'Gönderildi' } }
+          : item
+      )
+    };
+    expect(returnLink()).toBeNull();
+  });
+});

package/src/blocks/item-template.tsx

@@ -15,7 +15,6 @@ import {
   resolveItemProduct
 } from './item-template-utils';
 import { ThemeItemScopeProvider } from './product-block-utils';
-import { ThemeRowScopeProvider } from './row-scope';
 
 export {
   findItemTemplate,
@@ -121,15 +120,20 @@ export const ItemTemplateList = ({
   const scopesProducts = publishesProductItems(block.type);
   // The same slice the iterator applied, so clone N is handed the row it
   // was built from rather than row N.
-  const slicedRows = sliceIteratorItems(block, rows).items;
+  const scopedRows = scopesProducts
+    ? sliceIteratorItems(block, rows).items
+    : rows;
 
   return (
     <>
       {clones.map((clone, index) => {
         const key = clone.id || `${template.id}-item-${index}`;
-        const rowData = slicedRows[index] ?? {};
         const row = (
           <ThemeBlock
+            // Keyed here so the non-scoped branch is the element it always
+            // was: wrapping it in anything, even a fragment, would change the
+            // element type at this position and remount every existing row.
+            key={key}
             block={clone}
             placeholderId={placeholderId}
             sectionId={sectionId}
@@ -139,32 +143,22 @@ export const ItemTemplateList = ({
             currentBreakpoint={currentBreakpoint}
           />
         );
-        const scoped = scopesProducts
-          ? resolveItemProduct(block.type, rowData)
-          : null;
 
-        // Context only — the providers render no element, so the markup a
-        // published row produces is unchanged. Every list opens the row
-        // scope; only product lists open the product scope on top of it.
+        if (!scopesProducts) return row;
+
+        const scoped = resolveItemProduct(block.type, scopedRows[index]);
+
+        // Context only — the provider renders no element, so the markup a
+        // published row produces is unchanged.
         return (
-          <ThemeRowScopeProvider
+          <ThemeItemScopeProvider
             key={key}
-            listType={block.type}
-            row={rowData}
-            index={index}
+            product={
+              scoped ?? (isDesigner ? DESIGNER_SAMPLE_PRODUCT : null)
+            }
           >
-            {scopesProducts ? (
-              <ThemeItemScopeProvider
-                product={
-                  scoped ?? (isDesigner ? DESIGNER_SAMPLE_PRODUCT : null)
-                }
-              >
-                {row}
-              </ThemeItemScopeProvider>
-            ) : (
-              row
-            )}
-          </ThemeRowScopeProvider>
+            {row}
+          </ThemeItemScopeProvider>
         );
       })}
     </>