@scayle/storefront-nuxt 8.60.1 → 8.61.0

package/CHANGELOG.md

@@ -1,5 +1,64 @@
 # @scayle/storefront-nuxt
 
+## 8.61.0
+
+### Minor Changes
+
+- **[RPC]** Added HTTP method support so read-only RPCs can use `GET` and unlock CDN and browser caching for public data — no changes needed for existing handlers.
+
+  Pass `{ method }` as the second argument to `defineRpcHandler`. Omit it to keep the default `POST`.
+
+  ```ts
+  // Safe reads — eligible for CDN / browser caching
+  export const getNavigation = defineRpcHandler(handler, { method: "GET" });
+
+  // Mutations
+  export const updateBasketItem = defineRpcHandler(handler, { method: "PUT" });
+  export const deleteWishlistItem = defineRpcHandler(handler, {
+    method: "DELETE",
+  });
+  ```
+
+  RPCs returning user-specific data (basket, wishlist, tokens) should stay on `POST` to prevent unintended caching.
+
+### Patch Changes
+
+- Updated dependency `@scayle/unstorage-compression-driver@workspace:*` to `@scayle/unstorage-compression-driver@catalog:`
+
+**Dependencies**
+
+**@scayle/storefront-core v8.61.0**
+
+- Minor
+
+  - **[RPC]** `defineRpcHandler` now accepts an optional `method` option (`'GET' | 'POST' | 'PUT' | 'DELETE'`) to declare the HTTP method for the handler. Defaults to `'POST'`, so existing handlers behave exactly as before. Updated built-in RPC methods to use `GET` for safe, cacheable reads and `PUT`/`POST`/`DELETE` for mutations, enabling CDN and browser caching for public data fetches.
+
+  User- and session-specific RPCs (`getBasket`, `getUser`, `fetchUser`, `getWishlist`, `getAccessToken`, `getCheckoutToken`, `getOrderById`, `getCheckoutDataByCbd`, `getShopUserAddress`) intentionally stay on `POST` so their responses are never eligible for CDN or browser caching.
+
+  ```ts
+  import { defineRpcHandler, type RpcContext } from "@scayle/storefront-core";
+
+  // Safe, public read — eligible for CDN/browser caching
+  export const getNavigation = defineRpcHandler(
+    async (context: RpcContext) => {
+      /* ... */
+    },
+    { method: "GET" }
+  );
+
+  // User-specific / Mutation — uses POST to prevent cache leakage
+  export const getBasket = defineRpcHandler(
+    async (context: RpcContext) => {
+      /* ... */
+    }
+    // method defaults to 'POST'
+  );
+  ```
+
+- Patch
+  - Updated dependency `@scayle/storefront-api@workspace:*` to `@scayle/storefront-api@catalog:`
+  - Updated dependency `@scayle/unstorage-scayle-kv-driver@workspace:*` to `@scayle/unstorage-scayle-kv-driver@catalog:`
+
 ## 8.60.1
 
 ### Patch Changes
@@ -115,33 +174,33 @@
   **Migration:**
 
   ```ts
-  import baseSlugify from 'slugify'
+  import baseSlugify from "slugify";
 
   const slugify = (url: string | undefined): string => {
-    return baseSlugify(url ?? '', {
+    return baseSlugify(url ?? "", {
       lower: true,
       remove: /[*+~.()'"!:@/#?]/g,
-    })
-  }
+    });
+  };
 
-  const localePath = useLocalePath()
+  const localePath = useLocalePath();
 
   const getProductDetailRoute = (
     id: number,
     name?: string,
-    locale?: Locale,
+    locale?: Locale
   ): string => {
     return localePath(
       {
-        name: 'p-productName-id',
+        name: "p-productName-id",
         params: {
           productName: slugify(name),
           id: `${id}`,
         },
       },
-      locale,
-    )
-  }
+      locale
+    );
+  };
   ```
 
 ## 8.59.1
