Merge pull request #560 from SocialGouv/add-platform-closing-warning

feat: add platform closing warning

Ajout d'un bandeau d'information indiquant la fermeture prochaine du service

components/header/Header.jsx

 // @flow
 import React from "react";
-import Link from "next/link";
 
-import { Flex, Box } from "rebass";
+import { Flex, Box, Text, Link } from "rebass";
 import { useRouter } from "next/router";
 import { Wrapper } from "../commons/Grid";
 import { LogoLink, Logo, MenuLink } from "./Style";
@@ -14,36 +13,53 @@ const Header = () => {
   const isCheckLinkVisible = !isNouvelleDemarche(pathname);
 
   return (
-    <Box bg="white">
-      <Wrapper>
-        <Flex alignItems="center" flexWrap="wrap" justifyContent="space-between">
-          <Box pl={3} pr={3} py={3} width={[1, 2 / 5, 1 / 3]}>
-            <Link href="/">
-              <LogoLink>
-                <Logo />
-                Work in France
-              </LogoLink>
-            </Link>
-          </Box>
-          <Box pb={[3, 0]} pt={0} px={3} width={[1, 3 / 5, 2 / 3]}>
-            <Flex flexWrap="wrap" justifyContent="flex-end">
-              {isCheckLinkVisible && (
+    <>
+      <Box bg="white">
+        <Wrapper>
+          <Flex alignItems="center" flexWrap="wrap" justifyContent="space-between">
+            <Box pl={3} pr={3} py={3} width={[1, 2 / 5, 1 / 3]}>
+              <Link href="/">
+                <LogoLink>
+                  <Logo />
+                  Work in France
+                </LogoLink>
+              </Link>
+            </Box>
+            <Box pb={[3, 0]} pt={0} px={3} width={[1, 3 / 5, 2 / 3]}>
+              <Flex flexWrap="wrap" justifyContent="flex-end">
+                {isCheckLinkVisible && (
+                  <Box px={0} py={1} width={[1, "auto"]}>
+                    <Link href="/validitycheck">
+                      <MenuLink> Vérifier une autorisation</MenuLink>
+                    </Link>
+                  </Box>
+                )}
                 <Box px={0} py={1} width={[1, "auto"]}>
-                  <Link href="/validitycheck">
-                    <MenuLink> Vérifier une autorisation</MenuLink>
+                  <Link href="/faq">
+                    <MenuLink> Questions / Réponses </MenuLink>
                   </Link>
                 </Box>
-              )}
-              <Box px={0} py={1} width={[1, "auto"]}>
-                <Link href="/faq">
-                  <MenuLink> Questions / Réponses </MenuLink>
-                </Link>
-              </Box>
-            </Flex>
-          </Box>
-        </Flex>
-      </Wrapper>
-    </Box>
+              </Flex>
+            </Box>
+          </Flex>
+        </Wrapper>
+      </Box>
+      <Text bg="red" color="white" p="4">
+        <Wrapper>
+          <p>Information importante</p>
+          <p>
+            La délivrance des autorisations de travail et des autorisations provisoires de travail
+            pour les travailleurs et étudiants non membres de l’UE sera prise en charge à compter du
+            1er avril par les services préfectoraux.
+          </p>
+          <p>
+            Afin de permettre aux services de terminer l’instruction des dossiers en cours, il ne
+            sera plus possible de déposer des dossiers sur la plateforme Work in France à partir du
+            23 mars.
+          </p>
+        </Wrapper>
+      </Text>
+    </>
   );
 };