From 6d8e05b7464e1ec134078457744c4d6d20e29a2f Mon Sep 17 00:00:00 2001 From: Anthony LC Date: Fri, 29 Mar 2024 11:49:32 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=A8(app-desk)=20remove=20warning=20nex?= =?UTF-8?q?t.js=20about=20css=20from=20Head?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Importing the css from Head was causing a flickering effect on the button, because of the time the css load. Next.js was emitting as well a warning about css being loaded from the Head component. We moved the css import to the _document.tsx file as recommended by the Next.js documentation. --- .../desk/src/features/header/ApplicationsMenu.tsx | 11 ++++------- src/frontend/apps/desk/src/pages/_document.tsx | 13 ++++++++++++- 2 files changed, 16 insertions(+), 8 deletions(-) diff --git a/src/frontend/apps/desk/src/features/header/ApplicationsMenu.tsx b/src/frontend/apps/desk/src/features/header/ApplicationsMenu.tsx index 289bbc0..b8a64fa 100644 --- a/src/frontend/apps/desk/src/features/header/ApplicationsMenu.tsx +++ b/src/frontend/apps/desk/src/features/header/ApplicationsMenu.tsx @@ -1,4 +1,3 @@ -import Head from 'next/head'; import Script from 'next/script'; import React from 'react'; @@ -12,15 +11,13 @@ import React from 'react'; * This PoC has been created by @manuhabitela. * * It includes external CSS and JavaScript files for styling and functionality. + * + * Style has to be included as well: https://suite-numerique-gaufre.osc-fr1.scalingo.io/public/styles/gaufre-vanilla.css \ + * To respect next.js standards, the css is included using the `_document.ts` component. + * @see https://github.com/numerique-gouv/people/blob/main/src/frontend/apps/desk/src/pages/_document.tsx#L8 */ export const ApplicationsMenu = () => ( <> - - -