Use translations for page titles in frontend

This gives more flexibility for customization, and allows overriding title structure via translations / linguist.
This commit is contained in:
Alexander Skvortsov 2021-12-27 18:15:12 -05:00
parent 01e177eb52
commit c939b4f274
3 changed files with 23 additions and 10 deletions

View File

@ -9,6 +9,7 @@ import Translator from './Translator';
import Store, { ApiPayload, ApiResponse, ApiResponsePlural, ApiResponseSingle, payloadIsPlural } from './Store'; import Store, { ApiPayload, ApiResponse, ApiResponsePlural, ApiResponseSingle, payloadIsPlural } from './Store';
import Session from './Session'; import Session from './Session';
import extract from './utils/extract'; import extract from './utils/extract';
import extractText from './utils/extractText';
import Drawer from './utils/Drawer'; import Drawer from './utils/Drawer';
import mapRoutes from './utils/mapRoutes'; import mapRoutes from './utils/mapRoutes';
import RequestError, { InternalFlarumRequestOptions } from './utils/RequestError'; import RequestError, { InternalFlarumRequestOptions } from './utils/RequestError';
@ -365,9 +366,21 @@ export default class Application {
updateTitle(): void { updateTitle(): void {
const count = this.titleCount ? `(${this.titleCount}) ` : ''; const count = this.titleCount ? `(${this.titleCount}) ` : '';
const pageTitleWithSeparator = this.title && m.route.get() !== this.forum.attribute('basePath') + '/' ? this.title + ' - ' : ''; const onHomepage = m.route.get() === this.forum.attribute('basePath') + '/';
const title = this.forum.attribute('title');
document.title = count + pageTitleWithSeparator + title; const params = {
pageTitle: this.title,
forumName: this.forum.attribute('title'),
// Until we add page numbers to the frontend, this is constant at 1
// so that the page number portion doesn't show up in the URL.
pageNumber: 1,
};
const title =
onHomepage || !this.title
? extractText(app.translator.trans('core.lib.meta_titles.without_page_title', params))
: extractText(app.translator.trans('core.lib.meta_titles.with_page_title', params));
document.title = count + title;
} }
protected transformRequestOptions<ResponseType>(flarumOptions: FlarumRequestOptions<ResponseType>): InternalFlarumRequestOptions<ResponseType> { protected transformRequestOptions<ResponseType>(flarumOptions: FlarumRequestOptions<ResponseType>): InternalFlarumRequestOptions<ResponseType> {

View File

@ -542,6 +542,11 @@ core:
loading_indicator: loading_indicator:
accessible_label: => core.ref.loading accessible_label: => core.ref.loading
# Translations in this namespace are used to format page meta titles.
meta_titles:
with_page_title: "{pageNumber, plural, =1 {{pageTitle} - {forumName}} other {{pageTitle}: Page # - {forumName}}}"
without_page_title: "{pageNumber, plural, =1 {{forumName}} other {Page # - {forumName}}}"
# These translations are used in modals. # These translations are used in modals.
modal: modal:
close: Close close: Close
@ -628,11 +633,6 @@ core:
submit_button: => core.ref.save_changes submit_button: => core.ref.save_changes
title: => core.ref.reset_your_password title: => core.ref.reset_your_password
# Translations in this namespace are used to format page meta titles.
meta_titles:
with_page_title: "{pageNumber, plural, =1 {{pageTitle} - {forumName}} other {{pageTitle}: Page # - {forumName}}}"
without_page_title: "{pageNumber, plural, =1 {{forumName}} other {Page # - {forumName}}}"
# Translations in this namespace are used in messages output by the API. # Translations in this namespace are used in messages output by the API.
api: api:
invalid_username_message: "The username may only contain letters, numbers, and dashes." invalid_username_message: "The username may only contain letters, numbers, and dashes."

View File

@ -37,7 +37,7 @@ class BasicTitleDriver implements TitleDriverInterface
]; ];
return $onHomePage || ! $document->title return $onHomePage || ! $document->title
? $this->translator->trans('core.views.meta_titles.without_page_title', $params) ? $this->translator->trans('core.lib.meta_titles.without_page_title', $params)
: $this->translator->trans('core.views.meta_titles.with_page_title', $params); : $this->translator->trans('core.lib.meta_titles.with_page_title', $params);
} }
} }