@@ -302,39 +361,39 @@
 
     ```ts
     // server/plugins/session-plugin.ts
-    import { hasSession } from '@scayle/storefront-nuxt'
-    import { defineNitroPlugin } from '#imports'
+    import { hasSession } from "@scayle/storefront-nuxt";
+    import { defineNitroPlugin } from "#imports";
 
     export default defineNitroPlugin((nitroApp) => {
-      nitroApp.hooks.hook('storefront:afterLogin', async (_data, context) => {
+      nitroApp.hooks.hook("storefront:afterLogin", async (_data, context) => {
         // Check if we actually have a RpcContext with proper session data
         if (!hasSession(context)) {
-          return
+          return;
         }
 
         // Should you have set custom session data already in another hook,
         // it might be necessary to get existing data first.
-        const sessionCustomData = context.sessionCustomData
+        const sessionCustomData = context.sessionCustomData;
 
         // The update functions overrides the customData object on a session.
         // Should you have set custom session data already in another hooks,
         // you need to pass it in addition to your new custom session data.
         context.updateSessionCustomData({
           ...sessionCustomData,
-          yourCustomDataKey: 'Your Session CustomData Value',
-        })
+          yourCustomDataKey: "Your Session CustomData Value",
+        });
 
         // Before accessing your session custom data, you might want to use an
         // explicit early return conditional.
         if (!sessionCustomData) {
-          return
+          return;
         }
 
         // Your custom session data can also be accessedd directly via
         // nullish coalescing  depending on your needs.
-        console.log(context.sessionCustomData?.yourCustomDataKey)
-      })
-    })
+        console.log(context.sessionCustomData?.yourCustomDataKey);
+      });
+    });
     ```
 
 ### Patch Changes
@@ -394,20 +453,20 @@
 
   ```ts
   // Before
-  const { data } = await useRpc('getProduct', 'my-static-product-key', {
+  const { data } = await useRpc("getProduct", "my-static-product-key", {
     productId: 123,
-  })
+  });
 
   // After
-  const productId = ref(123)
+  const productId = ref(123);
 
   // The key is now reactive. If `productId` changes, the key updates
   // to 'product-456' (for example) and triggers a new fetch.
   const { data } = await useRpc(
-    'getProduct',
+    "getProduct",
     () => `product-${productId.value}`,
-    { productId },
-  )
+    { productId }
+  );
   ```
 
 - Deprecated the `CheckoutEvent` type, which will be removed in the next major version.
@@ -419,22 +478,22 @@
   The type definition remains unchanged, so you can copy it directly:
 
   ```ts
-  import type { ShopUser } from '@scayle/storefront-nuxt'
+  import type { ShopUser } from "@scayle/storefront-nuxt";
 
   export interface CheckoutEvent {
     /** Action. */
-    action?: 'authenticated'
+    action?: "authenticated";
     /** Type. */
-    type?: 'tracking'
+    type?: "tracking";
     /** User. */
-    user: ShopUser
+    user: ShopUser;
     /**
      * The OAuth 2.0 access token for the authenticated user.
      * This token can be used to access protected resources on behalf of the user.
      *
      * @see https://www.rfc-editor.org/rfc/rfc6749
      */
-    accessToken: string
+    accessToken: string;
     /**
      * Details about a specific event within the checkout process.
      * This field is optional and is only used when tracking specific actions
@@ -444,25 +503,25 @@
      */
     event?: {
       /** Event name. */
-      event: 'login' | 'add_to_cart' | 'remove_from_cart'
+      event: "login" | "add_to_cart" | "remove_from_cart";
       /** Event status. */
-      status: 'successful' | 'error'
-    }
+      status: "successful" | "error";
+    };
   }
   ```
 
 - Updated the `StorefrontRuntimeConfig` type to ensure configured `shops` correctly incorporates all extended properties from `AdditionalShopConfig`.
 
   ```ts
-  declare module '@scayle/storefront-nuxt' {
+  declare module "@scayle/storefront-nuxt" {
     // Extend the shop config
     export interface AdditionalShopConfig {
-      extendedProp: string
+      extendedProp: string;
     }
   }
 
   // `extendedProp` is now properly typed
-  useRuntimeConfig().storefront.shops?.[shopId]?.extendedProp
+  useRuntimeConfig().storefront.shops?.[shopId]?.extendedProp;
   ```
 
 **Dependencies**
