@shopware-pwa/composables-next - npm Package Compare versions

Comparing version 1.5.0 to 1.6.0

package.json

 {
   "name": "@shopware-pwa/composables-next",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "Shopware Frontends composables for Vue",
@@ -65,3 +65,3 @@ "author": "Shopware",
     "@vue/test-utils": "2.4.6",
-    "happy-dom": "15.11.7",
+    "happy-dom": "16.6.0",
     "typescript": "5.6.3",
@@ -68,0 +68,0 @@ "unbuild": "2.0.0",

README.md

@@ -168,20 +168,15 @@ # shopware/frontends - composables-next
 
-### Latest changes: 1.5.0
+### Latest changes: 1.6.0
 
 ### Minor Changes
 
-- [#1489](https://github.com/shopware/frontends/pull/1489) [`2c337b5`](https://github.com/shopware/frontends/commit/2c337b5555495e5cc75f17f1c7f50cc25dfe7c1e) Thanks [@mdanilowicz](https://github.com/mdanilowicz)! - Changed `registration` method in the `useUser` composable. Because of changes in the double opt-in on registration flow in the Shopware backend we are adjusting this method on our side. In new approach we are checking `active` and `doubleOptInRegistration` properties that represents current status of the user.
+- [#1540](https://github.com/shopware/frontends/pull/1540) [`3778061`](https://github.com/shopware/frontends/commit/3778061f7fbc82e7deabfa466fd3bb8f34325f42) Thanks [@kasztof](https://github.com/kasztof)! - Allow to pass full seach criteria according to loadNavigationElements method of useNavigation composable
 
-- [#1369](https://github.com/shopware/frontends/pull/1369) [`13c83be`](https://github.com/shopware/frontends/commit/13c83bec53a6aaba49941b9bf869629eadeb4515) Thanks [@mdanilowicz](https://github.com/mdanilowicz)! - Added `buildDynamicBreadcrumbs` method for building breadcrumbs structure
-  Added `pushBreadcrumb` method to push single breadcrumb at the top of the breadcrumbs list
-  Added `associations` option to the `search` method in `useProductSearch` composable
-
 ### Patch Changes
 
-- [#1449](https://github.com/shopware/frontends/pull/1449) [`8ba9702`](https://github.com/shopware/frontends/commit/8ba9702657d1dc31cc653728788830fa38bb4992) Thanks [@mkucmus](https://github.com/mkucmus)! - Add configuration step to README.md
+- [#1564](https://github.com/shopware/frontends/pull/1564) [`3d2f2b5`](https://github.com/shopware/frontends/commit/3d2f2b5595ac847be66302befed921aa2f9264b6) Thanks [@mdanilowicz](https://github.com/mdanilowicz)! - Return the last element for the payment and shipping methods in `useOrderDetails`. The reason for this change is that the backend returns collections sorted by the entry date
 
-- [#1492](https://github.com/shopware/frontends/pull/1492) [`a03a492`](https://github.com/shopware/frontends/commit/a03a492f18ebff84606e47f5239330454c9f3039) Thanks [@mkucmus](https://github.com/mkucmus)! - `useCustomerOrders` - added checkPromotions flag for loading orders
+- [#1580](https://github.com/shopware/frontends/pull/1580) [`a04aa8c`](https://github.com/shopware/frontends/commit/a04aa8c0c705626bb231f8ead59c4c67a2d0d715) Thanks [@mdanilowicz](https://github.com/mdanilowicz)! - Added `shippingCosts` property in `useCart` composable that returns shipping costs of the cart, with the shipping discounts.
+  `shippingTotal` function is now deprecated as it only returns the first value from the array. The backend is returning a collection.
 
-- Updated dependencies [[`a87bbcf`](https://github.com/shopware/frontends/commit/a87bbcfa3f5aa440265b1e8f0fc72a204863befc), [`13c83be`](https://github.com/shopware/frontends/commit/13c83bec53a6aaba49941b9bf869629eadeb4515)]:
-  - @shopware/api-client@1.2.0
-  - @shopware-pwa/helpers-next@1.2.0
+- [#1550](https://github.com/shopware/frontends/pull/1550) [`63d56b3`](https://github.com/shopware/frontends/commit/63d56b3dacd6ca48a44744e387e6212a23c8bf4a) Thanks [@mdanilowicz](https://github.com/mdanilowicz)! - useCustomerOrders - Set current page based on the orders endpoint response

src/useCart/useCart.test.ts

@@ -218,2 +218,35 @@ import { beforeEach, describe, expect, it, vi } from "vitest";
   });
+
+  it("should return shipping costs", async () => {
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        deliveries: [
+          {
+            shippingMethod: {
+              id: "a9d9cc502b3547f4a89eb2830c032c78",
+            },
+          },
+          {
+            shippingMethod: {
+              id: "a9d9cc502b3547f4a89eb2830c032c78",
+            },
+          },
+        ],
+      },
+    });
+    await vm.refreshCart();
+
+    expect(vm.shippingCosts.length).toEqual(2);
+  });
+
+  it("should return empty shipping costs", async () => {
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        deliveries: null,
+      },
+    });
+    await vm.refreshCart();
+
+    expect(vm.shippingCosts.length).toEqual(0);
+  });
 });

src/useCart/useCart.ts

@@ -69,5 +69,11 @@ import { createSharedComposable } from "@vueuse/core";
    * Shipping price
+   *
+   * @deprecated Use `shippingCosts` instead
    */
   shippingTotal: ComputedRef<number>;
   /**
+   * Shipping costs
+   */
+  shippingCosts: ComputedRef<Schemas["CartDelivery"][]>;
+  /**
    * The total price of all cart items
@@ -243,2 +249,6 @@ */
 
+  const shippingCosts = computed(() => {
+    return cart.value?.deliveries || [];
+  });
+
   const subtotal = computed(() => {
@@ -302,2 +312,3 @@ const cartPrice = cart.value?.price?.positionPrice;
     consumeCartErrors,
+    shippingCosts,
   };
@@ -304,0 +315,0 @@ }

src/useCustomerOrders/useCustomerOrders.test.ts

@@ -37,2 +37,12 @@ import { describe, expect, it } from "vitest";
   });
