#428

frontend/src/components/common/PageHead.tsx

@@ -0,0 +1,34 @@
+import { Helmet } from 'react-helmet-async'
+
+import { useLocale } from '@/lib/useLocale'
+import { useUITranslation } from '@/lib/useUITranslation'
+
+import type { ReactNode } from 'react'
+
+type LocalisedTitle = { text: string; language: string }
+type Props = {
+    title?: string | LocalisedTitle
+    includeSiteName?: boolean
+    children?: ReactNode }
+
+
+const PageHead = ({ title, includeSiteName = true, children }: Props) => {
+  const locale = useLocale ()
+  const { message, siteTitle } = useUITranslation ('shared')
+  const pageTitle = typeof title === 'string' ? { text: title, language: locale } : title
+  const fullTitle =
+      pageTitle == null
+      ? siteTitle.text
+      : (includeSiteName ? `${pageTitle.text} | ${siteTitle.text}` : pageTitle.text)
+  const description = message ('head.description', { brand: siteTitle.text })
+
+  return (
+      <Helmet>
+	<title lang={pageTitle?.language ?? siteTitle.language}>{fullTitle}</title>
+	<meta name="description" content={description.text} lang={description.language}/>
+	{children}
+      </Helmet>)
+}
+
+
+export default PageHead