@frigear-nu/base 0.1.1 → 0.1.3

package/README.md

@@ -94,6 +94,7 @@ With more than one i18n locale, every page gets `<link rel="alternate" hreflang>
 - This package is a shared workspace dependency and is linked via `workspace:*` from apps.
 - Keep changes here compatible with both consuming apps.
 - If you change module config or public runtime behavior, validate both app consumers in the same change.
+- Client-side navigation: the content page and landing template render `UPageHeader`, `UPageBody` and `ContentRenderer` directly, not their `Lazy*` variants. Every page needs them, and a lazy wrapper costs one more round trip on each navigation. `app.vue` shows `NuxtLoadingIndicator`. `@nuxt/ui` must be ≥ 4.12: older `ULink` renders `NuxtLink` in `custom` mode without its prefetch listeners, so links never prefetch on hover or focus.
 
 ## Publishing
 

package/app/app.vue

@@ -14,6 +14,8 @@ useLocaleAlternates()
 
 <template>
   <UApp>
+    <!-- Feedback while a client-side navigation loads; the default throttle hides it on fast ones. -->
+    <NuxtLoadingIndicator color="var(--ui-primary)" />
     <NuxtLayout>
       <NuxtPage />
     </NuxtLayout>

package/app/composables/useCurrentPage.ts

@@ -1,3 +1,12 @@
+/**
+ * Whether the current route can be a content page. Routes a module registers through `addModulePages` carry
+ * `meta.moduleName` and are never served from `@nuxt/content` (account, admin, auth, ...); any other page can opt out
+ * with `definePageMeta({ content: false })`. Skipping them avoids a content query (and, in the browser, loading the
+ * WASM SQLite dump behind it) on every navigation inside those areas.
+ */
+export const routeServedByContent = (meta: Record<string, unknown>) =>
+  meta.content !== false && !meta.moduleName
+
 export const useCurrentPage = () => {
   const route = useRoute()
   const { locale, stripLocalePrefix } = useContentLocale()
@@ -8,10 +17,16 @@ export const useCurrentPage = () => {
     () => `current-page:${collection.value}:${path.value}`,
     // Locale-suffixed collections (e.g. `pages_no`) share the same schema as
     // `pages`, so the cast keeps the return type stable across locales.
-    () => queryCollection(collection.value as 'pages').path(path.value).first(),
+    () => routeServedByContent(route.meta)
+      ? queryCollection(collection.value as 'pages').path(path.value).first()
+      : Promise.resolve(null),
     {
       watch: [path, locale, collection],
       dedupe: 'cancel',
+      // Content is static, so a path that was already loaded (revisit) reuses its payload entry instead of querying
+      // again. Only an explicit refresh asks the content database.
+      getCachedData: (key, nuxtApp, ctx) =>
+        ctx.cause === 'refresh:manual' ? undefined : (nuxtApp.payload.data[key] ?? nuxtApp.static.data[key]),
     },
   )
 }

package/app/composables/useNavigation.ts

@@ -1,13 +1,14 @@
 export const useNavigation = (tags?: string[]) => {
+  // Resolved in setup: calling a composable inside the handler, after an await, loses the Nuxt context.
+  const config = useConfig()
+
   return useAsyncData(
     () => `navigation:${tags?.join(',') || 'all'}`,
     async () => {
-      const { data: config } = await useConfig() // or however you access the pending promise
-      if (!tags) {
-        return config.value?.navigation || []
-      }
-      return (config.value?.navigation || [])
-        .filter(item => !tags || tags.some(tag => item?.tags?.includes(tag)))
+      const { data } = await config
+      const navigation = data.value?.navigation || []
+      if (!tags) return navigation
+      return navigation.filter(item => tags.some(tag => item?.tags?.includes(tag)))
     },
   )
 }

package/app/pages/[[lang]]/[...path].vue

@@ -11,18 +11,18 @@ if (!data.value) {
 <template>
   <UPage>
     <UContainer v-if="data && data.pageHeader">
-      <LazyUPageHeader
+      <UPageHeader
         v-bind="data.pageHeader"
         :ui="{ root: 'text-center', wrapper: 'lg:flex-col lg:items-center lg:justify-center' }"
       />
     </UContainer>
-    <LazyUPageBody>
+    <UPageBody>
       <component
         :is="data?.container ? UContainer : 'div'"
         v-if="data"
       >
-        <LazyContentRenderer :value="data" />
+        <ContentRenderer :value="data" />
       </component>
-    </LazyUPageBody>
+    </UPageBody>
   </UPage>
 </template>

package/app/templates/LandingPage.vue

@@ -6,7 +6,7 @@ if (!data.value) {
 </script>
 
 <template>
-  <LazyContentRenderer
+  <ContentRenderer
     v-if="data"
     :value="data"
   />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@frigear-nu/base",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Shared Nuxt layer for Frigear websites - bundled modules, UI defaults, content collections, layouts and routing.",
   "homepage": "https://docs.frigear.dev/layers/base",
   "repository": {
@@ -24,7 +24,7 @@
   ],
   "dependencies": {
     "@comark/nuxt": "0.6.2",
-    "@frigear-nu/menu": "0.1.1",
+    "@frigear-nu/menu": "0.1.3",
     "@iconify-json/lucide": "^1.2.127",
     "@iconify-json/simple-icons": "^1.2.94",
     "@nuxt/content": "^3.16.1",
@@ -34,7 +34,7 @@
     "@nuxt/image": "^2.1.0",
     "@nuxt/kit": "^4.6.1",
     "@nuxt/schema": "^4.6.1",
-    "@nuxt/ui": "^4.11.2",
+    "@nuxt/ui": "^4.12.0",
     "@nuxtjs/device": "4.0.0",
     "@nuxtjs/i18n": "^10.6.0",
     "@nuxtjs/robots": "^7.0.2",