@@ -482,11 +541,11 @@
   ```ts
   // Before (or when `rpcDefaultLazy: false`)
   // You had to explicitly opt-in to lazy behavior
-  const { data } = useRpc('someMethod', { some: 'param' }, { lazy: true })
+  const { data } = useRpc("someMethod", { some: "param" }, { lazy: true });
 
   // After (when `rpcDefaultLazy: true`)
   // Lazy behavior is now the default
-  const { data } = useRpc('someMethod', { some: 'param' })
+  const { data } = useRpc("someMethod", { some: "param" });
   ```
 
 **Dependencies**
@@ -598,10 +657,10 @@
   Example:
 
   ```ts
-  import { sha256 } from '@scayle/storefront-core'
+  import { sha256 } from "@scayle/storefront-core";
 
-  const hash = await sha256('hello')
-  console.log(hash) // '2cf24dba5fb0a30e26e83b2ac5b9e29e1b161e5c1fa7425e73043362938b9824'
+  const hash = await sha256("hello");
+  console.log(hash); // '2cf24dba5fb0a30e26e83b2ac5b9e29e1b161e5c1fa7425e73043362938b9824'
   ```
 
 ## 8.48.1
@@ -681,8 +740,8 @@
         customer: {
           groups: context.user?.groups,
         },
-      }
-    })
+      };
+    });
   ```
 
   For further information, please refer to the [Overriding Core RPC Methods](https://scayle.dev/en/core-documentation/storefront-guide/storefront-application/technical-foundation/rpc-methods?sourceText=RPC%2520Methods#overriding-core-rpc-methods).
@@ -716,32 +775,32 @@
   #### Looking up by name (existing, now renamed):
 
   ```typescript
-  import { getAttributeValuesByName } from '@scayle/storefront-core'
+  import { getAttributeValuesByName } from "@scayle/storefront-core";
 
   // Single-select attribute
-  const sizes = getAttributeValuesByName(product.attributes, 'size')
+  const sizes = getAttributeValuesByName(product.attributes, "size");
   // Returns: [{ id: 1, label: 'M', value: 'medium' }]
 
   // Multi-select attribute
-  const colors = getAttributeValuesByName(product.attributes, 'color')
+  const colors = getAttributeValuesByName(product.attributes, "color");
   // Returns: [{ id: 1, label: 'Red' }, { id: 2, label: 'Blue' }]
 
   // Non-existent attribute
-  const missing = getAttributeValuesByName(product.attributes, 'doesNotExist')
+  const missing = getAttributeValuesByName(product.attributes, "doesNotExist");
   // Returns: []
   ```
 
   #### Looking up by group ID (new):
 
   ```typescript
-  import { getAttributeValuesByGroupId } from '@scayle/storefront-core'
+  import { getAttributeValuesByGroupId } from "@scayle/storefront-core";
 
   // Look up attribute by its numeric ID from the SCAYLE API
-  const promotionValues = getAttributeValuesByGroupId(product.attributes, 42)
+  const promotionValues = getAttributeValuesByGroupId(product.attributes, 42);
   // Returns: [{ id: 123, label: 'Summer Sale', value: 'summer-2024' }]
 
   // Non-existent attribute group
-  const missing = getAttributeValuesByGroupId(product.attributes, 9999)
+  const missing = getAttributeValuesByGroupId(product.attributes, 9999);
   // Returns: []
   ```
 
@@ -804,27 +863,27 @@
   // nuxt.config.ts
   export default defineNuxtConfig({
     storefront: {
-      apiBasePath: '/custom-api', // ✅ Configure globally for all shops
+      apiBasePath: "/custom-api", // ✅ Configure globally for all shops
     },
     runtimeConfig: {
       storefront: {
         shops: {
           1001: {
             shopId: 1001,
-            path: 'de',
+            path: "de",
             // ✅ apiBasePath removed from shop config
             // ... other shop config
           },
           1002: {
             shopId: 1002,
-            path: 'en',
+            path: "en",
             // ✅ apiBasePath removed from shop config
             // ... other shop config
           },
         },
       },
     },
-  })
+  });
   ```
 
   Additionally, the types for the Storefront module options and Storefront runtime configuration have been cleaned up to properly reflect which settings can be set at runtime and which cannot. This clarifies the distinction between configuration that is static (set at build/module level) and configuration that is dynamic (set at runtime), improving type safety and developer experience.
