From f8c4d2b6195a1dba5100b11ef72c1305ba8e9282 Mon Sep 17 00:00:00 2001
From: Anthony LC <anthony.le-courric@mail.numerique.gouv.fr>
Date: Thu, 6 Aug 2026 12:30:25 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=A8(frontend)=20adapt=20code=20to=20ui?=
 =?UTF-8?q?-kit=20v0.28?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ui-kit v0.28 breaks some UI components.
This commit updates the relevant files to ensure
compatibility with the new version of ui-kit.
We update the cunningham-tokens.css and
cunningham-tokens.ts files to reflect the changes
in the design tokens.
---
 .../apps/impress/src/components/__tests__/Box.spec.tsx | 10 +++++-----
 .../apps/impress/src/cunningham/cunningham-tokens.css  |  6 ++++++
 .../apps/impress/src/cunningham/cunningham-tokens.ts   | 10 ++++++++++
 .../features/left-panel/components/LeftPanelFooter.tsx |  8 ++++++++
 4 files changed, 29 insertions(+), 5 deletions(-)

diff --git a/src/frontend/apps/impress/src/components/__tests__/Box.spec.tsx b/src/frontend/apps/impress/src/components/__tests__/Box.spec.tsx
index 26423ab40..bebe04ed7 100644
--- a/src/frontend/apps/impress/src/components/__tests__/Box.spec.tsx
+++ b/src/frontend/apps/impress/src/components/__tests__/Box.spec.tsx
@@ -18,10 +18,10 @@ describe('<Box />', () => {
     );
 
     expect(screen.getByText('My Box')).toHaveStyle(`
-      padding-left: 2.5rem;
-      padding-right: 2.5rem;
-      padding-top: 3rem;
-      padding-bottom: 0.5rem;`);
+      padding-left: 40px;
+      padding-right: 40px;
+      padding-top: 48px;
+      padding-bottom: 8px;`);
   });
 
   it('has the margin from prop', () => {
@@ -46,7 +46,7 @@ describe('<Box />', () => {
     expect(screen.getByText('My Box')).toHaveStyle(`
       margin-left: auto;
       margin-right: auto;
-      margin-top: 1.625rem;
+      margin-top: 26px;
       margin-bottom: 100%;`);
   });
 });
diff --git a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css
index f995bee96..1e641212f 100644
--- a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css
+++ b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.css
@@ -849,6 +849,9 @@
   --c--components--datagrid--body--background-color-hover: var(
     --c--contextuals--background--semantic--neutral--tertiary
   );
+  --c--components--forms-fileuploader--border-style: solid;
+  --c--components--forms-fileuploader--border-radius: 4px;
+  --c--components--forms-fileuploader--border-width: 1px;
   --c--components--forms-checkbox--font-size: var(
     --c--globals--font--sizes--sm
   );
@@ -2553,6 +2556,9 @@
   --c--components--datagrid--body--background-color-hover: var(
     --c--contextuals--background--semantic--neutral--tertiary
   );
+  --c--components--forms-fileuploader--border-style: solid;
+  --c--components--forms-fileuploader--border-radius: 4px;
+  --c--components--forms-fileuploader--border-width: 1px;
   --c--components--forms-checkbox--font-size: var(
     --c--globals--font--sizes--sm
   );
diff --git a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts
index 1e5fb8bdf..090321f4c 100644
--- a/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts
+++ b/src/frontend/apps/impress/src/cunningham/cunningham-tokens.ts
@@ -664,6 +664,11 @@ export const tokens = {
           'header--weight': '500',
           'body--background-color-hover': '#F0F0F3',
         },
+        'forms-fileuploader': {
+          'border-style': 'solid',
+          'border-radius': '4px',
+          'border-width': '1px',
+        },
         'forms-checkbox': { 'font-size': '0.875rem' },
         'forms-input': {
           'border-radius': '4px',
@@ -1969,6 +1974,11 @@ export const tokens = {
           'header--weight': '500',
           'body--background-color-hover': '#F0F0F3',
         },
+        'forms-fileuploader': {
+          'border-style': 'solid',
+          'border-radius': '4px',
+          'border-width': '1px',
+        },
         'forms-checkbox': { 'font-size': '0.875rem' },
         'forms-input': {
           'border-radius': '4px',
diff --git a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFooter.tsx b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFooter.tsx
index 3cd62b0b6..6866c22d4 100644
--- a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFooter.tsx
+++ b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFooter.tsx
@@ -1,5 +1,6 @@
 import { UserMenu } from '@gouvfr-lasuite/ui-kit';
 import { useTranslation } from 'react-i18next';
+import { createGlobalStyle } from 'styled-components';
 
 import { Box, SeparatedSection } from '@/components';
 import { Waffle } from '@/components/Waffle';
@@ -9,6 +10,12 @@ import { gotoLogout } from '@/features/auth/utils';
 import { HelpMenu } from '@/features/help';
 import { LanguagePicker } from '@/features/language/components/LanguagePicker';
 
+const LeftPanelFooterGlobalStyle = createGlobalStyle`
+  .user-menu__actions .c__language-picker{
+    width: auto;
+  }
+`;
+
 export const LeftPanelFooter = () => {
   const { t } = useTranslation();
   const { user } = useAuth();
@@ -20,6 +27,7 @@ export const LeftPanelFooter = () => {
 
   return (
     <SeparatedSection showSeparator="top" $margin={{ top: 'auto' }}>
+      <LeftPanelFooterGlobalStyle />
       <Box
         $padding={{ horizontal: 'sm' }}
         $justify="space-between"