@scayle/storefront-nuxt 7.64.0 → 7.65.0

package/CHANGELOG.md

@@ -1,5 +1,34 @@
 # @scayle/storefront-nuxt
 
+## 7.65.0
+
+### Minor Changes
+
+- Add OpenTelemetry instrumentation to RPC methods
+
+  This release adds the beginning of native instrumentation to the `@scayle/storefront-nuxt` package.
+
+  If you are using the OpenTelemetry SDK in your application, a `Span` will now be created for calls to RPC methods. The `Span` will be named `storefront-nuxt.rpc/[method]` and have the following attributes:
+
+  - `rpc.method` the method name
+  - `rpc.server` `'storefront-nuxt.rpc'`
+  - `rpc.payload` the payload passed to the RPC
+  - `server.address` the hostname of the server
+  - `server.port` the port of the server
+
+  Additionally, the `Span`'s status will be set to `ERROR` or `OK` depending on the result of the RPC call.
+
+  If you are not using the `@opentelemetry/sdk` in your application, this change will have no impact. A reference implementation of the OpenTelemetry SDK will be included in a future Storefront Boilerplate release.
+
+## 7.64.1
+
+### Patch Changes
+
+- Format code with dprint
+- Updated dependencies
+  - @scayle/unstorage-compression-driver@0.1.3
+  - @scayle/h3-session@0.3.6
+
 ## 7.64.0
 
 ### Minor Changes
@@ -14,8 +43,8 @@
 
   ```ts
   const { data: externalIDPRedirects } = await useIDP({
-    queryParams: { redirectTo: '/account' },
-  })
+    queryParams: { redirectTo: "/account" },
+  });
   ```
 
   Please note that `code` and `state` are not supported as these are used by the SCAYLE Authentication API.
@@ -434,16 +463,16 @@ There is an `unwrap` function exported by this package (>=7.55.0) that can be us
   Before:
 
   ```typescript
-  toCurrency(100, { currency: 'EUR' })
-  formatPrice(100, { currencyFractionDigits: 2 })
+  toCurrency(100, { currency: "EUR" });
+  formatPrice(100, { currencyFractionDigits: 2 });
   ```
 
   After:
 
   ```typescript
-  const { formatCurrency } = useFormatHelpers()
-  formatCurrency(100, { currency: 'EUR' })
-  formatCurrency(100, { style: 'decimal', currencyFractionDigits: 2 })
+  const { formatCurrency } = useFormatHelpers();
+  formatCurrency(100, { currency: "EUR" });
+  formatCurrency(100, { style: "decimal", currencyFractionDigits: 2 });
   ```
 
 ## 7.44.1

package/dist/module.json

@@ -1,8 +1,8 @@
 {
   "name": "@scayle/storefront-nuxt",
+  "version": "7.64.1",
   "configKey": "storefront",
   "compatibility": {
     "nuxt": "^3.9.0"
-  },
-  "version": "7.63.0"
+  }
 }

package/dist/module.mjs

