[Unités] Corrige styles et bannière dans le formulaire d'édition de c…

…ontact (#1385)

## Related Pull Requests & Issues

- #1271

----

- [ ] Tests E2E (Cypress)

frontend/package.json

@@ -26,7 +26,7 @@
     "test:unit:watch": "npm run test:unit -- --watch"
   },
   "dependencies": {
-    "@mtes-mct/monitor-ui": "17.0.0",
+    "@mtes-mct/monitor-ui": "17.2.2",
     "@reduxjs/toolkit": "1.9.7",
     "@rsuite/responsive-nav": "5.0.1",
     "@sentry/browser": "7.73.0",

frontend/src/features/ControlUnit/components/ControlUnitDialog/ControlUnitContactList/Item.tsx

@@ -46,7 +46,6 @@ const Wrapper = styled.div`
   color: ${p => p.theme.color.slateGray};
   display: flex;
   margin-top: 8px;
-  padding: 8px 16px;
 
   > p:not(:first-child) {
     margin: 8px 0 0;
@@ -55,6 +54,7 @@ const Wrapper = styled.div`
 
 const Left = styled.div`
   flex-grow: 1;
+  padding: 8px 16px 12px;
 
   > p {
     align-items: center;
@@ -68,7 +68,9 @@ const Left = styled.div`
   }
 `
 
-const Right = styled.div``
+const Right = styled.div`
+  padding: 0 1px;
+`
 
 const Name = styled.span`
   color: ${p => p.theme.color.gunMetal};

frontend/src/features/ControlUnit/components/ControlUnitDialog/ControlUnitContactList/index.tsx

@@ -135,7 +135,7 @@ export function ControlUnitContactList({ controlUnit, onSubmit }: ControlUnitCon
       addMainWindowBanner({
         children:
           'Cette unité n’a actuellement plus d’adresse de diffusion. Elle ne recevra plus de préavis ni de bilan de ses activités de contrôle.',
-        closingDelay: 115000,
+        closingDelay: 15000,
         isClosable: true,
         isFixed: true,
         level: Level.WARNING,

frontend/src/features/MainWindow/components/BannerStack/Item.tsx

@@ -6,14 +6,14 @@ import type { Promisable } from 'type-fest'
 
 type ItemProps = {
   bannerProps: BannerStackItemProps
-  bannerStackRank: number
+  bannerStackId: number
   onCloseOrAutoclose: (bannerStackKey: number) => Promisable<void>
 }
-export function Item({ bannerProps, bannerStackRank, onCloseOrAutoclose }: ItemProps) {
+export function Item({ bannerProps, bannerStackId, onCloseOrAutoclose }: ItemProps) {
   const controlledBannerProps: BannerProps = {
     ...bannerProps,
-    onAutoClose: () => onCloseOrAutoclose(bannerStackRank),
-    onClose: () => onCloseOrAutoclose(bannerStackRank),
+    onAutoClose: () => onCloseOrAutoclose(bannerStackId),
+    onClose: () => onCloseOrAutoclose(bannerStackId),
     top: '0'
   }
 

frontend/src/features/MainWindow/components/BannerStack/index.tsx

@@ -25,7 +25,7 @@ export function BannerStack() {
   return (
     <Wrapper>
       {bannerStackItems.map(({ id, props }) => (
-        <Item key={`banner-${id}`} bannerProps={props} bannerStackRank={id} onCloseOrAutoclose={remove} />
+        <Item key={`banner-${id}`} bannerProps={props} bannerStackId={id} onCloseOrAutoclose={remove} />
       ))}
     </Wrapper>
   )