Align all field-level permissions (#15023)

# Review Issue #14695 on TwentyHQ GitHub

**Twill Task:** https://twill.ai/twentyhq/ENG/tasks/5

## Summary

This PR addresses issue #14695 from the TwentyHQ GitHub repository. The
changes review and implement solutions related to the reported issue.

## Changes Made

- Reviewed issue #14695 and analyzed the problem context
- Implemented necessary fixes or improvements based on issue
requirements
- Updated relevant files and components affected by the issue

## Context

For detailed task context and preview, please refer to the [Twill
task](https://twill.ai/twentyhq/ENG/tasks/5).

---

*Note: Please review the file changes for specific implementation
details.*

<details>
<summary>📸 Screenshots</summary>

Playwright test screenshots captured during development:

### field-permissions-after-fix.png


![field-permissions-after-fix.png](https://storage.googleapis.com/twill-screenshots-twill-469020/screenshots/1760092866977-field-permissions-after-fix.png)

### field-permissions-table-with-fix.png


![field-permissions-table-with-fix.png](https://storage.googleapis.com/twill-screenshots-twill-469020/screenshots/1760092867665-field-permissions-table-with-fix.png)

</details>

---------

Co-authored-by: Twill <agent@twill.ai>
Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
This commit is contained in:
twill-hq[bot]
2025-10-24 15:01:00 +02:00
committed by GitHub
co-authored by Twill Claude Charles Bochet
parent 682bbe7bba
commit f1b6ec59cc
2 changed files with 7 additions and 13 deletions
@@ -1,8 +1,10 @@
import { type ObjectMetadataItem } from '@/object-metadata/types/ObjectMetadataItem';
import { filterUserFacingFieldMetadataItems } from '@/object-metadata/utils/filterUserFacingFieldMetadataItems';
import { SettingsRolePermissionsObjectLevelObjectFieldPermissionTableAllHeaderRow } from '@/settings/roles/role-permissions/object-level-permissions/field-permissions/components/SettingsRolePermissionsObjectLevelObjectFieldPermissionTableAllHeaderRow';
import { SettingsRolePermissionsObjectLevelObjectFieldPermissionTableRow } from '@/settings/roles/role-permissions/object-level-permissions/field-permissions/components/SettingsRolePermissionsObjectLevelObjectFieldPermissionTableRow';
import { FIELD_LEVEL_PERMISSION_TABLE_GRID_TEMPLATE_COLUMNS } from '@/settings/roles/role-permissions/object-level-permissions/field-permissions/constants/FieldLevelPermissionTableGridTemplateColumns';
import {
SettingsRolePermissionsObjectLevelObjectFieldPermissionTableRow,
StyledObjectFieldTableRow,
} from '@/settings/roles/role-permissions/object-level-permissions/field-permissions/components/SettingsRolePermissionsObjectLevelObjectFieldPermissionTableRow';
import { useObjectPermissionDerivedStates } from '@/settings/roles/role-permissions/object-level-permissions/field-permissions/hooks/useObjectPermissionDerivedStates';
import { settingsDraftRoleFamilyState } from '@/settings/roles/states/settingsDraftRoleFamilyState';
import { type OrderBy } from '@/types/OrderBy';
@@ -11,7 +13,6 @@ import { SortableTableHeader } from '@/ui/layout/table/components/SortableTableH
import { Table } from '@/ui/layout/table/components/Table';
import { TableHeader } from '@/ui/layout/table/components/TableHeader';
import { TableHeaderText } from '@/ui/layout/table/components/TableHeaderText';
import { TableRow } from '@/ui/layout/table/components/TableRow';
import { sortedFieldByTableFamilyState } from '@/ui/layout/table/states/sortedFieldByTableFamilyState';
import styled from '@emotion/styled';
import { useLingui } from '@lingui/react/macro';
@@ -31,10 +32,6 @@ const StyledSearchInput = styled(SettingsTextInput)`
width: 100%;
`;
const StyledObjectFieldTableRow = styled(TableRow)`
grid-auto-columns: ${FIELD_LEVEL_PERMISSION_TABLE_GRID_TEMPLATE_COLUMNS};
`;
export type SettingsRolePermissionsObjectLevelObjectFieldPermissionTableProps =
{
objectMetadataItem: ObjectMetadataItem;
@@ -1,5 +1,3 @@
import { RECORD_TABLE_COLUMN_CHECKBOX_WIDTH } from '@/object-record/record-table/constants/RecordTableColumnCheckboxWidth';
import { RECORD_TABLE_COLUMN_DRAG_AND_DROP_WIDTH } from '@/object-record/record-table/constants/RecordTableColumnDragAndDropWidth';
import { useTheme } from '@emotion/react';
import styled from '@emotion/styled';
import { IconReload, IconX } from 'twenty-ui/display';
@@ -12,16 +10,15 @@ const StyledOverridableCheckboxContainer = styled.div`
align-items: center;
display: inline-flex;
justify-content: flex-start;
width: ${RECORD_TABLE_COLUMN_DRAG_AND_DROP_WIDTH +
RECORD_TABLE_COLUMN_CHECKBOX_WIDTH}px;
width: ${({ theme }) => theme.icon.size.xl * 2}px;
`;
const StyledOverridableCheckboxContainerItem = styled.div`
align-items: center;
display: flex;
height: 24px;
height: ${({ theme }) => theme.icon.size.xl}px;
justify-content: center;
width: 24px;
width: ${({ theme }) => theme.icon.size.xl}px;
`;
const StyledIconWrapper = styled.div<{