From 65469bbf0258cb194c188af1d8a2964329bb1f7e Mon Sep 17 00:00:00 2001
From: Charles Bochet <charles@twenty.com>
Date: Fri, 20 Dec 2024 18:03:31 +0100
Subject: [PATCH] Fixes before 0-35 release

---
 .../show-page/components/ShowPageSubContainer.tsx  | 14 ++++++++++----
 .../ShowPageTabListFromUrlOptionalEffect.tsx}      | 12 +++++++++---
 .../modules/ui/layout/tab/components/TabList.tsx   |  5 -----
 3 files changed, 19 insertions(+), 12 deletions(-)
 rename packages/twenty-front/src/modules/ui/layout/{tab/components/TabListFromUrlOptionalEffect.tsx => show-page/components/ShowPageTabListFromUrlOptionalEffect.tsx} (71%)

diff --git a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSubContainer.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSubContainer.tsx
index ed706f726a..5846dcd0f1 100644
--- a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSubContainer.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSubContainer.tsx
@@ -9,6 +9,7 @@ import { recordStoreFamilyState } from '@/object-record/record-store/states/reco
 import { ObjectRecord } from '@/object-record/types/ObjectRecord';
 import { RightDrawerFooter } from '@/ui/layout/right-drawer/components/RightDrawerFooter';
 import { ShowPageLeftContainer } from '@/ui/layout/show-page/components/ShowPageLeftContainer';
+import { ShowPageTabListFromUrlOptionalEffect } from '@/ui/layout/show-page/components/ShowPageTabListFromUrlOptionalEffect';
 import { SingleTabProps, TabList } from '@/ui/layout/tab/components/TabList';
 import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
@@ -64,9 +65,9 @@ export const ShowPageSubContainer = ({
   isInRightDrawer = false,
   isNewRightDrawerItemLoading = false,
 }: ShowPageSubContainerProps) => {
-  const { activeTabId } = useTabList(
-    `${TAB_LIST_COMPONENT_ID}-${isInRightDrawer}-${targetableObject.id}`,
-  );
+  const tabListComponentId = `${TAB_LIST_COMPONENT_ID}-${isInRightDrawer}-${targetableObject.id}`;
+
+  const { activeTabId } = useTabList(tabListComponentId);
 
   const isMobile = useIsMobile();
 
@@ -125,10 +126,15 @@ export const ShowPageSubContainer = ({
       )}
       <StyledShowPageRightContainer isMobile={isMobile}>
         <StyledTabListContainer shouldDisplay={visibleTabs.length > 1}>
+          <ShowPageTabListFromUrlOptionalEffect
+            isInRightDrawer={isInRightDrawer}
+            componentInstanceId={tabListComponentId}
+            tabListIds={tabs.map((tab) => tab.id)}
+          />
           <TabList
             behaveAsLinks={!isInRightDrawer}
             loading={loading || isNewViewableRecordLoading}
-            tabListInstanceId={`${TAB_LIST_COMPONENT_ID}-${isInRightDrawer}-${targetableObject.id}`}
+            tabListInstanceId={tabListComponentId}
             tabs={tabs}
           />
         </StyledTabListContainer>
diff --git a/packages/twenty-front/src/modules/ui/layout/tab/components/TabListFromUrlOptionalEffect.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageTabListFromUrlOptionalEffect.tsx
similarity index 71%
rename from packages/twenty-front/src/modules/ui/layout/tab/components/TabListFromUrlOptionalEffect.tsx
rename to packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageTabListFromUrlOptionalEffect.tsx
index 3bcdfaea51..21169eea6e 100644
--- a/packages/twenty-front/src/modules/ui/layout/tab/components/TabListFromUrlOptionalEffect.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageTabListFromUrlOptionalEffect.tsx
@@ -2,21 +2,27 @@ import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
 import { useEffect } from 'react';
 import { useLocation } from 'react-router-dom';
 
-type TabListFromUrlOptionalEffectProps = {
+type ShowPageTabListFromUrlOptionalEffectProps = {
   componentInstanceId: string;
   tabListIds: string[];
+  isInRightDrawer: boolean;
 };
 
-export const TabListFromUrlOptionalEffect = ({
+export const ShowPageTabListFromUrlOptionalEffect = ({
   componentInstanceId,
   tabListIds,
-}: TabListFromUrlOptionalEffectProps) => {
+  isInRightDrawer,
+}: ShowPageTabListFromUrlOptionalEffectProps) => {
   const location = useLocation();
   const { activeTabId, setActiveTabId } = useTabList(componentInstanceId);
 
   const hash = location.hash.replace('#', '');
 
   useEffect(() => {
+    if (isInRightDrawer) {
+      return;
+    }
+
     if (hash === activeTabId) {
       return;
     }
diff --git a/packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx b/packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx
index 4870989946..444ecfe4e0 100644
--- a/packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx
+++ b/packages/twenty-front/src/modules/ui/layout/tab/components/TabList.tsx
@@ -1,4 +1,3 @@
-import { TabListFromUrlOptionalEffect } from '@/ui/layout/tab/components/TabListFromUrlOptionalEffect';
 import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
 import { TabListScope } from '@/ui/layout/tab/scopes/TabListScope';
 import { LayoutCard } from '@/ui/layout/tab/types/LayoutCard';
@@ -60,10 +59,6 @@ export const TabList = ({
 
   return (
     <TabListScope tabListScopeId={tabListInstanceId}>
-      <TabListFromUrlOptionalEffect
-        componentInstanceId={tabListInstanceId}
-        tabListIds={tabs.map((tab) => tab.id)}
-      />
       <ScrollWrapper
         defaultEnableYScroll={false}
         contextProviderName="tabList"