fix(layouts): drop URL-slug breadcrumb fallback

The breadcrumb computed fell back to the URL slug when
pageBreadcrumbTitle was empty. SSR rendered the slug; the client
re-rendered the page-supplied title after useFetch, triggering a
hydration text-content mismatch on span.breadcrumb-current on every
detail page.

Intermediate segments are stable across server and client, so render
them unconditionally. Only include the trailing segment when a page
provides a title.
This commit is contained in:
Jennie Robinson Faber 2026-05-19 00:10:10 +01:00
parent 790f44b4e9
commit 94b242100c
2 changed files with 6 additions and 4 deletions

View file

@ -227,10 +227,11 @@ const currentPageName = computed(() => {
const path = route.path;
if (path === "/admin") return "admin";
const segments = path.slice(1).split("/");
if (pageBreadcrumbTitle.value && segments.length > 1) {
if (segments.length === 1) return segments[0];
if (pageBreadcrumbTitle.value) {
return [...segments.slice(0, -1), pageBreadcrumbTitle.value].join(" / ");
}
return segments.join(" / ");
return segments.slice(0, -1).join(" / ");
});
</script>

View file

@ -41,10 +41,11 @@ const currentPageName = computed(() => {
const path = route.path;
if (path === "/") return "";
const segments = path.slice(1).split("/");
if (pageBreadcrumbTitle.value && segments.length > 1) {
if (segments.length === 1) return segments[0];
if (pageBreadcrumbTitle.value) {
return [...segments.slice(0, -1), pageBreadcrumbTitle.value].join(" / ");
}
return segments.join(" / ");
return segments.slice(0, -1).join(" / ");
});
</script>