diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx index bfb2764193..8b157b2751 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldDataType.tsx @@ -5,7 +5,6 @@ import { IconComponent, IconTwentyStar } from 'twenty-ui'; import { SettingsFieldType } from '@/settings/data-model/types/SettingsFieldType'; import { getSettingsFieldTypeConfig } from '@/settings/data-model/utils/getSettingsFieldTypeConfig'; -import { FieldMetadataType } from '~/generated-metadata/graphql'; type SettingsObjectFieldDataTypeProps = { to?: string; @@ -13,6 +12,7 @@ type SettingsObjectFieldDataTypeProps = { label?: string; labelDetail?: string; value: SettingsFieldType; + onClick?: (event: React.MouseEvent) => void; }; const StyledDataType = styled.div<{ @@ -28,19 +28,16 @@ const StyledDataType = styled.div<{ height: 20px; overflow: hidden; text-decoration: none; - - ${({ to }) => + ${({ to, theme }) => to ? css` cursor: pointer; - ` - : ''} - - ${({ value, theme }) => - value === FieldMetadataType.Relation - ? css` color: ${theme.font.color.secondary}; text-decoration: underline; + + &:hover { + color: ${theme.font.color.primary}; + } ` : ''} `; @@ -60,6 +57,7 @@ export const SettingsObjectFieldDataType = ({ Icon: IconFromProps, label: labelFromProps, labelDetail, + onClick, }: SettingsObjectFieldDataTypeProps) => { const theme = useTheme(); @@ -73,7 +71,12 @@ export const SettingsObjectFieldDataType = ({ `; return ( - + {label} {labelDetail && `ยท ${labelDetail}`} diff --git a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx index 23c271d8a7..4ac74f4f6c 100644 --- a/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx +++ b/packages/twenty-front/src/modules/settings/data-model/object-details/components/SettingsObjectFieldItemTableRow.tsx @@ -27,6 +27,7 @@ import { IconMinus, IconPlus, LightIconButton, + UndecoratedLink, isDefined, useIcons, } from 'twenty-ui'; @@ -207,22 +208,29 @@ export const SettingsObjectFieldItemTableRow = ({ if (!isFieldTypeSupported) return null; + const isRelatedObjectLinkable = + isDefined(relationObjectMetadataItem?.namePlural) && + !relationObjectMetadataItem.isSystem; + return ( navigate(linkToNavigate) : undefined} > - - {!!Icon && ( - - )} - - {fieldMetadataItem.label} - - + + + {!!Icon && ( + + )} + + {fieldMetadataItem.label} + + + + {typeLabel} { + if (isRelatedObjectLinkable) { + e.stopPropagation(); + } + }} />