@sit-onyx/nuxt-docs 0.8.0-dev-20261009123512 → 0.8.0-dev-20261009132111

package/app/composables/useCollection.ts

@@ -15,17 +15,14 @@ export type UseCollectionOptions<TCollection extends keyof Collections = keyof C
 
 /**
  * Composable for loading the collection data for the current route and locale.
- * Will throw an 404 error if the collection item could not be found.
- * Sets SEO data with `useSeoMeta()` automatically.
  */
 export const useCollection = async <TCollection extends keyof Collections = keyof Collections>(
   options: UseCollectionOptions<TCollection>,
 ) => {
-  const nuxtApp = useNuxtApp();
   const { locale } = useI18n();
   const route = useRoute();
-
   const collection = computed(() => toValue(options.collection));
+
   const path = computed(() => {
     let _path = toValue(options.path);
     if (_path) return _path;
@@ -39,38 +36,19 @@ export const useCollection = async <TCollection extends keyof Collections = keyo
     return _path;
   });
 
-  const { data: collectionData } = await useAsyncData(
-    () => `collection-${collection.value}-${path.value}`,
-    () => queryCollection(collection.value).path(path.value).first(),
-  );
-
-  const data = computed<Collections[TCollection] | undefined>(() => {
-    return collectionData.value as Collections[TCollection];
-  });
+  const key = computed(() => `collection-${collection.value}-${path.value}`);
 
-  watch(
-    data,
-    async (newValue) => {
-      // if data is "null", the page content was not found. "undefined" means it is not loaded yet
-      if (newValue !== null) return;
-      await nuxtApp.runWithContext(() =>
-        showError({
-          message: "Page not found",
-          statusCode: 404,
-          fatal: true,
-        }),
-      );
+  return useAsyncData(
+    key,
+    async () => {
+      const data = await queryCollection(collection.value).path(path.value).first();
+      if (data) return data;
+      throw createError({ status: 404, message: "Page not found", fatal: true });
+    },
+    {
+      // when multiple parallel requests are made for the same page, "defer" will make sure only the first
+      // is executed and the result is shared with all other requests
+      dedupe: "defer",
     },
-    { immediate: true },
   );
-
-  // runWithContext is needed due to async usage above
-  await nuxtApp.runWithContext(() => {
-    useSeoMeta({
-      title: () => data.value?.seo.title,
-      description: () => data.value?.seo.description,
-    });
-  });
-
-  return { data };
 };

package/app/pages/[...slug].vue

@@ -6,10 +6,23 @@ definePageMeta({ layout: false });
 
 const { locale } = useI18n();
 
-const { data } = await useCollection({
+const { data, error } = await useCollection({
   collection: computed(() => `content_${locale.value}` as keyof Collections),
 });
 
+watch(
+  error,
+  () => {
+    if (error.value) showError(error.value);
+  },
+  { immediate: true },
+);
+
+useSeoMeta({
+  title: () => data.value?.seo.title,
+  description: () => data.value?.seo.description,
+});
+
 const layout = computed<keyof NuxtLayouts>(() => {
   const layout = data.value?.meta.layout;
   if (layout && typeof layout === "string") return layout as keyof NuxtLayouts;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sit-onyx/nuxt-docs",
-  "version": "0.8.0-dev-20261009123512",
+  "version": "0.8.0-dev-20261009132111",
   "description": "Nuxt layer/template for creating documentations with the onyx design system",
   "bugs": {
     "url": "https://github.com/SchwarzIT/onyx/issues"
@@ -32,12 +32,12 @@
     "@nuxtjs/mdc": "~0.23.2",
     "@playwright/experimental-ct-vue": "1.62.1",
     "@playwright/test": "1.62.1",
-    "@sit-onyx/icons": "^1.13.0-dev-20261009123512",
+    "@sit-onyx/icons": "^1.13.0-dev-20261009132111",
     "@sit-onyx/nuxt": "^1.1.2",
     "@sit-onyx/shared": "^0.1.0",
     "nuxt": "4.5.2",
     "sass-embedded": "1.105.1",
-    "sit-onyx": "^1.21.1-dev-20261009123512",
+    "sit-onyx": "^1.21.1-dev-20261009132111",
     "typescript": "6.0.3",
     "vue": "3.5.43"
   },
@@ -48,10 +48,10 @@
     "@nuxtjs/color-mode": ">= 4",
     "@nuxtjs/i18n": ">= 10",
     "@nuxtjs/mdc": ">= 0.20.2",
-    "@sit-onyx/icons": "^1.13.0-dev-20261009123512",
+    "@sit-onyx/icons": "^1.13.0-dev-20261009132111",
     "@sit-onyx/nuxt": "^1.1.2",
     "sass-embedded": ">= 1",
-    "sit-onyx": "^1.21.1-dev-20261009123512"
+    "sit-onyx": "^1.21.1-dev-20261009132111"
   },
   "engines": {
     "node": ">=20"