@scayle/storefront-nuxt 7.44.0 → 7.45.0

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @scayle/storefront-nuxt
 
+## 7.45.0
+
+### Minor Changes
+
+- Migrate currency formatters to a composable
+
+  Because the currency formatter functions depend on the `useCurrentShop` composable, they must also be initialized through a composable. Additionally, because `formatPrice` was the same as `toCurrency` except that it excluded the symbol, the two functions have been merged into `formatCurrency`. If you don't want the currency symbol to be displayed, set the `style` option to `decimal`. These changes requires a small migration step.
+
+  Before:
+
+  ```typescript
+  toCurrency(100, { currency: 'EUR' })
+  formatPrice(100, { currencyFractionDigits: 2 })
+  ```
+
+  After:
+
+  ```typescript
+  const { formatCurrency } = useFormatHelpers()
+  formatCurrency(100, { currency: 'EUR' })
+  formatCurrency(100, { style: 'decimal', currencyFractionDigits: 2 })
+  ```
+
+## 7.44.1
+
+### Patch Changes
+
+- The api/up route should not be bootstrapped with the context
+
 ## 7.44.0
 
 ### Minor Changes

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.7.0"
   },
-  "version": "7.43.1"
+  "version": "7.44.1"
 }

package/dist/runtime/composables/core/useFormatHelpers.d.ts

@@ -0,0 +1,14 @@
+type FormatCurrencyOptions = {
+    locale: string;
+    currencyFractionDigits?: number;
+    style?: 'currency';
+    currency: string;
+} | {
+    locale: string;
+    currencyFractionDigits?: number;
+    style: 'decimal';
+};
+export default function useFormatHelpers(): {
+    formatCurrency: (value: number, options?: FormatCurrencyOptions) => string;
+};
+export {};

package/dist/runtime/composables/core/useFormatHelpers.mjs

@@ -0,0 +1,27 @@
+import { getDefaultFractionDigits } from "@scayle/storefront-core";
+import { useCurrentShop } from "./useCurrentShop.mjs";
+export default function useFormatHelpers() {
+  const currentShop = useCurrentShop();
+  const formatCurrency = (value, options) => {
+    const {
+      locale = currentShop.value.locale,
+      currencyFractionDigits = currentShop.value.currencyFractionDigits
+    } = options || {};
+    const currency = options?.style !== "decimal" ? options?.currency ?? currentShop.value.currency : void 0;
+    const minimumFractionDigits = options?.style !== "decimal" ? getDefaultFractionDigits(
+      locale,
+      options?.currency ?? currentShop.value.currency
+    ) : currencyFractionDigits;
+    return (value / 100).toLocaleString(locale, {
+      style: options?.style ?? "currency",
+      ...currencyFractionDigits && {
+        minimumFractionDigits: minimumFractionDigits !== void 0 ? Math.min(minimumFractionDigits, currencyFractionDigits) : currencyFractionDigits
+      },
+      maximumFractionDigits: currencyFractionDigits,
+      currency
+    });
+  };
+  return {
+    formatCurrency
+  };
+}

package/dist/runtime/server/middleware/bootstrap.mjs

