feat(ui): sync browser title with current page breadcrumbs

Every page already sets breadcrumbs via BreadcrumbContext. This adds a
useEffect in the provider that updates document.title to reflect the
current page, e.g. "Issue Title · Issues · Paperclip".

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dotta
2026-03-03 08:17:48 -06:00
parent 5769aaeca3
commit e9ba0418c3

View File

@@ -1,4 +1,4 @@
import { createContext, useCallback, useContext, useState, type ReactNode } from "react";
import { createContext, useCallback, useContext, useEffect, useState, type ReactNode } from "react";
export interface Breadcrumb {
label: string;
@@ -19,6 +19,15 @@ export function BreadcrumbProvider({ children }: { children: ReactNode }) {
setBreadcrumbsState(crumbs);
}, []);
useEffect(() => {
if (breadcrumbs.length === 0) {
document.title = "Paperclip";
} else {
const parts = [...breadcrumbs].reverse().map((b) => b.label);
document.title = `${parts.join(" · ")} · Paperclip`;
}
}, [breadcrumbs]);
return (
<BreadcrumbContext.Provider value={{ breadcrumbs, setBreadcrumbs }}>
{children}