From d9ad397c948f8149d6039dc6c2198b61a1111bc9 Mon Sep 17 00:00:00 2001
From: Anthony LC <anthony.le-courric@mail.numerique.gouv.fr>
Date: Wed, 12 Feb 2025 12:10:06 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=A9=B9(frontend)=20minor=20fixes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- fix linter warning on one e2e test
- improve logo svg
- improve cursor
- improve grid loader
---
 .../apps/e2e/__tests__/app-impress/header.spec.ts   |  1 +
 .../apps/impress/src/assets/icons/icon-docs.svg     |  8 +-------
 .../impress/src/features/docs/doc-editor/styles.tsx |  1 +
 .../docs/docs-grid/components/DocsGridLoader.tsx    | 13 ++++---------
 .../src/features/header/components/Header.tsx       |  2 +-
 5 files changed, 8 insertions(+), 17 deletions(-)

diff --git a/src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts
index 00a45625..7234b1fd 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/header.spec.ts
@@ -88,6 +88,7 @@ test.describe('Header mobile', () => {
 test.describe('Header: Log out', () => {
   test.use({ storageState: { cookies: [], origins: [] } });
 
+  // eslint-disable-next-line playwright/expect-expect
   test('checks logout button', async ({ page, browserName }) => {
     await page.goto('/');
     await keyCloakSignIn(page, browserName);
diff --git a/src/frontend/apps/impress/src/assets/icons/icon-docs.svg b/src/frontend/apps/impress/src/assets/icons/icon-docs.svg
index 430eb0e0..05cf0436 100644
--- a/src/frontend/apps/impress/src/assets/icons/icon-docs.svg
+++ b/src/frontend/apps/impress/src/assets/icons/icon-docs.svg
@@ -1,10 +1,4 @@
-<svg
-  width="32"
-  height="33"
-  viewBox="0 0 32 33"
-  fill="none"
-  xmlns="http://www.w3.org/2000/svg"
->
+<svg viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
   <path
     d="M21.6305 29.5812C22.7983 29.2538 23.9166 28.6562 24.6505 27.6003C25.3749 26.5663 25.5789 25.2547 25.5789 23.9925V5.50099C25.5789 5.17358 25.5611 4.84557 25.5216 4.52148C26.1016 4.74961 26.5486 5.12658 26.8626 5.65239C27.2331 6.25024 27.4184 7.03757 27.4184 8.01435V26.7964C27.4184 28.1184 27.0942 29.1078 26.4458 29.7646C25.7974 30.4214 24.8207 30.7498 23.5155 30.7498H16.4209C16.5889 30.7204 16.7574 30.6901 16.9262 30.659C18.4067 30.3944 19.9713 30.0354 21.6185 29.5846L21.6305 29.5812Z"
     fill="#C9191E"
diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/styles.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/styles.tsx
index e63d4563..bb100cde 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-editor/styles.tsx
+++ b/src/frontend/apps/impress/src/features/docs/doc-editor/styles.tsx
@@ -25,6 +25,7 @@ export const cssEditor = (readonly: boolean) => css`
       user-select: none;
       position: absolute;
       top: -17px;
+      left: 0px;
       padding: 0px 6px;
       border-radius: 0px;
       white-space: nowrap;
diff --git a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridLoader.tsx b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridLoader.tsx
index 009e4395..7ac17a92 100644
--- a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridLoader.tsx
+++ b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridLoader.tsx
@@ -1,8 +1,7 @@
 import { Loader } from '@openfun/cunningham-react';
-import { createGlobalStyle, css } from 'styled-components';
+import { createGlobalStyle } from 'styled-components';
 
 import { Box } from '@/components';
-import { HEADER_HEIGHT } from '@/features/header/conf';
 
 const DocsGridLoaderStyle = createGlobalStyle`
   body, main {
@@ -27,15 +26,11 @@ export const DocsGridLoader = ({ isLoading }: DocsGridLoaderProps) => {
         data-testid="grid-loader"
         $align="center"
         $justify="center"
-        $height="calc(100vh - 50px)"
+        $height="100%"
         $width="100%"
-        $maxWidth="960px"
-        $background="rgba(255, 255, 255, 0.3)"
+        $background="rgba(255, 255, 255, 0.5)"
         $zIndex={998}
-        $position="fixed"
-        $css={css`
-          top: ${HEADER_HEIGHT}px;
-        `}
+        $position="absolute"
       >
         <Loader />
       </Box>
diff --git a/src/frontend/apps/impress/src/features/header/components/Header.tsx b/src/frontend/apps/impress/src/features/header/components/Header.tsx
index ff37f03e..bacf39e8 100644
--- a/src/frontend/apps/impress/src/features/header/components/Header.tsx
+++ b/src/frontend/apps/impress/src/features/header/components/Header.tsx
@@ -50,7 +50,7 @@ export const Header = () => {
           $height="fit-content"
           $margin={{ top: 'auto' }}
         >
-          <IconDocs aria-label={t('Docs Logo')} width={25} />
+          <IconDocs aria-label={t('Docs Logo')} width={32} />
           <Title />
         </Box>
       </StyledLink>