@@ -125,11 +125,11 @@ export default defineEventHandler(async (event) => {
     }
     const config = useRuntimeConfig();
     const $storefrontConfig = config.storefront;
-    const $shopConfig = getShopConfig(event, config);
-    const apiBasePath = ($storefrontConfig.shopSelector === "path" && $shopConfig.path ? `/${$shopConfig.path}` : "") + ($shopConfig.apiBasePath || $storefrontConfig.apiBasePath || "/api");
-    if (url.pathname === `${apiBasePath}/up`) {
+    if (url.pathname === `${$storefrontConfig.apiBasePath ?? "/api"}/up`) {
       return;
     }
+    const $shopConfig = getShopConfig(event, config);
+    const apiBasePath = ($storefrontConfig.shopSelector === "path" && $shopConfig.path ? `/${$shopConfig.path}` : "") + ($shopConfig.apiBasePath || $storefrontConfig.apiBasePath || "/api");
     const log = createLog(
       createConsola,
       $storefrontConfig.log.name,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@scayle/storefront-nuxt",
   "type": "module",
-  "version": "7.44.0",
+  "version": "7.45.0",
   "description": "Nuxt integration for the SCAYLE Commerce Engine and Storefront API",
   "author": "SCAYLE Commerce Engine",
   "license": "MIT",
@@ -85,8 +85,8 @@
     "@nuxt/test-utils": "3.8.1",
     "@scayle/eslint-config-storefront": "3.2.6",
     "@scayle/prettier-config-storefront": "2.0.2",
-    "@types/node": "20.10.4",
-    "eslint": "8.55.0",
+    "@types/node": "20.10.5",
+    "eslint": "8.56.0",
     "eslint-formatter-gitlab": "5.1.0",
     "node-mocks-http": "1.14.0",
     "nuxt": "3.8.2",

package/dist/runtime/server/middleware/bootstrap.test.d.ts

@@ -1,6 +0,0 @@
-declare module '../../../module' {
-    interface AdditionalShopConfig {
-        paymentProviders: string[];
-    }
-}
-export {};

package/dist/runtime/server/middleware/bootstrap.test.mjs

@@ -1,277 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { createRequest, createResponse } from "node-mocks-http";
-import { createEvent } from "h3";
-import { getCurrentShopForRequest, getPublicShopData } from "./bootstrap.utils.mjs";
-const DOMAIN_DE = "de.scayle.example";
-const DOMAIN_AT = "at.scayle.example";
-const DOMAIN_US = "us.scayle.example";
-const CHECKOUT_HOST = "https://checkout.scayle.cloud";
-const baseShop = {
-  appKeys: {
-    wishlistKey: "wishlist_{shopId}_{userId}",
-    basketKey: "basket_{shopId}_{userId}",
-    hashAlgorithm: "sha256"
-  },
-  auth: {
-    resetPasswordUrl: ""
-  },
-  domain: "demo.test",
-  paymentProviders: [],
-  checkout: {
-    host: CHECKOUT_HOST,
-    token: "",
-    secret: "",
-    user: ""
-  }
-};
-describe("getCurrentShopForRequest", () => {
-  it("respects the x-shop-id header", () => {
-    const req = createRequest({
-      url: "/api/getProducts",
-      headers: {
-        "x-shop-id": "1002"
-      }
-    });
-    const moduleOptions = {
-      shopSelector: "domain",
-      stores: {
-        DE_DE: {
-          ...baseShop,
-          shopId: 1001,
-          domain: DOMAIN_DE,
-          locale: "de-DE",
-          currency: "EUR"
-        },
-        DE_AT: {
-          ...baseShop,
-          shopId: 1002,
-          domain: DOMAIN_AT,
-          locale: "de-AT",
-          currency: "EUR"
-        },
-        DE_US: {
-          ...baseShop,
-          shopId: 1003,
-          domain: DOMAIN_US,
-          locale: "en-US",
-          currency: "USD"
-        }
-      }
-    };
-    const shop = getCurrentShopForRequest(
-      createEvent(req, createResponse()),
-      moduleOptions
-    );
-    expect(shop.shopId).to.eq(1002);
-  });
-  it("falls back to the path when shopSelector = path", () => {
-    const moduleOptions = {
-      shopSelector: "path",
-      stores: {
-        DE_DE: {
-          ...baseShop,
-          shopId: 1001,
-          path: "de",
-          locale: "de-DE",
-          currency: "EUR"
-        },
-        DE_AT: {
-          ...baseShop,
-          shopId: 1002,
-          path: "at",
-          locale: "de-AT",
-          currency: "EUR"
-        },
-        EN_US: {
-          ...baseShop,
-          shopId: 1003,
-          path: "foobar",
-          locale: "en-US",
-          currency: "USD"
-        },
-        DE_CH: {
-          ...baseShop,
-          shopId: 1004,
-          path: "de-ch",
-          locale: "de-CH",
-          currency: "CHF"
-        }
-      }
-    };
-    expect(
-      getCurrentShopForRequest(
-        createEvent(
-          createRequest({
-            url: "https://de.scayle.example/foobar/men/shirts"
-          }),
-          createResponse()
-        ),
-        moduleOptions
-      ).shopId
-    ).to.eq(1003);
-    expect(
-      getCurrentShopForRequest(
-        createEvent(
-          createRequest({
-            url: "/foobar/men/shirts"
-          }),
-          createResponse()
-        ),
-        moduleOptions
-      ).shopId
-    ).to.eq(1003);
-    expect(
-      getCurrentShopForRequest(
-        createEvent(
-          createRequest({
-            url: "https://de.scayle.example/at/men/shirts"
-          }),
-          createResponse()
-        ),
-        moduleOptions
-      ).shopId
-    ).to.eq(1002);
-    expect(
-      getCurrentShopForRequest(
-        createEvent(
-          createRequest({
-            url: "https://de.scayle.example/de-ch/men/shirts"
-          }),
-          createResponse()
-        ),
-        moduleOptions
-      ).shopId
-    ).to.eq(1004);
-  });
-  it("falls back to the domain when shopSelector = domain", () => {
-    const req = createRequest({
-      url: "https://de.scayle.example/at/frauen"
-    });
-    const moduleOptions = {
-      shopSelector: "domain",
-      stores: {
-        DE_DE: {
-          ...baseShop,
-          shopId: 1001,
-          domain: DOMAIN_DE,
-          locale: "de-DE",
-          currency: "EUR"
-        },
-        DE_AT: {
-          ...baseShop,
-          shopId: 1002,
-          domain: DOMAIN_AT,
-          locale: "de-AT",
-          currency: "EUR"
-        },
-        EN_US: {
-          ...baseShop,
-          shopId: 1003,
-          domain: DOMAIN_US,
-          locale: "en-US",
-          currency: "USD"
-        }
-      }
-    };
-    const shop = getCurrentShopForRequest(
-      createEvent(req, createResponse()),
-      moduleOptions
-    );
-    expect(shop.shopId).to.eq(1001);
-  });
-  it("falls back to the first shop when there is no match", () => {
-    const req = createRequest({
-      url: "https://de.scayle.example/foobar/men/shirts",
-      headers: {
-        "x-shop-id": "1005"
-      }
-    });
-    const moduleOptions = {
-      shopSelector: "domain",
-      stores: {
-        DE_DE: {
-          ...baseShop,
-          shopId: 1001,
-          domain: DOMAIN_DE,
-          locale: "de-DE",
-          currency: "EUR"
-        },
-        DE_AT: {
-          ...baseShop,
-          shopId: 1002,
-          domain: DOMAIN_AT,
-          locale: "de-AT",
-          currency: "EUR"
-        },
-        EN_US: {
-          ...baseShop,
-          shopId: 1003,
-          domain: DOMAIN_US,
-          locale: "en-US",
-          currency: "USD"
-        }
-      }
-    };
-    const shop = getCurrentShopForRequest(
-      createEvent(req, createResponse()),
-      moduleOptions
-    );
-    expect(shop.shopId).to.eq(1001);
-  });
-});
-describe("getPublicShopData", () => {
-  it("excludes checkout secrets from the public shop data", () => {
-    const shopConfig = {
-      ...baseShop,
-      shopId: 1003,
-      domain: DOMAIN_US,
-      path: "en",
-      locale: "en-US",
-      currency: "USD"
-    };
-    expect(getPublicShopData(shopConfig, 1003, "/api")).to.eql({
-      shopId: 1003,
-      domain: DOMAIN_US,
-      path: "en",
-      locale: "en-US",
-      currency: "USD",
-      isActive: true,
-      checkout: {
-        host: CHECKOUT_HOST
-      },
-      apiBasePath: "/api"
-    });
-  });
-  it("includes additional shop data for keys in storefront.publicShopData", () => {
-    const shopConfig = {
-      ...baseShop,
-      shopId: 1003,
-      domain: DOMAIN_US,
-      path: "en",
-      locale: "en-US",
-      currency: "USD",
-      paymentProviders: ["visa", "klarna"],
-      checkout: {
-        host: CHECKOUT_HOST,
-        token: "",
-        secret: "",
-        user: ""
-      }
-    };
-    expect(
-      getPublicShopData(shopConfig, 1003, "/api", ["paymentProviders"])
-    ).to.eql({
-      shopId: 1003,
-      domain: DOMAIN_US,
-      path: "en",
-      locale: "en-US",
-      currency: "USD",
-      paymentProviders: ["visa", "klarna"],
-      isActive: true,
-      checkout: {
-        host: CHECKOUT_HOST
-      },
-      apiBasePath: "/api"
-    });
-  });
-});

package/dist/runtime/server/middleware/redirects.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/runtime/server/middleware/redirects.test.mjs

@@ -1,66 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { getRedirectLookupUrls, getTargetLocation } from "./redirects.utils.mjs";
-describe("redirects module", () => {
-  describe("getRedirectLookupUrls", () => {
-    it("returns the relative and absolute URL", () => {
-      expect(
-        getRedirectLookupUrls(
-          new URL("https://demo.example/de/frauen/kleidung"),
-          /* @__PURE__ */ new Set()
-        )
-      ).to.eql({
-        relativeSourceUrl: "/de/frauen/kleidung",
-        absoluteSourceUrl: "https://demo.example/de/frauen/kleidung"
-      });
-    });
-    it("strips trailing slashes", () => {
-      expect(
-        getRedirectLookupUrls(new URL("https://demo.example/men/"), /* @__PURE__ */ new Set())
-      ).to.eql({
-        relativeSourceUrl: "/men",
-        absoluteSourceUrl: "https://demo.example/men"
-      });
-    });
-    it("strips query params", () => {
-      expect(
-        getRedirectLookupUrls(
-          new URL("https://demo.example/products?p=20&term=foo"),
-          /* @__PURE__ */ new Set()
-        )
-      ).to.eql({
-        relativeSourceUrl: "/products",
-        absoluteSourceUrl: "https://demo.example/products"
-      });
-    });
-    it("does not strip whitelisted query params", () => {
-      expect(
-        getRedirectLookupUrls(
-          new URL("https://demo.example/test/page/?foo=1&bar=10"),
-          /* @__PURE__ */ new Set(["bar"])
-        )
-      ).to.eql({
-        relativeSourceUrl: "/test/page?bar=10",
-        absoluteSourceUrl: "https://demo.example/test/page?bar=10"
-      });
-    });
-  });
-  describe("getTargetLocation", () => {
-    it("uses the source as the base for relative URLs", () => {
-      expect(
-        getTargetLocation(
-          new URL("http://demo.test/source/location"),
-          "/target"
-        )
-      ).to.eq("http://demo.test/target");
-    });
-    it("copies non-whitelisted query params from source", () => {
-      expect(
-        getTargetLocation(
-          new URL("http://demo.test/source?foo=10&bar=20"),
-          "/redirect",
-          /* @__PURE__ */ new Set(["foo"])
-        )
-      ).to.eq("http://demo.test/redirect?bar=20");
-    });
-  });
-});

package/dist/runtime/utils/price.d.ts

@@ -1,11 +0,0 @@
-type BaseOptions = {
-    locale: string;
-    currencyFractionDigits?: number;
-};
-type FormatOptions = BaseOptions;
-type ToCurrencyOptions = BaseOptions & {
-    currency: string;
-};
-export declare const toCurrency: (value: number, options?: ToCurrencyOptions) => string;
-export declare const formatPrice: (value: number, formatOptions?: FormatOptions) => string;
-export {};

package/dist/runtime/utils/price.mjs

@@ -1,32 +0,0 @@
-import { getDefaultFractionDigits } from "@scayle/storefront-core";
-import { useCurrentShop } from "../composables/core/useCurrentShop.mjs";
-export const toCurrency = (value, options) => {
-  const currentShop = useCurrentShop();
-  const {
-    locale = currentShop.value.locale,
-    currency = currentShop.value.currency,
-    currencyFractionDigits = currentShop.value.currencyFractionDigits
-  } = options || {};
-  const minimumFractionDigits = getDefaultFractionDigits(locale, currency);
-  return (value / 100).toLocaleString(locale, {
-    style: "currency",
-    ...currencyFractionDigits && {
-      minimumFractionDigits: Math.min(
-        minimumFractionDigits,
-        currencyFractionDigits
-      )
-    },
-    maximumFractionDigits: currencyFractionDigits,
-    currency
-  });
-};
-export const formatPrice = (value, formatOptions) => {
-  const currentShop = useCurrentShop();
-  const {
-    locale = currentShop.value.locale,
-    currencyFractionDigits = currentShop.value.currencyFractionDigits
-  } = formatOptions || {};
-  return (value / 100).toLocaleString(locale, {
-    minimumFractionDigits: currencyFractionDigits
-  });
-};

package/dist/runtime/utils/price.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/runtime/utils/price.test.mjs

@@ -1,83 +0,0 @@
-import { describe, it, expect, vi } from "vitest";
-import { ref } from "vue";
-import { toCurrency, formatPrice } from "./price.mjs";
-describe("Price utils", () => {
-  vi.mock("../composables/core/useCurrentShop", () => ({
-    useCurrentShop: () => ref({
-      locale: "de-DE",
-      currency: "EUR",
-      currencyFractionDigits: 2
-    })
-  }));
-  describe("toCurrency", () => {
-    it("should return value with EUR currency", () => {
-      const options = {
-        locale: "de-DE",
-        currency: "EUR",
-        currencyFractionDigits: 2
-      };
-      const currency = toCurrency(200, options);
-      expect(currency).be.eq("2,00\xA0\u20AC");
-    });
-    it("should return value with EUR currency with default options", () => {
-      const currency = toCurrency(200);
-      expect(currency).be.eq("2,00\xA0\u20AC");
-    });
-    it("should return value with EUR currency with default options", () => {
-      const currency = toCurrency(200);
-      expect(currency).be.eq("2,00\xA0\u20AC");
-    });
-    it("should return value with USD currency", () => {
-      const options = {
-        locale: "de-DE",
-        currency: "USD",
-        currencyFractionDigits: 2
-      };
-      const currency = toCurrency(200, options);
-      expect(currency).be.eq("2,00\xA0$");
-    });
-    it("should return value with one fraction digit", () => {
-      const options = {
-        locale: "de-DE",
-        currency: "USD",
-        currencyFractionDigits: 1
-      };
-      const currency = toCurrency(200, options);
-      expect(currency).be.eq("2,0\xA0$");
-    });
-    it("should return value with two fraction digits if no fraction digits set", () => {
-      const options = {
-        locale: "de-DE",
-        currency: "USD"
-      };
-      const currency = toCurrency(200, options);
-      expect(currency).be.eq("2,00\xA0$");
-    });
-    it("should return value properly formatted for en-US locale", () => {
-      const options = {
-        locale: "en-US",
-        currency: "USD"
-      };
-      const currency = toCurrency(200, options);
-      expect(currency).be.eq("$2.00");
-    });
-  });
-  describe("formatPrice", () => {
-    it("should return formatted price with two fraction digits", () => {
-      const options = {
-        locale: "en-US",
-        currencyFractionDigits: 2
-      };
-      const price = formatPrice(200, options);
-      expect(price).be.eq("2.00");
-    });
-    it("should return formatted price with one fraction digits", () => {
-      const options = {
-        locale: "en-US",
-        currencyFractionDigits: 1
-      };
-      const price = formatPrice(200, options);
-      expect(price).be.eq("2.0");
-    });
-  });
-});

package/dist/runtime/utils/route.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/runtime/utils/route.test.mjs

@@ -1,15 +0,0 @@
-import { describe, it, expect } from "vitest";
-import { getCurrentPage } from "./route.mjs";
-describe("getCurrentPage", () => {
-  it("should return parsed current page", () => {
-    const page = getCurrentPage({ page: "20" });
-    expect(page).be.equal(20);
-  });
-  it("should return undefined if page does not exist inside the query", () => {
-    const page = getCurrentPage({});
-    expect(page).be.equal(void 0);
-  });
-  it("should return undefined if page is not a string", () => {
-    expect(getCurrentPage({ page: ["1", "2"] })).toBe(void 0);
-  });
-});