+
+  it("should set current page after loading orders", async () => {
+    const { vm, injections } = useSetup(useCustomerOrders);
+    injections.apiClient.invoke.mockResolvedValue({
+      data: { orders: { elements: [], page: 23 } },
+    });
+    await vm.loadOrders();
+
+    expect(vm.currentPage).toBe(23);
+  });
 });

src/useCustomerOrders/useCustomerOrders.ts

@@ -67,2 +67,3 @@ import { computed, ref } from "vue";
     totalOrderItemsCount.value = fetchedOrders.data.orders.total ?? 0;
+    currentPaginationPage.value = fetchedOrders.data.orders.page ?? 1;
   };
@@ -69,0 +70,0 @@

src/useNavigation/useNavigation.test.ts

@@ -51,2 +51,19 @@ import { describe, expect, it, vi } from "vitest";
   });
+
+  it("should pass criteria to the api call", async () => {
+    const { vm, injections } = useSetup(useNavigation);
+    injections.apiClient.invoke.mockResolvedValue({ data: undefined });
+    vi.spyOn(injections.apiClient, "invoke").mockImplementation(() => {});
+
+    await vm.loadNavigationElements({
+      depth: 2,
+      includes: { category: ["name"] },
+    });
+    expect(injections.apiClient.invoke).toHaveBeenCalledWith(
+      expect.stringContaining("readNavigation"),
+      expect.objectContaining({
+        body: { depth: 2, includes: { category: ["name"] } },
+      }),
+    );
+  });
 });

src/useNavigation/useNavigation.ts

 import { computed, inject, provide, ref } from "vue";
 import type { ComputedRef, Ref } from "vue";
 import { useShopwareContext } from "#imports";
-import type { Schemas } from "#shopware";
+import type { Schemas, operations } from "#shopware";
 
@@ -18,5 +18,5 @@ /**
    */
-  loadNavigationElements(params: {
-    depth: number;
-  }): Promise<Schemas["NavigationRouteResponse"]>;
+  loadNavigationElements(
+    params: operations["readNavigation post /navigation/{activeId}/{rootId}"]["body"],
+  ): Promise<Schemas["NavigationRouteResponse"]>;
 };
