packages/nextjs-router/src/pages/document-title-handler.tsx
import React from "react";
import {
Action,
IResourceItem,
generateDefaultDocumentTitle,
useParsed,
useTranslate,
useUserFriendlyName,
} from "@refinedev/core";
import Head from "next/head";
type Props = {
handler?: (options: {
resource?: IResourceItem;
action?: Action;
params?: Record<string, string | undefined>;
pathname?: string;
autoGeneratedTitle: string;
}) => string;
};
export const DocumentTitleHandler = ({ handler }: Props) => {
const { action, id, params, pathname, resource } = useParsed();
const translate = useTranslate();
const getUserFriendlyName = useUserFriendlyName();
const identifier = resource?.identifier ?? resource?.name;
const resourceName =
resource?.label ??
resource?.meta?.label ??
getUserFriendlyName(identifier, action === "list" ? "plural" : "singular");
const autoGeneratedTitle = generateDefaultDocumentTitle(
translate,
resource,
action,
`${id}`,
resourceName,
);
return (
<Head>
<title>
{handler?.({
resource,
params,
action,
autoGeneratedTitle,
pathname,
}) ?? autoGeneratedTitle}
</title>
</Head>
);
};