Add see records link to data model (#19163)

## Context
Add a link to the INDEX view page of an object to list all its records
directly from the data model page of the object.

<img width="556" height="460" alt="Screenshot 2026-03-31 at 14 04 20"
src="https://github.com/user-attachments/assets/3daa9ee5-ad09-42b5-a406-088ce8c53be4"
/>
This commit is contained in:
Weiko
2026-03-31 15:12:43 +02:00
committed by GitHub
parent ec283b8f2d
commit 436333f110
@@ -19,8 +19,9 @@ import { isObjectMetadataReadOnly } from '@/object-record/read-only/utils/isObje
import { activeTabIdComponentState } from '@/ui/layout/tab-list/states/activeTabIdComponentState';
import { useAtomComponentStateValue } from '@/ui/utilities/state/jotai/hooks/useAtomComponentStateValue';
import { useLingui } from '@lingui/react/macro';
import { getSettingsPath, isDefined } from 'twenty-shared/utils';
import { getAppPath, getSettingsPath, isDefined } from 'twenty-shared/utils';
import {
IconArrowUpRight,
IconCodeCircle,
IconListDetails,
IconPlus,
@@ -35,6 +36,13 @@ import { useNavigateApp } from '~/hooks/useNavigateApp';
import { SETTINGS_OBJECT_DETAIL_TABS } from '~/pages/settings/data-model/constants/SettingsObjectDetailTabs';
import { updatedObjectNamePluralState } from '~/pages/settings/data-model/states/updatedObjectNamePluralState';
const StyledTabsRow = styled.div`
align-items: center;
display: flex;
justify-content: space-between;
width: 100%;
`;
const StyledContentContainer = styled.div`
flex: 1;
padding-left: 0;
@@ -171,12 +179,23 @@ export const SettingsObjectDetailPage = () => {
}
>
<SettingsPageContainer>
<TabList
tabs={tabs}
componentInstanceId={
SETTINGS_OBJECT_DETAIL_TABS.COMPONENT_INSTANCE_ID
}
/>
<StyledTabsRow>
<TabList
tabs={tabs}
componentInstanceId={
SETTINGS_OBJECT_DETAIL_TABS.COMPONENT_INSTANCE_ID
}
/>
<Button
Icon={IconArrowUpRight}
title={t`See records`}
variant="tertiary"
size="small"
to={getAppPath(AppPath.RecordIndexPage, {
objectNamePlural: objectMetadataItem.namePlural,
})}
/>
</StyledTabsRow>
<StyledContentContainer>
{renderActiveTabContent()}
</StyledContentContainer>