From 3a203040f794a47960286f0e631d2b0d90cb9bed Mon Sep 17 00:00:00 2001
From: Etienne <45695613+etiennejouan@users.noreply.github.com>
Date: Fri, 31 Oct 2025 19:17:31 +0100
Subject: [PATCH] Fix - Multiple banners issue (#15506)

Done :
- Fix multiple banners issue
- Lift impersonation banner


After
<img width="800" height="400" alt="Screenshot 2025-10-31 at 18 05 02"
src="https://github.com/user-attachments/assets/7d5949d4-1c8b-4a4f-91c1-c115e53436fb"
/>
---
 .../components/InformationBannerWrapper.tsx                 | 6 ------
 .../impersonate/InformationBannerIsImpersonating.tsx        | 5 ++++-
 .../src/modules/ui/layout/page/components/DefaultLayout.tsx | 2 ++
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/packages/twenty-front/src/modules/information-banner/components/InformationBannerWrapper.tsx b/packages/twenty-front/src/modules/information-banner/components/InformationBannerWrapper.tsx
index 49b5eb7d7d..af61ee1687 100644
--- a/packages/twenty-front/src/modules/information-banner/components/InformationBannerWrapper.tsx
+++ b/packages/twenty-front/src/modules/information-banner/components/InformationBannerWrapper.tsx
@@ -1,22 +1,18 @@
-import { isImpersonatingState } from '@/auth/states/isImpersonatingState';
 import { InformationBannerBillingSubscriptionPaused } from '@/information-banner/components/billing/InformationBannerBillingSubscriptionPaused';
 import { InformationBannerEndTrialPeriod } from '@/information-banner/components/billing/InformationBannerEndTrialPeriod';
 import { InformationBannerFailPaymentInfo } from '@/information-banner/components/billing/InformationBannerFailPaymentInfo';
 import { InformationBannerNoBillingSubscription } from '@/information-banner/components/billing/InformationBannerNoBillingSubscription';
-import { InformationBannerIsImpersonating } from '@/information-banner/components/impersonate/InformationBannerIsImpersonating';
 import { InformationBannerReconnectAccountEmailAliases } from '@/information-banner/components/reconnect-account/InformationBannerReconnectAccountEmailAliases';
 import { InformationBannerReconnectAccountInsufficientPermissions } from '@/information-banner/components/reconnect-account/InformationBannerReconnectAccountInsufficientPermissions';
 import { useIsSomeMeteredProductCapReached } from '@/workspace/hooks/useIsSomeMeteredProductCapReached';
 import { useIsWorkspaceActivationStatusEqualsTo } from '@/workspace/hooks/useIsWorkspaceActivationStatusEqualsTo';
 import { useSubscriptionStatus } from '@/workspace/hooks/useSubscriptionStatus';
 import styled from '@emotion/styled';
-import { useRecoilValue } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 import { WorkspaceActivationStatus } from 'twenty-shared/workspace';
 import { SubscriptionStatus } from '~/generated-metadata/graphql';
 
 const StyledInformationBannerWrapper = styled.div`
-  height: 40px;
   position: relative;
 
   &:empty {
@@ -30,7 +26,6 @@ export const InformationBannerWrapper = () => {
     WorkspaceActivationStatus.SUSPENDED,
   );
   const isSomeMeteredProductCapReached = useIsSomeMeteredProductCapReached();
-  const isImpersonating = useRecoilValue(isImpersonatingState);
 
   const displayBillingSubscriptionPausedBanner =
     isWorkspaceSuspended && subscriptionStatus === SubscriptionStatus.Paused;
@@ -58,7 +53,6 @@ export const InformationBannerWrapper = () => {
       )}
       {displayFailPaymentInfoBanner && <InformationBannerFailPaymentInfo />}
       {displayEndTrialPeriodBanner && <InformationBannerEndTrialPeriod />}
-      {isImpersonating && <InformationBannerIsImpersonating />}
     </StyledInformationBannerWrapper>
   );
 };
diff --git a/packages/twenty-front/src/modules/information-banner/components/impersonate/InformationBannerIsImpersonating.tsx b/packages/twenty-front/src/modules/information-banner/components/impersonate/InformationBannerIsImpersonating.tsx
index 786728200b..bc6f371bda 100644
--- a/packages/twenty-front/src/modules/information-banner/components/impersonate/InformationBannerIsImpersonating.tsx
+++ b/packages/twenty-front/src/modules/information-banner/components/impersonate/InformationBannerIsImpersonating.tsx
@@ -1,5 +1,6 @@
 import { useAuth } from '@/auth/hooks/useAuth';
 import { currentWorkspaceMemberState } from '@/auth/states/currentWorkspaceMemberState';
+import { isImpersonatingState } from '@/auth/states/isImpersonatingState';
 import { InformationBanner } from '@/information-banner/components/InformationBanner';
 import { t } from '@lingui/core/macro';
 import { useRecoilValue } from 'recoil';
@@ -8,9 +9,11 @@ import { IconLogout } from 'twenty-ui/display';
 
 export const InformationBannerIsImpersonating = () => {
   const currentWorkspaceMember = useRecoilValue(currentWorkspaceMemberState);
+  const isImpersonating = useRecoilValue(isImpersonatingState);
+
   const { signOut } = useAuth();
 
-  if (!isDefined(currentWorkspaceMember)) {
+  if (!isDefined(currentWorkspaceMember) || !isImpersonating) {
     return null;
   }
 
diff --git a/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx b/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx
index f8a436a53d..bdd6661bbf 100644
--- a/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx
@@ -3,6 +3,7 @@ import { CommandMenuRouter } from '@/command-menu/components/CommandMenuRouter';
 import { AppErrorBoundary } from '@/error-handler/components/AppErrorBoundary';
 import { AppFullScreenErrorFallback } from '@/error-handler/components/AppFullScreenErrorFallback';
 import { AppPageErrorFallback } from '@/error-handler/components/AppPageErrorFallback';
+import { InformationBannerIsImpersonating } from '@/information-banner/components/impersonate/InformationBannerIsImpersonating';
 import { KeyboardShortcutMenu } from '@/keyboard-shortcut-menu/components/KeyboardShortcutMenu';
 import { AppNavigationDrawer } from '@/navigation/components/AppNavigationDrawer';
 import { MobileNavigationBar } from '@/navigation/components/MobileNavigationBar';
@@ -75,6 +76,7 @@ export const DefaultLayout = () => {
       />
       <StyledLayout>
         <AppErrorBoundary FallbackComponent={AppFullScreenErrorFallback}>
+          <InformationBannerIsImpersonating />
           <StyledPageContainer
             animate={{
               marginLeft: