chore(Groups): now we can add and remove group members via UI [#634]

ytsaurus · Nov 20, 2024 · bef88eb · bef88eb
1 parent a782aab
commit bef88eb
Show file tree

Hide file tree

Showing 4 changed files with 62 additions and 17 deletions.
diff --git a/packages/ui/src/shared/yt-types.d.ts b/packages/ui/src/shared/yt-types.d.ts
@@ -236,12 +236,12 @@ export interface RemoveMaintenanceParams extends AddMaintenanceParams {
     mine: boolean;
 }
 
-export interface AddMembersParams {
+export interface AddMembersParams extends BaseBatchParams {
     group: string;
     member: string;
 }
 
-export interface RemoveMembersParams {
+export interface RemoveMembersParams extends BaseBatchParams {
     group: string;
     member: string;
 }

diff --git a/packages/ui/src/ui/store/actions/groups.ts b/packages/ui/src/ui/store/actions/groups.ts
@@ -24,7 +24,6 @@ import type {OrderType} from '../../utils/sort-helpers';
 import type {RootState} from '../../store/reducers';
 import type {Subject} from '../../utils/acl/acl-types';
 import {deleteGroupModalSlice} from '../../store/reducers/groups/delete-group';
-import type {WithAttrs} from '../../utils/cypress-attributes';
 
 // Table
 
@@ -102,14 +101,28 @@ export function openGroupEditorModal(groupName = '') {
         dispatch({type: GROUP_EDITOR_ACTION.REQUEST});
 
         const path = `//sys/groups/${groupName}`;
+
+        let idmDataPromise;
+
+        if (UIFactory.getAclApi().isAllowed) {
+            idmDataPromise = UIFactory.getAclApi().getGroupAcl(getCluster(state), groupName)
+        } else {
+            idmDataPromise = Promise.resolve();
+        }
+
         return Promise.all([
             ytApiV3Id.get(YTApiId.groupsEditData, {path, attributes: GROUP_ATTRIBUTES}),
-            UIFactory.getAclApi().getGroupAcl(getCluster(state), groupName),
+            idmDataPromise,
         ])
-            .then(([data, idmData]) => {
+            .then(([groupsData, idmData]) => {
+                const data = {
+                    data: groupsData,
+                    ...( idmData ? {idmData} : {})
+                };
+
                 return dispatch({
                     type: GROUP_EDITOR_ACTION.SUCCESS,
-                    data: {data, idmData},
+                    data,
                 });
             })
             .catch((error) => {
@@ -300,7 +313,9 @@ function changeGroupMembers({groupname, usersToAdd, usersToRemove}: ChangeGroupM
 
     const requests = [...requestsToAdd, ...requestsToRemove];
 
-    return ytApiV3.executeBatch<WithAttrs<{compression_codec?: string; erasure_codec?: string}>>({
+    // TODO: fix types
+    // @ts-ignore
+    return ytApiV3.executeBatch({
         requests,
     });
 }
diff --git a/packages/ui/src/ui/store/reducers/groups/editor.ts b/packages/ui/src/ui/store/reducers/groups/editor.ts
@@ -4,9 +4,14 @@ import {GROUP_EDITOR_ACTION, GROUP_EDITOR_ACTION_DATA_FIELDS} from '../../../con
 import type {Action} from 'redux';
 import type {ActionD, YTError} from '../../../types';
 import type {PreparedRole} from '../../../utils/acl';
+import type { FlagType } from '../../../utils';
 
 type EditorDataType = {
-    $attributes?: Record<string, string>;
+    $attributes?: {
+        member_of: string[];
+        members: string[];
+        upravlyator_managed?: FlagType;
+    };
 };
 
 type IDMDataType = {

diff --git a/packages/ui/src/ui/store/selectors/groups.ts b/packages/ui/src/ui/store/selectors/groups.ts
@@ -12,6 +12,8 @@ import hammer from '../../common/hammer';
 import {FlagType, flags} from '../../utils';
 import type {RootState} from '../../store/reducers';
 import type {Group} from '../../store/reducers/groups/table';
+import { isIdmAclAvailable } from '../../config';
+import type { PreparedRole } from '../../utils/acl';
 
 // Table
 
@@ -144,7 +146,7 @@ export const getGroupsFlattenTree = createSelector(
 );
 
 // Editor
-export const getGroupEditorData = (state: RootState) => state.groups.editor;
+export const getGroupEditorData = (state: RootState) => state.groups.editor.data;
 export const getGroupEditorVisible = (state: RootState) => state.groups.editor.showModal;
 export const getGroupEditorGroupName = (state: RootState) => state.groups.editor.groupName;
 // eslint-disable-next-line camelcase
@@ -166,12 +168,35 @@ export const getGroupEditorSubjects = createSelector([getGroupEditorIdmData], (i
     };
 });
 
-export const getGroupEditorRoles = createSelector([getGroupEditorIdmData], (idmData) => {
-    const {
-        group: {members, responsible},
-    } = idmData;
+export const getGroupEditorRoles = createSelector([getGroupEditorIdmData, getGroupEditorData], (idmData, data): {
+    responsible: PreparedRole[];
+    members: PreparedRole[];
+} => {
+    if (isIdmAclAvailable()) {
+        const {
+            group: {members, responsible},
+        } = idmData;
+
+        return {
+            responsible,
+            members,
+        };
+    }
+
+    const members = data.$attributes?.members || [];
+
     return {
-        responsible,
-        members,
-    };
-});
+        responsible: [],
+        members: members.map(member => {
+            return {
+                text: member,
+                value: member,
+                state: "granted",
+                role_type: "member",
+                subject: {
+                    user: member,
+                },
+            };
+        }),
+    };    
+});