jennie/ghostguild-org
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(layouts): drop URL-slug breadcrumb fallback

Browse source 
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
Download patch file Download diff file Expand all files Collapse all files

5
app/layouts/admin.vue
View file

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

5
app/layouts/default.vue
View file

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