Add stock transfer cancelled message in ResourceListItem > shipment

packages/app-elements/src/helpers/shipments.test.ts

@@ -0,0 +1,44 @@
+import type { Shipment } from "@commercelayer/sdk"
+import { presetResourceListItem } from "#ui/resources/ResourceListItem/ResourceListItem.mocks"
+import { isAllStockTransfersCancelled } from "./shipments"
+
+describe("isAllStockTransfersCancelled", () => {
+  test("returns false when stock_transfers is an empty array", () => {
+    expect(
+      isAllStockTransfersCancelled(presetResourceListItem.shipmentOnHold),
+    ).toBe(false)
+  })
+
+  test("returns true when all stock transfers are cancelled", () => {
+    expect(
+      isAllStockTransfersCancelled(
+        presetResourceListItem.shipmentStockTransferCancelled,
+      ),
+    ).toBe(true)
+  })
+
+  test("returns false when stock_transfers is undefined", () => {
+    expect(
+      isAllStockTransfersCancelled(presetResourceListItem.shipmentUpcoming),
+    ).toBe(false)
+  })
+
+  test("returns false when not all stock transfers are cancelled", () => {
+    const shipment: Shipment = {
+      ...presetResourceListItem.shipmentStockTransferCancelled,
+      stock_transfers: [
+        ...(presetResourceListItem.shipmentStockTransferCancelled
+          .stock_transfers ?? []),
+        {
+          id: "abc123",
+          type: "stock_transfers",
+          status: "upcoming",
+          quantity: 1,
+          created_at: "2026-01-21T14:37:15.049Z",
+          updated_at: "2026-01-21T14:37:15.049Z",
+        },
+      ],
+    }
+    expect(isAllStockTransfersCancelled(shipment)).toBe(false)
+  })
+})

packages/app-elements/src/helpers/shipments.ts

@@ -0,0 +1,12 @@
+import type { Shipment } from "@commercelayer/sdk"
+
+export function isAllStockTransfersCancelled(shipment: Shipment) {
+  const stockTransfers = shipment.stock_transfers ?? []
+
+  return (
+    stockTransfers.length > 0 &&
+    stockTransfers.every(
+      (stockTransfer) => stockTransfer.status === "cancelled",
+    )
+  )
+}

packages/app-elements/src/locales/en.ts

@@ -679,6 +679,8 @@ const en = {
         weight: "Weight",
         parcel_item: "{{count}} item",
         parcel_item_other: "{{count}} items",
+        stock_transfer_cancelled: "Stock transfer cancelled",
+        stock_transfer_cancelled_other: "Stock transfers cancelled",
       },
       tasks: {
         pending: "Pending",

packages/app-elements/src/locales/it.ts

@@ -672,6 +672,8 @@ const it: typeof en = {
         weight: "Peso",
         parcel_item: "{{count}} prodotto",
         parcel_item_other: "{{count}} prodotti",
+        stock_transfer_cancelled: "Stock transfer cancellato",
+        stock_transfer_cancelled_other: "Stock transfer cancellati",
       },
       tasks: {
         pending: "Aperte",

packages/app-elements/src/main.ts

@@ -55,6 +55,7 @@ export {
   getResourceEndpoint,
   type TriggerAttribute,
 } from "#helpers/resources"
+export { isAllStockTransfersCancelled } from "#helpers/shipments"
 export {
   getAvatarSrcFromRate,
   getParcelTrackingDetail,

packages/app-elements/src/ui/resources/ResourceListItem/ResourceListItem.mocks.ts

@@ -430,6 +430,37 @@ export const presetResourceListItem = {
     status: "on_hold",
     stock_location: originStockLocation,
     shipping_method: shippingMethod,
+    stock_transfers: [],
+  },
+  shipmentStockTransferCancelled: {
+    type: "shipments",
+    id: "",
+    created_at: "",
+    updated_at: "2023-06-10T06:38:44.964Z",
+    number: "30817130/S/0001",
+    status: "on_hold",
+    stock_location: originStockLocation,
+    shipping_method: shippingMethod,
+    stock_transfers: [
+      {
+        id: "KYjkfWxgJO",
+        type: "stock_transfers",
+        number: "1201814",
+        sku_code: "sku3",
+        status: "cancelled",
+        quantity: 1,
+        on_hold_at: null,
+        picking_at: null,
+        in_transit_at: null,
+        completed_at: null,
+        cancelled_at: "2026-01-21T14:39:37.972Z",
+        created_at: "2026-01-21T14:37:15.049Z",
+        updated_at: "2026-01-21T14:39:37.959Z",
+        reference: null,
+        reference_origin: null,
+        metadata: {},
+      },
+    ],
   },
   shipmentShipped: {
     type: "shipments",

packages/app-elements/src/ui/resources/ResourceListItem/transformers/shipments.tsx

@@ -2,6 +2,7 @@ import type { Shipment } from "@commercelayer/sdk"
 import { isEmpty } from "lodash-es"
 import { getShipmentDisplayStatus } from "#dictionaries/shipments"
 import { formatDate } from "#helpers/date"
+import { isAllStockTransfersCancelled } from "#helpers/shipments"
 import { RadialProgress } from "#ui/atoms/RadialProgress"
 import {
   ListItemDescription,
@@ -50,6 +51,14 @@ export const shipmentToProps: ResourceToProps<Shipment> = ({
           locale: user?.locale,
         })}
         additionalInfos={`${reference}${info}`}
+        additionalSuffix={
+          isAllStockTransfersCancelled(resource) &&
+          resource.status === "on_hold"
+            ? t("apps.shipments.details.stock_transfer_cancelled", {
+                count: resource.stock_transfers?.length ?? 0,
+              })
+            : undefined
+        }
       />
     ),
     icon: