add role update (#11217)

## Context
This PR introduces the new Create and Edit role components, behind the
PERMISSIONS_ENABLED_V2 feature flag.

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

@@ -0,0 +1,40 @@
+import { SETTINGS_ROLE_DETAIL_TABS } from '@/settings/roles/role/constants/SettingsRoleDetailTabs';
+import { settingsDraftRoleFamilyState } from '@/settings/roles/states/settingsDraftRoleFamilyState';
+import { settingsPersistedRoleFamilyState } from '@/settings/roles/states/settingsPersistedRoleFamilyState';
+import { activeTabIdComponentState } from '@/ui/layout/tab/states/activeTabIdComponentState';
+import { useSetRecoilComponentStateV2 } from '@/ui/utilities/state/component-state/hooks/useSetRecoilComponentStateV2';
+import { useEffect, useState } from 'react';
+import { useRecoilValue, useSetRecoilState } from 'recoil';
+import { isDefined } from 'twenty-shared/utils';
+
+type SettingsRoleEditEffectProps = {
+  roleId: string;
+};
+
+export const SettingsRoleEditEffect = ({
+  roleId,
+}: SettingsRoleEditEffectProps) => {
+  const [isInitialized, setIsInitialized] = useState(false);
+
+  const role = useRecoilValue(settingsPersistedRoleFamilyState(roleId));
+  const setDraftRole = useSetRecoilState(settingsDraftRoleFamilyState(roleId));
+  const setActiveTabId = useSetRecoilComponentStateV2(
+    activeTabIdComponentState,
+    SETTINGS_ROLE_DETAIL_TABS.COMPONENT_INSTANCE_ID,
+  );
+
+  useEffect(() => {
+    if (isInitialized) {
+      return;
+    }
+
+    setActiveTabId(SETTINGS_ROLE_DETAIL_TABS.TABS_IDS.ASSIGNMENT);
+
+    if (isDefined(role)) {
+      setDraftRole(role);
+      setIsInitialized(true);
+    }
+  }, [isInitialized, role, setActiveTabId, setDraftRole]);
+
+  return <></>;
+};