diff --git a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissions.tsx b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissions.tsx
index 8bacd2e49..d0f01d4bc 100644
--- a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissions.tsx
+++ b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissions.tsx
@@ -2,14 +2,22 @@ import { RolePermissionsObjectsTableHeader } from '@/settings/roles/role-permiss
import { RolePermissionsSettingsTableHeader } from '@/settings/roles/role-permissions/components/RolePermissionsSettingsTableHeader';
import { RolePermissionsSettingsTableRow } from '@/settings/roles/role-permissions/components/RolePermissionsSettingsTableRow';
import { RolePermissionsObjectPermission } from '@/settings/roles/types/RolePermissionsObjectPermission';
+import { RolePermissionsSettingPermission } from '@/settings/roles/types/RolePermissionsSettingPermission';
import styled from '@emotion/styled';
import { t } from '@lingui/core/macro';
import {
H2Title,
+ IconCode,
IconEye,
+ IconHierarchy,
+ IconKey,
+ IconLock,
IconPencil,
+ IconSettings,
IconTrash,
IconTrashX,
+ IconUserCog,
+ IconUsers,
Section,
} from 'twenty-ui';
import { Role } from '~/generated-metadata/graphql';
@@ -44,71 +52,78 @@ export const RolePermissions = ({ role }: RolePermissionsProps) => {
{
key: 'seeRecords',
label: 'See Records on All Objects',
- icon: ,
+ Icon: IconEye,
value: role.canReadAllObjectRecords,
},
{
key: 'editRecords',
label: 'Edit Records on All Objects',
- icon: ,
+ Icon: IconPencil,
value: role.canUpdateAllObjectRecords,
},
{
key: 'deleteRecords',
label: 'Delete Records on All Objects',
- icon: ,
+ Icon: IconTrash,
value: role.canSoftDeleteAllObjectRecords,
},
{
key: 'destroyRecords',
label: 'Destroy Records on All Objects',
- icon: ,
+ Icon: IconTrashX,
value: role.canDestroyAllObjectRecords,
},
];
- const settingsPermissionsConfig = [
+ const settingsPermissionsConfig: RolePermissionsSettingPermission[] = [
{
key: SettingsPermissions.API_KEYS_AND_WEBHOOKS,
- label: 'API Keys and Webhooks',
+ label: 'Manage API Keys & Webhooks',
type: 'Developer',
value: role.canUpdateAllSettings,
- },
- {
- key: SettingsPermissions.ROLES,
- label: 'Roles',
- type: 'Members',
- value: role.canUpdateAllSettings,
+ Icon: IconCode,
},
{
key: SettingsPermissions.WORKSPACE,
- label: 'Workspace Settings',
+ label: 'Manage Workspace Settings',
type: 'General',
value: role.canUpdateAllSettings,
+ Icon: IconSettings,
},
{
key: SettingsPermissions.WORKSPACE_MEMBERS,
- label: 'Workspace Users',
+ label: 'Manage Members',
type: 'Members',
value: role.canUpdateAllSettings,
+ Icon: IconUsers,
+ },
+ {
+ key: SettingsPermissions.ROLES,
+ label: 'Manage Roles',
+ type: 'Members',
+ value: role.canUpdateAllSettings,
+ Icon: IconLock,
},
{
key: SettingsPermissions.DATA_MODEL,
- label: 'Data Model',
+ label: 'Manage Data Model',
type: 'Data Model',
value: role.canUpdateAllSettings,
+ Icon: IconHierarchy,
},
{
key: SettingsPermissions.ADMIN_PANEL,
- label: 'Admin Panel',
+ label: 'Manage Admin Panel',
type: 'Admin Panel',
value: role.canUpdateAllSettings,
+ Icon: IconUserCog,
},
{
key: SettingsPermissions.SECURITY,
- label: 'Security Settings',
+ label: 'Manage Security Settings',
type: 'Security',
value: role.canUpdateAllSettings,
+ Icon: IconKey,
},
];
diff --git a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsObjectsTableRow.tsx b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsObjectsTableRow.tsx
index f2c04a4ea..68d604b94 100644
--- a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsObjectsTableRow.tsx
+++ b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsObjectsTableRow.tsx
@@ -57,7 +57,9 @@ export const RolePermissionsObjectsTableRow = ({
- {permission.icon}
+
+
+
{permission.label}
diff --git a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsSettingsTableRow.tsx b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsSettingsTableRow.tsx
index b7cd919c1..e0dbe27a5 100644
--- a/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsSettingsTableRow.tsx
+++ b/packages/twenty-front/src/modules/settings/roles/role-permissions/components/RolePermissionsSettingsTableRow.tsx
@@ -34,6 +34,12 @@ const StyledTableRow = styled(TableRow)`
display: flex;
`;
+const StyledIconContainer = styled.div`
+ display: flex;
+ align-items: center;
+ justify-content: center;
+`;
+
type RolePermissionsSettingsTableRowProps = {
permission: RolePermissionsSettingPermission;
};
@@ -47,6 +53,9 @@ export const RolePermissionsSettingsTableRow = ({
{permission.label}
+
+
+
{permission.type}
diff --git a/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsObjectPermission.ts b/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsObjectPermission.ts
index 1638d03e5..466cc757b 100644
--- a/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsObjectPermission.ts
+++ b/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsObjectPermission.ts
@@ -1,6 +1,8 @@
+import { IconComponent } from 'twenty-ui';
+
export type RolePermissionsObjectPermission = {
key: string;
label: string;
- icon: React.ReactNode;
value: boolean;
+ Icon: IconComponent;
};
diff --git a/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsSettingPermission.ts b/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsSettingPermission.ts
index 488fa6292..d1ad40cb8 100644
--- a/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsSettingPermission.ts
+++ b/packages/twenty-front/src/modules/settings/roles/types/RolePermissionsSettingPermission.ts
@@ -1,6 +1,9 @@
+import { IconComponent } from 'twenty-ui';
+
export type RolePermissionsSettingPermission = {
key: string;
label: string;
type: string;
value: boolean;
+ Icon: IconComponent;
};
diff --git a/packages/twenty-ui/src/display/icon/components/TablerIcons.ts b/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
index 54971f328..5ad764929 100644
--- a/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
+++ b/packages/twenty-ui/src/display/icon/components/TablerIcons.ts
@@ -12,10 +12,10 @@ export {
IconArrowDown,
IconArrowLeft,
IconArrowRight,
- IconArrowUp,
- IconArrowUpRight,
IconArrowsDiagonal,
IconArrowsVertical,
+ IconArrowUp,
+ IconArrowUpRight,
IconAt,
IconBaselineDensitySmall,
IconBell,
@@ -44,8 +44,8 @@ export {
IconChevronDown,
IconChevronLeft,
IconChevronRight,
- IconChevronUp,
IconChevronsRight,
+ IconChevronUp,
IconCircleDot,
IconCircleOff,
IconCirclePlus,
@@ -156,6 +156,7 @@ export {
IconHeart,
IconHeartOff,
IconHelpCircle,
+ IconHierarchy,
IconHierarchy2,
IconHistory,
IconHistoryToggle,
@@ -269,6 +270,7 @@ export {
IconUpload,
IconUser,
IconUserCircle,
+ IconUserCog,
IconUserPin,
IconUserPlus,
IconUsers,