@@ -940,10 +999,10 @@
 
   ```ts
   const isComboDealType = (
-    promotion?: Promotion | null,
+    promotion?: Promotion | null
   ): promotion is Promotion<ComboDealEffect> => {
-    return promotion?.effect?.type === PromotionEffectType.COMBO_DEAL
-  }
+    return promotion?.effect?.type === PromotionEffectType.COMBO_DEAL;
+  };
   ```
 
 ## 8.42.2
@@ -1007,68 +1066,68 @@
   Before:
 
   ```ts
-  const updateBasketItemRpc = useRpcCall('updateBasketItem')
-  const addItemToBasketRpc = useRpcCall('addItemToBasket')
+  const updateBasketItemRpc = useRpcCall("updateBasketItem");
+  const addItemToBasketRpc = useRpcCall("addItemToBasket");
 
   updateBasketItemRpc({
     // ...
-    promotionId: 'promotionId',
-    promotionCode: 'promotionCode',
-  })
+    promotionId: "promotionId",
+    promotionCode: "promotionCode",
+  });
 
   addItemToBasketRpc({
     // ...
-    promotionId: 'promotionId',
-    promotionCode: 'promotionCode',
-  })
+    promotionId: "promotionId",
+    promotionCode: "promotionCode",
+  });
 
   // Or with useBasket composable
 
-  const { addItem } = useBasket()
+  const { addItem } = useBasket();
   addItem({
     // ...
-    promotionId: 'promotionId',
-  })
+    promotionId: "promotionId",
+  });
   ```
 
   After:
 
   ```ts
-  const updateBasketItemRpc = useRpcCall('updateBasketItem')
-  const addItemToBasketRpc = useRpcCall('addItemToBasket')
+  const updateBasketItemRpc = useRpcCall("updateBasketItem");
+  const addItemToBasketRpc = useRpcCall("addItemToBasket");
 
   updateBasketItemRpc({
     // ...
     promotions: [
-      { id: 'promotionId', code: 'promotionCode' },
+      { id: "promotionId", code: "promotionCode" },
       {
-        id: 'promotionId2',
+        id: "promotionId2",
       },
     ],
-  })
+  });
 
   addItemToBasketRpc({
     // ...
     promotions: [
-      { id: 'promotionId', code: 'promotionCode' },
+      { id: "promotionId", code: "promotionCode" },
       {
-        id: 'promotionId2',
+        id: "promotionId2",
       },
     ],
-  })
+  });
 
   // Or for useBasket with composable
 
-  const { addItem } = useBasket()
+  const { addItem } = useBasket();
   addItem({
     // ...
     promotions: [
-      { id: 'promotionId', code: 'promotionCode' },
+      { id: "promotionId", code: "promotionCode" },
       {
-        id: 'promotionId2',
+        id: "promotionId2",
       },
     ],
-  })
+  });
   ```
 
   For more details, see the [Add a variant](https://scayle.dev/en/api-guides/storefront-api/resources/baskets/add-a-variant) and [Update an item](https://scayle.dev/en/api-guides/storefront-api/resources/baskets/update-an-item) guides.
@@ -1473,23 +1532,23 @@
   - Added `minReduction` and `maxReduction` filter parameters to `FetchProductsByCategoryParams.where` and `FetchFiltersParams.where` types, and updated the `getProductsByCategory` and `getFilters` RPC methods to accept and handle these new reduction-based filtering conditions.
 
   ```ts
-  const { data } = useRpc('getFilters', 'getFiltersKey', () => ({
+  const { data } = useRpc("getFilters", "getFiltersKey", () => ({
     where: {
       minReduction: 10,
       maxReduction: 20,
     },
-  }))
+  }));
 
   const { data } = useRpc(
-    'getProductsByCategory',
-    'getProductsByCategoryKey',
+    "getProductsByCategory",
+    "getProductsByCategoryKey",
     () => ({
       where: {
         minReduction: 10,
         maxReduction: 20,
       },
-    }),
-  )
+    })
+  );
   ```
 
 ## 8.30.3
@@ -1541,28 +1600,28 @@
 
   ```ts
   export const existingHandlerWithoutParams = async (_context: RpcContext) => {
-    return 'existing handler'
-  }
+    return "existing handler";
+  };
 
   export const existingHandlerWithParams = async (
     { name }: { name: string },
-    _context: RpcContext,
+    _context: RpcContext
   ) => {
-    return name
-  }
+    return name;
+  };
 
   // will become
 
   export const existingHandlerWithoutParams = defineRpcHandler(
     async (_context: RpcContext) => {
-      return 'existing handler'
-    },
-  )
+      return "existing handler";
+    }
+  );
   export const existingHandlerWithParams = defineRpcHandler(
     async ({ name }: { name: string }, _context: RpcContext) => {
-      return name
-    },
-  )
+      return name;
+    }
+  );
   ```
 
 - Patch
@@ -1584,15 +1643,15 @@
   - Added an optional `hideEmptyCategories` parameter to `getCategoryTree`. When enabled, the product count for each category is retrieved, and categories (including their children) without any products are removed. Enabling this option may increase response times, especially for large category trees.
 
   ```ts
-  import { rpcMethods } from '@scayle/storefront-core'
+  import { rpcMethods } from "@scayle/storefront-core";
 
-  rpcMethods.getCategoryTree({ hideEmptyCategories: true }, rpcContext)
+  rpcMethods.getCategoryTree({ hideEmptyCategories: true }, rpcContext);
   ```
 
   or
 
   ```ts
-  import { useCategoryTree } from '#storefront/composables'
+  import { useCategoryTree } from "#storefront/composables";
 
   const { data: rootCategories, status } = useCategoryTree(
     {
@@ -1600,8 +1659,8 @@
         hideEmptyCategories: true,
       },
     },
-    'category-navigation-tree',
-  )
+    "category-navigation-tree"
+  );
   ```
 
 ## 8.28.7
@@ -1698,9 +1757,9 @@
     params: {
       children: 10,
       includeHidden: true,
-      properties: { withName: ['sale'] },
+      properties: { withName: ["sale"] },
     },
-  })
+  });
   ```
 
 ### Patch Changes
@@ -1871,16 +1930,16 @@
     nitro: {
       storage: {
         redis: {
-          driver: 'redis',
-          host: 'localhost',
+          driver: "redis",
+          host: "localhost",
         },
         db: {
-          driver: 'fs',
-          base: './.data/db',
+          driver: "fs",
+          base: "./.data/db",
         },
       },
     },
-  })
+  });
   ```
 
   With the introduction of the new approach for configuring storefront storage mounts, the global and shop-specific `storage` option within the `@scayle/storefront-nuxt` runtime configuration has been deprecated.
