@koehler8/cms 1.0.0-beta.23 → 1.0.0-beta.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koehler8/cms",
-  "version": "1.0.0-beta.23",
+  "version": "1.0.0-beta.24",
   "description": "Vertex CMS — lightweight, config-driven Vue 3 framework with theming, extensions, and SSG support",
   "license": "MIT",
   "type": "module",

package/src/components/Header.vue

@@ -97,7 +97,7 @@
                 <li v-for="locale in availableLocales" :key="locale">
                   <a
                     class="locale-option"
-                    :href="`/${locale}`"
+                    :href="localeHref(locale)"
                     @click="handleLocaleLinkClick(locale)"
                   >
                     <span class="locale-flag" aria-hidden="true">{{ localeEmojis[locale] || '🌐' }}</span>
@@ -120,7 +120,7 @@ import { computed, inject, nextTick, onBeforeUnmount, onMounted, ref, useSlots,
   import { resolveAsset } from '../utils/assetResolver.js';
 import { trackEvent } from '../utils/analytics.js';
 import { getExtensionComponent } from '../extensions/extensionLoader.js';
-import { availableLocales as siteLocales } from '../utils/loadConfig.js';
+import { availableLocales as siteLocales, baseLocale as siteBaseLocale } from '../utils/loadConfig.js';
 
   const slots = useSlots();
   const hasActionsSlot = computed(() => Boolean(slots.actions));
@@ -129,6 +129,14 @@ const isLangOpen = ref(false);
 const isHeaderCompact = ref(false);
 const currentLocale = ref('');
 const availableLocales = computed(() => siteLocales.map((code) => code.trim()).filter(Boolean));
+
+// The base locale is served at the unprefixed root path (`/`) — clicking
+// the dropdown item for it should NOT navigate to `/{baseLocale}` because
+// that URL doesn't pre-render and would 404. Build the link path
+// accordingly: base → `/`, others → `/{locale}`.
+const localeHref = (locale) => {
+  return locale === siteBaseLocale ? '/' : `/${locale}`;
+};
 const localeLabels = {
   en: 'English',
   fr: 'Français',

package/src/router/index.js

@@ -5,6 +5,19 @@ import Home from '../components/Home.vue';
 
 import { availableLocales, baseLocale } from '../utils/loadConfig.js';
 
+// Test for `/{baseLocale}` or `/{baseLocale}/...` paths — these no longer
+// pre-render or match the locale layout (the canonical URL for the base
+// locale is unprefixed). Used by the router guard to redirect in-SPA
+// navigation so external clicks land on the canonical URL instead of the
+// SPA catch-all → 404 path.
+function stripBaseLocalePrefix(targetPath, base) {
+  if (!base || !targetPath) return null;
+  const root = `/${base}`;
+  if (targetPath === root) return '/';
+  if (targetPath.startsWith(`${root}/`)) return targetPath.slice(root.length) || '/';
+  return null;
+}
+
 const LocaleLayout = {
   name: 'LocaleLayout',
   render() {
@@ -85,6 +98,17 @@ function normalizeLocale(value = '') {
 
 export function applyRouterGuards(router, localePrefixes = computeLocalePrefixes()) {
   router.beforeEach((to) => {
+    // SPA-side redirect for stale base-locale-prefixed URLs. When a user
+    // navigates inside the app to `/en/about` (and `en` is base), the URL
+    // doesn't pre-render and the catch-all renders the 404 page. Rewrite
+    // to the canonical unprefixed equivalent. Direct external hits to
+    // these URLs still need an Amplify customRule on the host side — see
+    // CLAUDE.md "URL hygiene".
+    const stripped = stripBaseLocalePrefix(to.path, baseLocale);
+    if (stripped !== null && stripped !== to.path) {
+      return { path: stripped, replace: true };
+    }
+
     const rawLocale = (to.params.locale || '').toString().trim();
 
     if (rawLocale) {