object level override form (#11672)

packages/twenty-front/src/modules/settings/roles/components/SettingsRolesQueryEffect.tsx

@@ -2,10 +2,12 @@ import { settingsDraftRoleFamilyState } from '@/settings/roles/states/settingsDr
 import { settingsPersistedRoleFamilyState } from '@/settings/roles/states/settingsPersistedRoleFamilyState';
 import { settingsRoleIdsState } from '@/settings/roles/states/settingsRoleIdsState';
 import { settingsRolesIsLoadingState } from '@/settings/roles/states/settingsRolesIsLoadingState';
+import { getSnapshotValue } from '@/ui/utilities/recoil-scope/utils/getSnapshotValue';
 import { useEffect } from 'react';
 import { useRecoilCallback, useSetRecoilState } from 'recoil';
 import { isDefined } from 'twenty-shared/utils';
 import { Role, useGetRolesQuery } from '~/generated/graphql';
+import { isDeeplyEqual } from '~/utils/isDeeplyEqual';
 
 export const SettingsRolesQueryEffect = () => {
   const { data, loading } = useGetRolesQuery({
@@ -17,11 +19,18 @@ export const SettingsRolesQueryEffect = () => {
   );
 
   const populateRoles = useRecoilCallback(
-    ({ set }) =>
+    ({ set, snapshot }) =>
       (roles: Role[]) => {
         const roleIds = roles.map((role) => role.id);
         set(settingsRoleIdsState, roleIds);
         roles.forEach((role) => {
+          const persistedRole = getSnapshotValue(
+            snapshot,
+            settingsPersistedRoleFamilyState(role.id),
+          );
+          if (isDeeplyEqual(role, persistedRole)) {
+            return;
+          }
           set(settingsDraftRoleFamilyState(role.id), role);
           set(settingsPersistedRoleFamilyState(role.id), role);
         });