@@ -1953,9 +2012,9 @@
   ```typescript
   const idp = useIDP({
     authUrlParameters: {
-      theme: 'dark',
+      theme: "dark",
     },
-  })
+  });
   ```
 
 ### Patch Changes
@@ -2097,11 +2156,11 @@
       storefront: {
         redirects: {
           enabled: true,
-          strategy: 'on-missing',
+          strategy: "on-missing",
         },
       },
     },
-  })
+  });
   ```
 
   Also, keep in mind that when this option is enabled, the redirect logic will only be executed when the request would otherwise result in a 404. There are three ways in which a 404 can occur.
@@ -2115,7 +2174,7 @@
   If the request handler returns a `Response` object with a `status` of 404, a 404 response will be returned to the client.
 
   ```typescript
-  return new Response(null, { status: 404 })
+  return new Response(null, { status: 404 });
   ```
 
   3. Thrown H3Error with 404 status
@@ -2123,8 +2182,8 @@
   If the request handler throws an H3Error with a `statusCode` 404, a 404 response will be returned to the client.
 
   ```typescript
-  import { createError } from 'h3'
-  throw createError({ statusCode: 404 })
+  import { createError } from "h3";
+  throw createError({ statusCode: 404 });
   ```
 
 ### Patch Changes
@@ -2566,28 +2625,28 @@
   **rpc-methods.ts**
 
   ```typescript