@@ -40,9 +40,11 @@ export default {
 }`;
 }
 const PACKAGE_NAME = "@scayle/storefront-nuxt";
+const PACKAGE_VERSION = "7.64.1";
 const module = defineNuxtModule({
   meta: {
     name: PACKAGE_NAME,
+    version: PACKAGE_VERSION,
     configKey: "storefront",
     compatibility: {
       nuxt: "^3.9.0"
@@ -207,6 +209,7 @@ const module = defineNuxtModule({
       nitroConfig.replace["process.env.SFC_OMIT_MD5"] = yn(
         process.env.SFC_OMIT_MD5
       );
+      nitroConfig.replace.__sfc_version = PACKAGE_VERSION;
       nitroConfig.virtual = {
         ...nitroConfig.virtual,
         "#virtual/storage-drivers": createVirtualDriverImport(
@@ -214,6 +217,21 @@ const module = defineNuxtModule({
         )
       };
     });
+    nuxt.hooks.hook("nitro:init", (nitro) => {
+      nitro.hooks.hook("rollup:before", (_nitro, rollupConfig) => {
+        const existingHandler = rollupConfig.onwarn;
+        rollupConfig.onwarn = (warning, handler) => {
+          if (warning.code === "THIS_IS_UNDEFINED" && warning.loc?.file?.includes("@opentelemetry")) {
+            return;
+          }
+          if (existingHandler) {
+            existingHandler(warning, handler);
+          } else {
+            handler(warning);
+          }
+        };
+      });
+    });
     nuxt.options.alias["#rpcMethods"] = appResolve(
       options.rpcDir ?? "./rpcMethods"
     );

package/dist/runtime/api/rpcHandler.d.ts

@@ -1,41 +1,2 @@
-declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<boolean | void | string[] | import("@scayle/storefront-core").ShopUser | import("@scayle/storefront-core").Product | import("@scayle/storefront-core").BasketResponseData<import("@scayle/storefront-core").Product, import("@scayle/storefront-core").Variant> | {
-    type: "failure";
-    statusCode: number;
-    basket: import("@scayle/storefront-core").BasketResponseData<import("@scayle/storefront-core").Product, import("@scayle/storefront-core").Variant>;
-} | {
-    readonly type: "success";
-    readonly basket: import("@scayle/storefront-core").BasketResponseData<import("@scayle/storefront-core").Product, import("@scayle/storefront-core").Variant>;
-} | {
-    readonly type: "failure";
-    readonly basket: import("@scayle/storefront-core").BasketResponseData<import("@scayle/storefront-core").Product, import("@scayle/storefront-core").Variant>;
-    readonly errors: import("@aboutyou/backbone/helpers/BapiClient").AddOrUpdateItemError[];
-} | import("@scayle/storefront-core").BrandsEndpointResponseData | import("@scayle/storefront-core").Brand | {
-    categories: import("@scayle/storefront-core").Category[];
-    activeNode: undefined;
-} | import("@scayle/storefront-core").Category | {
-    categories: import("@scayle/storefront-core").Category;
-    activeNode: import("@scayle/storefront-core").Category;
-} | import("@scayle/storefront-core").Order | import("@scayle/storefront-core").Product[] | {
-    products: import("@scayle/storefront-core").Product[];
-    pagination: import("@aboutyou/backbone/endpoints/products/productsByIds").Pagination;
-} | {
-    filters: import("@aboutyou/backbone").FiltersEndpointResponseData;
-    unfilteredCount: number;
-} | {
-    count: number;
-} | import("@scayle/storefront-core").TypeaheadSuggestionsEndpointResponseData | import("@scayle/storefront-core").SearchV2SuggestionsEndpointResponseData | import("@scayle/storefront-core").SearchEntity | import("@aboutyou/backbone/endpoints/shopconfiguration/shopconfiguration").ShopConfigurationResponseData | {
-    user: import("@scayle/storefront-core").ShopUser | undefined;
-} | import("@scayle/storefront-core").WishlistResponseData | Response | import("@scayle/storefront-core").ShopUserAddress[] | import("@aboutyou/backbone/endpoints/variants/variantsByIds").VariantDetail[] | import("@aboutyou/backbone").NavigationAllEndpointResponseData | import("@scayle/storefront-core").NavigationTree | {
-    success: true;
-} | {
-    success: false;
-} | {
-    result: true;
-} | {
-    result: false;
-} | import("@scayle/storefront-core").PromotionsResponseData | {
-    [k: string]: string;
-} | {
-    message: string;
-} | null>>;
+declare const _default: import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<any>>;
 export default _default;

package/dist/runtime/api/rpcHandler.mjs

@@ -1,21 +1,57 @@
-import { defineEventHandler, readBody, createError } from "h3";
+import { defineEventHandler, readBody, createError, getRequestURL } from "h3";
 import { purifySensitiveData } from "@scayle/storefront-core";
+import { trace, SpanStatusCode } from "@opentelemetry/api";
 import { handler } from "../handler.mjs";
 import { resolveError } from "../error/handler.mjs";
+const tracer = trace.getTracer(
+  "storefront-nuxt",
+  "__sfc_version"
+);
 export default defineEventHandler(async (event) => {
   const pathComponents = event.path.split("?")[0].split("/");
   const method = pathComponents[pathComponents.length - 1];
   const body = await readBody(event);
+  const url = getRequestURL(event, {
+    xForwardedHost: true,
+    xForwardedProto: true
+  });
   const payloadToBeLogged = JSON.stringify(
     purifySensitiveData(
       typeof body?.payload !== "object" ? { [typeof body?.payload]: body?.payload } : body?.payload
     )
   );
   event.context.$rpcContext.log.space("sfc").debug(`RPC Handler: ${method}, Payload: ${payloadToBeLogged}`);
-  try {
-    return await handler(method, body?.payload, event.context.$rpcContext);
-  } catch (e) {
-    event.context.$rpcContext.log.space("sfc").error(`RPC Handler failed: ${method}`, e);
-    return createError(resolveError(e));
-  }
+  return await tracer.startActiveSpan(
+    `storefront-nuxt.rpc/${method}`,
+    {
+      attributes: {
+        // https://opentelemetry.io/docs/specs/semconv/rpc/rpc-spans/#common-attributes
+        "rpc.method": method,
+        "rpc.service": "storefront-nuxt.rpc",
+        "rpc.payload": payloadToBeLogged,
+        "server.address": url.hostname,
+        "server.port": url.port
+      }
+    },
+    async (span) => {
+      let result;
+      try {
+        result = await handler(method, body?.payload, event.context.$rpcContext);
+        if (result instanceof Response && !result.ok) {
+          span.setStatus({ code: SpanStatusCode.ERROR });
+        } else {
+          span.setStatus({ code: SpanStatusCode.OK });
+        }
+      } catch (e) {
+        event.context.$rpcContext.log.space("sfc").error(`RPC Handler failed: ${method}`, e);
+        result = createError(resolveError(e));
+        if (e instanceof Error) {
+          span.recordException(e);
+        }
+        span.setStatus({ code: SpanStatusCode.ERROR });
+      }
+      span.end();
+      return result;
+    }
+  );
 });

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@scayle/storefront-nuxt",
   "type": "module",
-  "version": "7.64.0",
+  "version": "7.65.0",
   "description": "Nuxt integration for the SCAYLE Commerce Engine and Storefront API",
   "author": "SCAYLE Commerce Engine",
   "license": "MIT",
@@ -49,8 +49,8 @@
     "dev": "nuxi dev playground",
     "dev:build": "nuxi build playground",
     "prep": "nuxi prepare playground",
-    "format": "prettier --ignore-unknown --log-level warn --check .",
-    "format:fix": "prettier --ignore-unknown --log-level warn --write .",
+    "format": "dprint check",
+    "format:fix": "dprint fmt",
     "lint": "eslint . --format gitlab",
     "lint:fix": "eslint . --fix",
     "typecheck": "vue-tsc --noEmit -p tsconfig.check.json",
@@ -61,9 +61,10 @@
   },
   "dependencies": {
     "@nuxt/kit": "3.11.1",
-    "@scayle/h3-session": "0.3.5",
+    "@opentelemetry/api": "1.8.0",
+    "@scayle/h3-session": "0.3.6",
     "@scayle/storefront-core": "7.48.0",
-    "@scayle/unstorage-compression-driver": "0.1.2",
+    "@scayle/unstorage-compression-driver": "0.1.3",
     "@vueuse/core": "10.9.0",
     "consola": "3.2.3",
     "core-js": "3.36.1",
@@ -82,19 +83,18 @@
     "@nuxt/module-builder": "0.5.5",
     "@nuxt/schema": "3.11.1",
     "@nuxt/test-utils": "3.12.0",
-    "@scayle/eslint-config-storefront": "3.2.6",
+    "@scayle/eslint-config-storefront": "3.2.7",
     "@scayle/eslint-plugin-vue-composable": "0.1.1",
-    "@scayle/prettier-config-storefront": "2.0.2",
-    "@types/node": "20.12.5",
+    "@types/node": "20.12.7",
+    "dprint": "0.45.1",
     "eslint": "8.57.0",
     "eslint-formatter-gitlab": "5.1.0",
     "h3": "1.11.1",
     "node-mocks-http": "1.14.1",
     "nuxt": "3.11.1",
-    "prettier": "3.0.0",
     "publint": "0.2.7",
     "vitest": "1.4.0",
-    "vue-tsc": "2.0.11"
+    "vue-tsc": "2.0.12"
   },
   "peerDependencies": {
     "h3": "^1.10.0",