@@ -53,3 +53,5 @@
 
-  async function loadNavigationElements({ depth }: { depth: number }) {
+  async function loadNavigationElements(
+    params: operations["readNavigation post /navigation/{activeId}/{rootId}"]["body"],
+  ) {
     try {
@@ -66,5 +68,3 @@ const navigationResponse = await apiClient.invoke(
           },
-          body: {
-            depth,
-          },
+          body: params,
         },
@@ -71,0 +71,0 @@ );

src/useOrderDetails/useOrderDetails.test.ts

@@ -134,2 +134,92 @@ import { describe, expect, it } from "vitest";
   });
+
+  it("should return current payment method", async () => {
+    const { vm, injections } = useSetup(() => useOrderDetails("123-test"));
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        orders: {
+          elements: [
+            {
+              transactions: [
+                {
+                  paymentMethod: {
+                    shortName: "invoice_payment",
+                  },
+                },
+                {
+                  paymentMethod: {
+                    shortName: "cash_payment",
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      },
+    });
+    await vm.loadOrderDetails();
+    expect(vm.paymentMethod?.shortName).toEqual("cash_payment");
+  });
+
+  it("should return current delivery method", async () => {
+    const { vm, injections } = useSetup(() => useOrderDetails("123-test"));
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        orders: {
+          elements: [
+            {
+              deliveries: [
+                {
+                  shippingMethod: {
+                    name: "test",
+                  },
+                },
+                {
+                  shippingMethod: {
+                    name: "Standard",
+                  },
+                },
+              ],
+            },
+          ],
+        },
+      },
+    });
+    await vm.loadOrderDetails();
+    expect(vm.shippingMethod?.name).toEqual("Standard");
+  });
+
+  it("should return undefined if payment method does not exists", async () => {
+    const { vm, injections } = useSetup(() => useOrderDetails("123-test"));
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        orders: {
+          elements: [
+            {
+              transactions: [],
+            },
+          ],
+        },
+      },
+    });
+    await vm.loadOrderDetails();
+    expect(vm.paymentMethod?.shortName).toEqual(undefined);
+  });
+
+  it("should return undefined if shipping method does not exists", async () => {
+    const { vm, injections } = useSetup(() => useOrderDetails("123-test"));
+    injections.apiClient.invoke.mockResolvedValue({
+      data: {
+        orders: {
+          elements: [
+            {
+              deliveries: [],
+            },
+          ],
+        },
+      },
+    });
+    await vm.loadOrderDetails();
+    expect(vm.shippingMethod?.name).toEqual(undefined);
+  });
 });

src/useOrderDetails/useOrderDetails.ts

@@ -53,7 +53,7 @@ import { defu } from "defu";
   /**
-   * Selected shipping method
+   * Returns current selected shipping method for the order. Last element in delivery array.
    */
   shippingMethod: ComputedRef<Schemas["ShippingMethod"] | undefined | null>;
   /**
-   * Selected payment method
+   * Returns current selected payment method for the order. Last element in transactions array.
    */
@@ -143,8 +143,17 @@ paymentMethod: ComputedRef<Schemas["PaymentMethod"] | undefined | null>;
 
-  const paymentMethod = computed(
-    () => _sharedOrder.value?.transactions?.[0]?.paymentMethod,
+  const paymentMethod = computed(() =>
+    _sharedOrder.value?.transactions?.length
+      ? _sharedOrder.value.transactions[
+          _sharedOrder.value.transactions.length - 1
+        ].paymentMethod
+      : undefined,
   );
-  const shippingMethod = computed(
-    () => _sharedOrder.value?.deliveries?.[0]?.shippingMethod,
+
+  const shippingMethod = computed(() =>
+    _sharedOrder.value?.deliveries?.length
+      ? _sharedOrder.value.deliveries[_sharedOrder.value.deliveries.length - 1]
+          .shippingMethod
+      : undefined,
   );
+
   const paymentUrl = ref();
@@ -151,0 +160,0 @@

No alert changes

Improved metrics

Total package byte prevSize

762114

increased by0.72%

Lines of code

21247

increased by0.77%

Worsened metrics

Number of lines in readme file

182

decreased by-2.67%

No dependency changes