-  import type { RpcContext, RpcHandler } from '@scayle/storefront-nuxt'
+  import type { RpcContext, RpcHandler } from "@scayle/storefront-nuxt";
 
   export const foo: RpcHandler<string, number> = function testing(
     param: string,
-    _: RpcContext,
+    _: RpcContext
   ) {
-    return param.length
-  }
+    return param.length;
+  };
   ```
 
   **module.ts**
 
   ```typescript
   function setup() {
-    const resolver = createResolver(import.meta.url)
+    const resolver = createResolver(import.meta.url);
 
-    nuxt.hook('storefront:custom-rpc:extend', (customRpcImports) => {
+    nuxt.hook("storefront:custom-rpc:extend", (customRpcImports) => {
       customRpcImports.push({
-        source: resolver.resolve('./rpc-methods.ts'),
-        names: ['foo'],
-      })
-    })
+        source: resolver.resolve("./rpc-methods.ts"),
+        names: ["foo"],
+      });
+    });
   }
   ```
 
@@ -2809,23 +2868,23 @@
         storefront: {
           // ...
           redis: {
-            host: 'localhost',
+            host: "localhost",
             port: 6379,
-            prefix: '',
-            user: '',
-            password: '',
+            prefix: "",
+            user: "",
+            password: "",
             sslTransit: false,
           },
           // ...
           session: {
             // ...
-            provider: 'redis',
+            provider: "redis",
           },
         },
         // ...
       },
       // ...
-    })
+    });
     ```
 
   - _Current Unified Storage Approach (`nuxt.config.ts`):_
@@ -2839,13 +2898,13 @@
           // ...
           storage: {
             cache: {
-              driver: 'redis',
-              host: 'localhost',
+              driver: "redis",
+              host: "localhost",
               port: 6379,
             },
             session: {
-              driver: 'redis',
-              host: 'localhost',
+              driver: "redis",
+              host: "localhost",
               port: 6379,
             },
             // ...
@@ -2855,7 +2914,7 @@
         // ...
       },
       // ...
-    })
+    });
     ```
 
 - **\[💥 BREAKING\]** The composable `useSearch` has been replaced by `useStorefrontSearch`, consolidating and transitioning to SCAYLE Search v2.
@@ -2922,9 +2981,9 @@
 
     ```ts
     const { activeFilters, applyFilters, resetFilterUrl, productConditions } =
-      useQueryFilterState()
+      useQueryFilterState();
 
-    applyFilters({ brand: 23, sale: true, maxPrice: 100, minPrice: 0 })
+    applyFilters({ brand: 23, sale: true, maxPrice: 100, minPrice: 0 });
     ```
 
   - _Current Usage of `useFilter` and `useAppliedFilters`:_
@@ -2937,20 +2996,20 @@
       resetFilters,
       resetPriceFilter,
       resetFilter,
-    } = useFilter()
+    } = useFilter();
 
-    applyPriceFilter([0, 100])
-    applyBooleanFilter('sale', true)
-    applyAttributeFilter('brand', 23)
+    applyPriceFilter([0, 100]);
+    applyBooleanFilter("sale", true);
+    applyAttributeFilter("brand", 23);
 
-    const route = useRoute()
+    const route = useRoute();
     const {
       appliedFilter,
       appliedFiltersCount,
       appliedAttributeValues,
       appliedBooleanValues,
       areFiltersApplied,
-    } = useAppliedFilters(route)
+    } = useAppliedFilters(route);
     ```
 
 - **\[💥 BREAKING\]** The `getBadgeLabel` helper function has been removed, giving you more control over badge label display.
