diff --git a/CHANGELOG.md b/CHANGELOG.md index b510b51ae..3fc8dc400 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -24,6 +24,7 @@ and this project adheres to - 💄(frontend) error alert closeable on editor #284 - ♻️(backend) Change email content #283 - 🛂(frontend) viewers and editors can access share modal #302 +- ♻️(frontend) remove footer on doc editor #313 ## Fixed diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts index 5f7a846c6..ba2b7ea6c 100644 --- a/src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts +++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-visibility.spec.ts @@ -94,6 +94,7 @@ test.describe('Doc Visibility: Not loggued', () => { await page.goto(urlDoc); await expect(page.locator('h2').getByText(docTitle)).toBeVisible(); + await expect(page.getByRole('button', { name: 'Share' })).toBeHidden(); }); test('A private doc redirect to the OIDC when not authentified.', async ({ diff --git a/src/frontend/apps/e2e/__tests__/app-impress/footer.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/footer.spec.ts new file mode 100644 index 000000000..0862051f4 --- /dev/null +++ b/src/frontend/apps/e2e/__tests__/app-impress/footer.spec.ts @@ -0,0 +1,77 @@ +import { expect, test } from '@playwright/test'; + +import { goToGridDoc } from './common'; + +test.beforeEach(async ({ page }) => { + await page.goto('/'); +}); + +test.describe('Footer', () => { + test('checks all the elements are visible', async ({ page }) => { + const footer = page.locator('footer').first(); + + await expect(footer.getByAltText('Gouvernement Logo')).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'legifrance.gouv.fr' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'info.gouv.fr' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'service-public.fr' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'data.gouv.fr' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'Legal Notice' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'Personal data and cookies' }), + ).toBeVisible(); + + await expect( + footer.getByRole('link', { name: 'Accessibility' }), + ).toBeVisible(); + + await expect( + footer.getByText( + 'Unless otherwise stated, all content on this site is under licence', + ), + ).toBeVisible(); + }); + + test('checks footer is not visible on doc editor', async ({ page }) => { + await expect(page.locator('footer')).toBeVisible(); + await goToGridDoc(page); + await expect(page.locator('footer')).toBeHidden(); + }); + + const legalPages = [ + { name: 'Legal Notice', url: '/legal-notice/' }, + { name: 'Personal data and cookies', url: '/personal-data-cookies/' }, + { name: 'Accessibility', url: '/accessibility/' }, + ]; + for (const { name, url } of legalPages) { + test(`checks ${name} page`, async ({ page }) => { + const footer = page.locator('footer').first(); + await footer.getByRole('link', { name }).click(); + + await expect( + page + .getByRole('heading', { + name, + }) + .first(), + ).toBeVisible(); + + await expect(page).toHaveURL(url); + }); + } +}); diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx index 98dfd6386..c74fc3d88 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx @@ -3,6 +3,7 @@ import React, { useState } from 'react'; import { useTranslation } from 'react-i18next'; import { Box, DropButton, IconOptions, Text } from '@/components'; +import { useAuthStore } from '@/core'; import { usePanelEditorStore } from '@/features/docs/doc-editor/'; import { Doc, @@ -29,6 +30,7 @@ export const DocToolBox = ({ doc, versionId }: DocToolBoxProps) => { const { setIsPanelOpen, setIsPanelTableContentOpen } = usePanelEditorStore(); const [isModalVersionOpen, setIsModalVersionOpen] = useState(false); const { isSmallMobile } = useResponsiveStore(); + const { authenticated } = useAuthStore(); return ( { )} - + {authenticated && ( + + )} { + const { t } = useTranslation(); + const { themeTokens } = useCunninghamTheme(); + const logo = themeTokens().logo; + + return ( + + + + + + + {logo && ( + {logo.alt} + )} + + + + {[ + { + label: 'legifrance.gouv.fr', + href: 'https://legifrance.gouv.fr/', + }, + { + label: 'info.gouv.fr', + href: 'https://info.gouv.fr/', + }, + { + label: 'service-public.fr', + href: 'https://service-public.fr/', + }, + { + label: 'data.gouv.fr', + href: 'https://data.gouv.fr/', + }, + ].map(({ label, href }) => ( + + {label} + + + ))} + + + + {[ + { + label: t('Legal Notice'), + href: '/legal-notice', + }, + { + label: t('Personal data and cookies'), + href: '/personal-data-cookies', + }, + { + label: t('Accessibility'), + href: '/accessibility', + }, + ].map(({ label, href }) => ( + + + {label} + + + ))} + + + {t('Unless otherwise stated, all content on this site is under')}{' '} + + licence etalab-2.0 + + + + + + ); +}; diff --git a/src/frontend/apps/impress/src/features/footer/assets/external-link.svg b/src/frontend/apps/impress/src/features/footer/assets/external-link.svg new file mode 100644 index 000000000..25093d139 --- /dev/null +++ b/src/frontend/apps/impress/src/features/footer/assets/external-link.svg @@ -0,0 +1,5 @@ + + + diff --git a/src/frontend/apps/impress/src/features/footer/index.tsx b/src/frontend/apps/impress/src/features/footer/index.tsx new file mode 100644 index 000000000..ddcc5a9cd --- /dev/null +++ b/src/frontend/apps/impress/src/features/footer/index.tsx @@ -0,0 +1 @@ +export * from './Footer'; diff --git a/src/frontend/apps/impress/src/features/service-worker/service-worker.ts b/src/frontend/apps/impress/src/features/service-worker/service-worker.ts index 7d42d62cf..94b9c37c7 100644 --- a/src/frontend/apps/impress/src/features/service-worker/service-worker.ts +++ b/src/frontend/apps/impress/src/features/service-worker/service-worker.ts @@ -94,6 +94,9 @@ const precacheResources = [ '/', '/index.html', '/404/', + '/accessibility/', + '/legal-notice/', + '/personal-data-cookies/', FALLBACK.offline, FALLBACK.images, FALLBACK.docs, diff --git a/src/frontend/apps/impress/src/layouts/MainLayout.tsx b/src/frontend/apps/impress/src/layouts/MainLayout.tsx index 5176557e6..bdfe587cc 100644 --- a/src/frontend/apps/impress/src/layouts/MainLayout.tsx +++ b/src/frontend/apps/impress/src/layouts/MainLayout.tsx @@ -1,8 +1,18 @@ +import { PropsWithChildren } from 'react'; + import { Box } from '@/components'; import { useCunninghamTheme } from '@/cunningham'; +import { Footer } from '@/features/footer'; import { Header } from '@/features/header'; -export function MainLayout({ children }: { children: React.ReactNode }) { +interface MainLayoutProps { + withoutFooter?: boolean; +} + +export function MainLayout({ + children, + withoutFooter, +}: PropsWithChildren) { const { colorsTokens } = useCunninghamTheme(); return ( @@ -20,6 +30,7 @@ export function MainLayout({ children }: { children: React.ReactNode }) { + {!withoutFooter &&