🥅(frontend) improve meta 401 page

AntoLC · AntoLC · commit b773f0979213 · 2025-09-17T17:45:26.000+02:00
Add better meta for the 401 page.
diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-routing.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-routing.spec.ts
@@ -93,6 +93,12 @@ test.describe('Doc Routing', () => {
     await expect(page.getByText('Log in to access the document.')).toBeVisible({
       timeout: 10000,
     });
+
+    await expect(page.locator('meta[name="robots"]')).toHaveAttribute(
+      'content',
+      'noindex',
+    );
+    await expect(page).toHaveTitle(/401 Unauthorized - Docs/);
   });
 });
 
diff --git a/src/frontend/apps/impress/src/pages/401.tsx b/src/frontend/apps/impress/src/pages/401.tsx
@@ -1,4 +1,5 @@
 import { Button } from '@openfun/cunningham-react';
+import Head from 'next/head';
 import Image from 'next/image';
 import { useRouter } from 'next/router';
 import { ReactElement, useEffect } from 'react';
@@ -22,32 +23,43 @@ const Page: NextPageWithLayout = () => {
   }, [authenticated, replace]);
 
   return (
-    <Box
-      $align="center"
-      $margin="auto"
-      $gap="1rem"
-      $padding={{ bottom: '2rem' }}
-    >
-      <Image
-        className="c__image-system-filter"
-        src={img401}
-        alt={t('Image 401')}
-        style={{
-          maxWidth: '100%',
-          height: 'auto',
-        }}
-      />
-
-      <Box $align="center" $gap="0.8rem">
-        <Text as="p" $textAlign="center" $maxWidth="350px" $theme="primary">
-          {t('Log in to access the document.')}
-        </Text>
-
-        <Button onClick={() => gotoLogin(false)} aria-label={t('Login')}>
-          {t('Login')}
-        </Button>
+    <>
+      <Head>
+        <meta name="robots" content="noindex" />
+        <title>{`${t('401 Unauthorized')} - ${t('Docs')}`}</title>
+        <meta
+          property="og:title"
+          content={`${t('401 Unauthorized')} - ${t('Docs')}`}
+          key="title"
+        />
+      </Head>
+      <Box
+        $align="center"
+        $margin="auto"
+        $gap="1rem"
+        $padding={{ bottom: '2rem' }}
+      >
+        <Image
+          className="c__image-system-filter"
+          src={img401}
+          alt={t('Image 401')}
+          style={{
+            maxWidth: '100%',
+            height: 'auto',
+          }}
+        />
+
+        <Box $align="center" $gap="0.8rem">
+          <Text as="p" $textAlign="center" $maxWidth="350px" $theme="primary">
+            {t('Log in to access the document.')}
+          </Text>
+
+          <Button onClick={() => gotoLogin(false)} aria-label={t('Login')}>
+            {t('Login')}
+          </Button>
+        </Box>
       </Box>
-    </Box>
+    </>
   );
 };
 