@@ -2960,43 +3019,43 @@
 
     ```ts
     const BadgeLabel = {
-      NEW: 'new',
-      SOLD_OUT: 'sold_out',
-      ONLINE_EXCLUSIVE: 'online_exclusive',
-      SUSTAINABLE: 'sustainable',
-      PREMIUM: 'premium',
-      DEFAULT: '',
-    } as const
+      NEW: "new",
+      SOLD_OUT: "sold_out",
+      ONLINE_EXCLUSIVE: "online_exclusive",
+      SUSTAINABLE: "sustainable",
+      PREMIUM: "premium",
+      DEFAULT: "",
+    } as const;
 
     type BadgeLabelParamsKeys =
-      | 'isNew'
-      | 'isSoldOut'
-      | 'isOnlineOnly'
-      | 'isSustainable'
-      | 'isPremium'
-    type BadgeLabelParams = Partial<Record<BadgeLabelParamsKeys, boolean>>
+      | "isNew"
+      | "isSoldOut"
+      | "isOnlineOnly"
+      | "isSustainable"
+      | "isPremium";
+    type BadgeLabelParams = Partial<Record<BadgeLabelParamsKeys, boolean>>;
 
     const getBadgeLabel = (params: BadgeLabelParams = {}): string => {
       if (!params) {
-        return BadgeLabel.DEFAULT
+        return BadgeLabel.DEFAULT;
       }
       const { isNew, isSoldOut, isOnlineOnly, isSustainable, isPremium } =
-        params
+        params;
 
       if (isNew) {
-        return BadgeLabel.NEW
+        return BadgeLabel.NEW;
       } else if (isSoldOut) {
-        return BadgeLabel.SOLD_OUT
+        return BadgeLabel.SOLD_OUT;
       } else if (isOnlineOnly) {
-        return BadgeLabel.ONLINE_EXCLUSIVE
+        return BadgeLabel.ONLINE_EXCLUSIVE;
       } else if (isSustainable) {
-        return BadgeLabel.SUSTAINABLE
+        return BadgeLabel.SUSTAINABLE;
       } else if (isPremium) {
-        return BadgeLabel.PREMIUM
+        return BadgeLabel.PREMIUM;
       } else {
-        return BadgeLabel.DEFAULT
+        return BadgeLabel.DEFAULT;
       }
-    }
+    };
     ```
 
 - **\[💥 BREAKING\]** The `store` option in the module configuration has been removed. `@scayle/storefront-nuxt@7.84.0` introduced the `shops` option as a replacement, but maintained backward compatibility with the `store` option. Going forward, configuring shops must be done using the `shops` keyword.
@@ -3020,7 +3079,7 @@
         // ...
       },
       // ...
-    })
+    });
     ```
 
   - _Previous Environment Variables for Store Configuration:_
@@ -3049,7 +3108,7 @@
         // ...
       },
       // ...
-    })
+    });
     ```
 
   - _Current Environment Variables for Shops Configuration:_
@@ -3069,8 +3128,8 @@
     ```ts
     useProduct({
       // ...
-      key: 'productKey',
-    })
+      key: "productKey",
+    });
     ```
 
   - _Current `key` as dedicated composables argument:_
@@ -3080,8 +3139,8 @@
       {
         // ...
       },
-      'productKey',
-    )
+      "productKey"
+    );
     ```
 
 - **\[💥 BREAKING\]** Introducing a new feature flag `storefront.legacy.enableSessionMigration` to control the automatic migration of legacy session data, set to `false` by default. Starting with `@scayle/storefront-nuxt@7.68.0` Storefront uses unique session cookie names for each shop, simplifying implementation and enhancing stability.
@@ -3098,27 +3157,27 @@
   - _Previous Usage of `handleIDPLoginCallback`:_
 
     ```ts
