diff --git a/CHANGELOG.md b/CHANGELOG.md index 53c3dfe00..854f5a931 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -9,6 +9,7 @@ and this project adheres to ### Added - 💄(frontend) redesign 404 error standalone page #2696 +- 💄(frontend) redesign 403 access denied page #2720 - ✨(frontend) duplicate with subdocuments #2584 - ✨(helm) allow disallowing search engine indexing per instance #2694 - 🐛(frontend) reduce PostHog volume from web vitals and opt_in spam #2701 diff --git a/src/frontend/apps/impress/src/assets/icons/error-403.svg b/src/frontend/apps/impress/src/assets/icons/error-403.svg new file mode 100644 index 000000000..e910ada1d --- /dev/null +++ b/src/frontend/apps/impress/src/assets/icons/error-403.svg @@ -0,0 +1,102 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/frontend/apps/impress/src/assets/icons/icon-403.png b/src/frontend/apps/impress/src/assets/icons/icon-403.png deleted file mode 100644 index 480944f34..000000000 Binary files a/src/frontend/apps/impress/src/assets/icons/icon-403.png and /dev/null differ diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/components/DocPage403.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/components/DocPage403.tsx index b8ce5330c..f2b5669d8 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/components/DocPage403.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/components/DocPage403.tsx @@ -1,19 +1,15 @@ -import { Button } from '@gouvfr-lasuite/ui-components'; import Head from 'next/head'; -import Image from 'next/image'; import { useEffect } from 'react'; import { useTranslation } from 'react-i18next'; -import styled from 'styled-components'; +import { css } from 'styled-components'; -import img403 from '@/assets/icons/icon-403.png'; +import Error403Svg from '@/assets/icons/error-403.svg'; +import BubbleTextSvg from '@/assets/icons/ui-kit/bubble-text.svg'; import { Box, Icon, Loading, StyledLink, Text } from '@/components'; import { ButtonAccessRequest } from '@/docs/doc-share'; import { useDocAccessRequests } from '@/docs/doc-share/api/useDocAccessRequest'; import { useSkeletonStore } from '@/features/skeletons'; - -const StyledButton = styled(Button)` - width: fit-content; -`; +import HomeSvg from '@/icons/house-rounded.svg'; interface DocProps { id: string; @@ -40,6 +36,7 @@ export const DocPage403 = ({ id }: DocProps) => { const hasRequested = !!requests?.results.find( (request) => request.document === id, ); + const isSubDocument = docAccessError?.status === 404; if (isLoadingRequest) { return ; @@ -61,55 +58,93 @@ export const DocPage403 = ({ id }: DocProps) => { - {t('Image - - - + + + + + } + $theme="neutral" + $variation="tertiary" + /> + + {t('Home')} + + + {!isSubDocument && ( +