portal-payment-fe/src/components/SetPageTitle.tsx

40 lines
1.1 KiB
TypeScript

"use client";
import { useEffect } from "react";
/**
* SetPageTitle (document title)
* This component updates the browser/document title (the website tab title).
* It intentionally does NOT touch the header title provider.
*
* Usage: <SetPageTitle title="My Page" /> or pass an array of breadcrumb items;
* when an array is provided the last breadcrumb label will be used as the page title.
*/
export default function SetPageTitle({
title,
resetTo = "App",
}: {
title: string | { label: string; url?: string }[];
resetTo?: string | { label: string; url?: string }[] | string;
}) {
useEffect(() => {
const resolved = Array.isArray(title)
? title.length
? title[title.length - 1].label
: String(title)
: title;
const prev = document.title;
document.title = String(resolved);
return () => {
if (typeof resetTo === "string") document.title = resetTo;
else if (Array.isArray(resetTo) && resetTo.length)
document.title = resetTo[resetTo.length - 1].label;
else document.title = prev;
};
}, [title, resetTo]);
return null;
}