-    const { handleIDPLoginCallback } = await useIDP()
+    const { handleIDPLoginCallback } = await useIDP();
 
     watch(
       () => route.query,
       async (query) => {
         if (query.code && isString(query.code)) {
-          await handleIDPLoginCallback(query.code)
+          await handleIDPLoginCallback(query.code);
         }
       },
-      { immediate: true },
-    )
+      { immediate: true }
+    );
     ```
 
   - _Current Usage of `loginIDP`:_
 
     ```ts
-    const { loginIDP } = useAuthentication('login')
+    const { loginIDP } = useAuthentication("login");
 
     onMounted(async () => {
-      await loginIDP(props.code)
-    })
+      await loginIDP(props.code);
+    });
     ```
 
 - **\[🧹 NON-BREAKING\]** Addressed various type resolution errors that were present when using the `@scayle/storefront-nuxt` package with different Node.js versions and module systems. These errors manifested as internal resolution errors or ESM dynamic import only warnings. With this fix, the package now more consistently resolves types correctly across Node.js 16 (CJS and ESM), and bundlers, ensuring a smoother developer experience.
@@ -3128,17 +3187,17 @@
   - _Previous `useRpc` with `autoFetch`:_
 
     ```ts
-    useRpc('rpcMethod', key, params, { autoFetch: true })
+    useRpc("rpcMethod", key, params, { autoFetch: true });
 
-    useUser({ autoFetch: true })
+    useUser({ autoFetch: true });
     ```
 
   - _Current `useRpc` with `immediate`:_
 
     ```ts
-    useRpc('rpcMethod', key, params, { immediate: true })
+    useRpc("rpcMethod", key, params, { immediate: true });
 
-    useUser({ immediate: true })
+    useUser({ immediate: true });
     ```
 
 - **\[💥 BREAKING\]** The attribute `isCmsPreview` has been removed from `RpcContext`.
@@ -3158,18 +3217,18 @@
       getSearchSuggestions,
       fetching,
       ...searchData
-    } = useStorefrontSearch(searchQuery, { key })
+    } = useStorefrontSearch(searchQuery, { key });
 
-    fetching.value // true or false
+    fetching.value; // true or false
     ```
 
   - _Current `useStorefrontSearch` returning `status`:_
 
     ```ts
     const { data, resolveSearch, getSearchSuggestions, status, ...searchData } =
-      useStorefrontSearch(searchQuery, {}, key)
+      useStorefrontSearch(searchQuery, {}, key);
 
-    status.value // 'idle', 'pending', 'error' or 'success'
+    status.value; // 'idle', 'pending', 'error' or 'success'
     ```
 
 - **\[💥 BREAKING\]** We've simplified composable caching and clarified the control you have over shared state behavior. The configuration option `disableDefaultGetCachedDataOverride` has been replaced with `legacy.enableDefaultGetCachedDataOverride`, and its logic has been reversed. Now, when `legacy.enableDefaultGetCachedDataOverride` is not set or set to `false`, the default behavior maintains the shared state functionality of `useRpc`, where multiple calls with the same key use the same cached data. Setting the option to `true` bypasses this shared caching, providing data isolation between calls. To maintain your existing caching behavior, simply change the value of `disableDefaultGetCachedDataOverride` to its opposite in your `nuxt.config.ts` file.
@@ -3194,7 +3253,7 @@
         // ...
       },
       // ...
-    })
+    });
     ```
 
   - _Current `enableDefaultGetCachedDataOverride`in `nuxt.config.ts`:_
@@ -3219,7 +3278,7 @@
         // ...
       },
       // ...
-    })
+    });
     ```
 
 - **\[💥 BREAKING\]** The `useRpc` composable has been updated to provide a more modern and robust data fetching experience, aligning its interface with the current and underlying [Nuxt 3 `useAsyncData`.](https://nuxt.com/docs/api/composables/use-async-data#return-values).
@@ -3241,7 +3300,7 @@
     function myCustomRpc() {
       // ...
 
-      throw new BaseError(404)
+      throw new BaseError(404);
     }
     ```
 
@@ -3251,7 +3310,7 @@
     function myCustomRpc() {
       // ...
 
-      return new Response(null, { status: 404 })
+      return new Response(null, { status: 404 });
     }
     ```