Create old fields design widget (#15645)

In this PR:

- Pass `layoutMode` and `tabId` via PageLayoutContentContext provider
- Getting `pageLayoutType` from the current page layout
- Getting isInPinnedTab through `useIsInPinnedTab` hook

## Before

<img width="3456" height="2160" alt="CleanShot 2025-11-06 at 14 22
44@2x"
src="https://github.com/user-attachments/assets/763bb413-5739-45ef-85ed-82a72415886f"
/>

## After

<img width="3456" height="2162" alt="CleanShot 2025-11-06 at 14 20
38@2x"
src="https://github.com/user-attachments/assets/eee6cccd-9d36-426e-a22f-400e8f7f9413"
/>

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Baptiste Devessier
2025-11-06 18:16:42 +01:00
committed by GitHub
parent 33c08ad437
commit bfe1f47065
20 changed files with 328 additions and 107 deletions
@@ -1,6 +1,8 @@
import { SummaryCard } from '@/object-record/record-show/components/SummaryCard';
import { PageLayoutContent } from '@/page-layout/components/PageLayoutContent';
import { PageLayoutContentProvider } from '@/page-layout/contexts/PageLayoutContentContext';
import { useCurrentPageLayout } from '@/page-layout/hooks/useCurrentPageLayout';
import { getTabLayoutMode } from '@/page-layout/utils/getTabLayoutMode';
import { useLayoutRenderingContext } from '@/ui/layout/contexts/LayoutRenderingContext';
import { useTargetRecord } from '@/ui/layout/contexts/useTargetRecord';
import { ShowPageLeftContainer } from '@/ui/layout/show-page/components/ShowPageLeftContainer';
@@ -21,6 +23,15 @@ export const PageLayoutLeftPanel = ({
return null;
}
const pinnedTab = currentPageLayout.tabs.find(
(tab) => tab.id === pinnedLeftTabId,
);
const layoutMode = getTabLayoutMode({
tab: pinnedTab,
pageLayoutType: currentPageLayout.type,
});
return (
<ShowPageLeftContainer>
<SummaryCard
@@ -29,7 +40,14 @@ export const PageLayoutLeftPanel = ({
isInRightDrawer={isInRightDrawer}
/>
<PageLayoutContent tabId={pinnedLeftTabId} />
<PageLayoutContentProvider
value={{
tabId: pinnedLeftTabId,
layoutMode,
}}
>
<PageLayoutContent />
</PageLayoutContentProvider>
</ShowPageLeftContainer>
);
};