From 48d3738ec212613dd22f25a753b4d9aef2601a16 Mon Sep 17 00:00:00 2001 From: Anthony LC Date: Thu, 5 Sep 2024 12:45:02 +0200 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8(frontend)=20update=20meta=20title=20f?= =?UTF-8?q?or=20docs=20page?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit We update the meta title for the docs page with the title of the document. It will be easier for the user to identify the document in their browser tab, in their bookmarks and history. --- CHANGELOG.md | 1 + .../apps/e2e/__tests__/app-impress/doc-create.spec.ts | 4 ++++ src/frontend/apps/impress/src/pages/_app.tsx | 7 ++++++- src/frontend/apps/impress/src/pages/docs/[id]/index.tsx | 7 +++++++ 4 files changed, 18 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b087dad0..0459ab7d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,7 @@ and this project adheres to - ✨Add image attachments with access control - ✨(frontend) Upload image to a document #211 - ✨(frontend) Summary #223 +- ✨(frontend) update meta title for docs page #231 ## Changed diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts index be6ae2bb..c478484b 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts @@ -55,6 +55,10 @@ test.describe('Doc Create', () => { true, ); + expect(await page.locator('title').textContent()).toMatch( + /My new doc - Docs/, + ); + const header = page.locator('header').first(); await header.locator('h2').getByText('Docs').click(); diff --git a/src/frontend/apps/impress/src/pages/_app.tsx b/src/frontend/apps/impress/src/pages/_app.tsx index 61793e38..48b8a2d0 100644 --- a/src/frontend/apps/impress/src/pages/_app.tsx +++ b/src/frontend/apps/impress/src/pages/_app.tsx @@ -21,7 +21,12 @@ export default function App({ Component, pageProps }: AppPropsWithLayout) { <> {t('Docs')} - + {getLayout()} diff --git a/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx b/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx index 72c200d0..d81cc776 100644 --- a/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx +++ b/src/frontend/apps/impress/src/pages/docs/[id]/index.tsx @@ -1,6 +1,7 @@ import { Loader } from '@openfun/cunningham-react'; import { useRouter as useNavigate } from 'next/navigation'; import { useRouter } from 'next/router'; +import { useEffect } from 'react'; import { Box, Text } from '@/components'; import { TextErrors } from '@/components/TextErrors'; @@ -33,6 +34,12 @@ const DocPage = ({ id }: DocProps) => { const { data: doc, isLoading, isError, error } = useDoc({ id }); const navigate = useNavigate(); + useEffect(() => { + if (doc?.title) { + document.title = `${doc.title} - Docs`; + } + }, [doc?.title]); + if (isError && error) { if (error.status === 404) { navigate.replace(`/404`);