import React from 'react';
import { useTranslation } from 'react-i18next';

const TITLE_SEPARATOR = ' · ';

export function useDocumentTitle(title?: string | null) {
  const { t, i18n } = useTranslation('mobile');
  const language = i18n?.language;

  React.useEffect(() => {
    if (typeof document === 'undefined') {
      return;
    }

    const baseTitle = t('header.documentTitle', 'Fotospiel.App Event Admin');
    const resolvedTitle = typeof title === 'string' ? title.trim() : '';
    document.title = resolvedTitle ? `${baseTitle}${TITLE_SEPARATOR}${resolvedTitle}` : baseTitle;
  }, [language, t, title]);
}