Skip to content
All changes

Feature

useDocumentTitle and useHtmlLang

@venizia/ardor-admin

Changelog - 2026-10-09 ​

useDocumentTitle and useHtmlLang ​

New Feature

In one line. @venizia/ardor-admin gains useDocumentTitle, which sets the tab title for a screen, and useHtmlLang, which keeps <html lang> on the UI locale. Both are re-exported from @venizia/ardor.

What changed ​

  • useDocumentTitle({ title, appTitle, separator, enabled }). The tab title is the non-empty title segments, then appTitle, joined by separator (default ' · '). title is one segment or an array; false, null, undefined and '' are skipped. enabled defaults to true.
  • Restore. When the title changes or the component unmounts, the hook puts back the title it replaced, so no reset on navigation is needed. It restores only while the tab still shows the title the hook wrote, so a locale switch or two calls with the same title no longer leave a stale title.
  • useHtmlLang(). Sets document.documentElement.lang to the ra-core useLocaleState() locale and follows every change, so screen readers pick the right voice.
tsx
import { useDocumentTitle, useHtmlLang } from '@venizia/ardor';

export function OrdersPage() {
  useHtmlLang();
  useDocumentTitle({ title: 'Orders', appTitle: 'Back Office' });
  return null;
}
// tab title: Orders · Back Office

Who is affected ​

  • Applications with their own title or lang hook. They can switch to these.
  • Everyone else. No action needed.

Call useDocumentTitle from one component per screen: React runs child effects before parent effects, so a call in a parent wins over a call in a child. useHtmlLang needs the ra-core locale state.