Feature #18123

Group edit page

Added by Peter Amstutz 8 months ago. Updated about 2 months ago.

Status:
Resolved
Priority:
Normal
Assigned To:
Category:
Workbench2
Target version:
Start date:
12/02/2021
Due date:
% Done:

100%

Estimated time:
(Total: 0.00 h)
Story points:
-
Release relationship:
Auto

Description

  • Add "Groups" to the left hand navigation tree which displays the existing "Groups" list panel
  • When user clicks on an entry in the "Groups" list, they are presented with a panel with two tabs, "Members" and "Permissions"
  • The "Members" tab consists of a list of users and groups
    • Membership is defined as having a permission link with "tail" of some user or other group and "head" being the selected group
    • Clicking on a user or group navigates to the panel for that user or group
    • An "Add member" button uses the "sharing" dialog to select users or groups to add to the group
    • Displays Name, username, UUID, email
    • Should be able to sort by any of those columns
    • Option to search/filter by substring would be nice to have
    • Members that are other groups are group name only
    • When adding a member, also select the permission level that is granted
    • Additional column with for "maximum permission" to display/change the maximum permission level the user gets on items shared with the group
    • When adding a member, normally a read permission link is create going from the selected group (tail) to the member (head). If this this read link is not present, it is a "hidden user"
    • Action menu has a "Remove" item (maybe simplify to just an [x] or trash can icon and no popup menu?)
  • The "Permissions" tab consists of a list of projects, membership of the group grants these permissions on these projects
    • Each row displays name of group
    • Option to search/filter by substring would be nice to have
    • Each row has control to displays/change granted permission
    • Button to add permission for a project, opens project chooser, only displays projects that the user has "manage" access
    • Button to remove permission that deletes permission link
    • Click on project to navigate to project page
  • Should be usable by both regular users and admins
    • Regular users must have "manage" access on the group to be able to add members, otherwise they get a read-only display
    • Regular users can use "add permission" for any project that they have "manage" access
    • Regular users can delete permission only for projects they have "manage" access
    • Admins have unrestricted ability to edit membership and permissions
group editing.mov (15.4 MB) group editing.mov Lucas Di Pentima, 11/09/2021 11:32 PM

Subtasks

Task #18157: Review 18123-group-edit-page-rebase1ResolvedStephen Smith


Related issues

Related to Arvados Epics - Story #16946: WB2 user/group management featuresResolved08/01/202103/31/2022

Associated revisions

Revision 58db72fe
Added by Stephen Smith 5 months ago

Merge branch '18123-group-edit-page-rebase1' into main. Closes #18123

Arvados-DCO-1.1-Signed-off-by: Stephen Smith <>

History

#1 Updated by Peter Amstutz 8 months ago

  • Description updated (diff)
  • Subject changed from Group members page to Group edit page

#2 Updated by Peter Amstutz 8 months ago

  • Target version set to 2021-09-29 sprint

#3 Updated by Peter Amstutz 8 months ago

  • Assigned To set to Stephen Smith

#4 Updated by Stephen Smith 8 months ago

  • Status changed from New to In Progress

#5 Updated by Peter Amstutz 8 months ago

  • Target version changed from 2021-09-29 sprint to 2021-10-13 sprint

#6 Updated by Peter Amstutz 7 months ago

  • Target version changed from 2021-10-13 sprint to 2021-10-27 sprint

#7 Updated by Peter Amstutz 7 months ago

  • Target version changed from 2021-10-27 sprint to 2021-11-10 sprint

#8 Updated by Stephen Smith 6 months ago

Changes on branch 18123-group-edit-page-2 / f4654fd69770c860e464535c9d2ed51f3338a6cc

I'm having issues initializing the group rename dialog redux form with the existing group name. In groups-panel-actions.ts line 88 I initialize the existing group name and the group UUID into the form so that renameGroup can update the group. The form in /src/views-components/dialog-forms/rename-group-dialog.tsx doesn't seem to receive the initial form value though I'm doing things similarly to the edit permission level dialog.

Relevant snippets:
From groups-panel-actions

export interface RenameGroupFormData {
    [RENAME_GROUP_UUID_FIELD_NAME]: string;
    [RENAME_GROUP_NAME_FIELD_NAME]: string;
}

export const openRenameGroupDialog = (uuid: string) =>
    (dispatch: Dispatch, getState: () => RootState) => {
        const group = getResource<GroupResource>(uuid)(getState().resources);

        if (group) {
            const formData: RenameGroupFormData = {[RENAME_GROUP_UUID_FIELD_NAME]: group.uuid, [RENAME_GROUP_NAME_FIELD_NAME]: group.name};
            console.log("Initialize form: ", formData);
            dispatch(reset(RENAME_GROUP_FORM));
            dispatch<any>(initialize(RENAME_GROUP_FORM, formData));
            dispatch(dialogActions.OPEN_DIALOG({ id: RENAME_GROUP_DIALOG, data: group }));
        }
    };

export const renameGroup = (data: RenameGroupFormData) =>
    async (dispatch: Dispatch, getState: () => RootState, { groupsService }: ServiceRepository) => {
        console.log("RenameGroupFormData", data);
        await groupsService.update(data[RENAME_GROUP_UUID_FIELD_NAME], { name: data[RENAME_GROUP_NAME_FIELD_NAME] });
        dispatch(dialogActions.CLOSE_DIALOG({ id: RENAME_GROUP_DIALOG }));
        dispatch(snackbarActions.OPEN_SNACKBAR({ message: 'Renamed.', hideDuration: 2000, kind: SnackbarKind.SUCCESS }));
    };

From rename-group-dialog:

export const RenameGroupDialog = compose(
    withDialog(RENAME_GROUP_DIALOG),
    reduxForm<RenameGroupFormData>({
        form: RENAME_GROUP_DIALOG,
        // touchOnChange: true,
        onSubmit: (data: RenameGroupFormData, dispatch: Dispatch) => {
            console.log(data);
            // dispatch<any>(renameGroup(data));
        }
    })
)((props: RenameGroupDialogProps) =>
    <FormDialog
        dialogTitle='Rename'
        formFields={RenameGroupFormFields}
        submitLabel='Ok'
        {...props}
    />);

interface RenameGroupDataProps {
    data: GroupResource;
}

type RenameGroupDialogProps = RenameGroupDataProps & WithDialogProps<{}> & InjectedFormProps<RenameGroupFormData>;

const RenameGroupFormFields = (props: RenameGroupDialogProps) => {
    // console.log(props);
    return <>
        <DialogContentText>
            {`Please enter a new name for ${props.data.name}`}
        </DialogContentText>
        <Field
            name={RENAME_GROUP_NAME_FIELD_NAME}
            component={TextField as any}
            autoFocus={true}
            validate={RENAME_FILE_VALIDATION}
        />
        {/* <WarningCollection text="Renaming a file will change the collection's content address." /> */}
    </>;
}

#9 Updated by Lucas Di Pentima 6 months ago

Haven't looked at the code yet, but I was able to use the "edit group" dialog that allows renaming, have you seen how that works?

#10 Updated by Stephen Smith 6 months ago

Thanks that helps me narrow down the issue - I didn't realize the breadcrumbs are right clickable.

I tried swapping out my dialog with the project edit dialog, and after finding out that for some reason the execute functions in group-action-set pass in an object with an empty name string:

{
    name: "Rename",
    icon: RenameIcon,
    execute: (dispatch, resource) => {
        // resource.name is empty string in group-action-set.ts
    }
}

{
    icon: RenameIcon,
    name: "Edit project",
    execute: (dispatch, resource) => {
        // resource.name is populated in project-action-set.ts
    }
}

As a workaround I dispatch my openRenameGroupDialog with just the uuid then get the whole object from the store, then dispatch openProjectUpdateDialog) it seems to pass the data correctly when I do this as well as renaming working (besides lack of reloading the table and an error about the project dialog not being open) so I think there's something wrong with my dialog / redux form.

diff --git a/src/store/groups-panel/groups-panel-actions.ts b/src/store/groups-panel/groups-panel-actions.ts
index 9c9f15cf..5714547b 100644
--- a/src/store/groups-panel/groups-panel-actions.ts
+++ b/src/store/groups-panel/groups-panel-actions.ts
@@ -16,6 +16,7 @@ import { snackbarActions, SnackbarKind } from 'store/snackbar/snackbar-actions';
 import { PermissionLevel } from 'models/permission';
 import { PermissionService } from 'services/permission-service/permission-service';
 import { FilterBuilder } from 'services/api/filter-builder';
+import { openProjectUpdateDialog } from 'store/projects/project-update-actions';

 export const GROUPS_PANEL_ID = "groupsPanel";

@@ -82,12 +83,15 @@ export const openRenameGroupDialog = (uuid: string) =>
         const group = getResource<GroupResource>(uuid)(getState().resources);

         if (group) {
-            const formData: RenameGroupFormData = {[RENAME_GROUP_UUID_FIELD_NAME]: group.uuid, [RENAME_GROUP_NAME_FIELD_NAME]: group.name};
-            console.log("Initialize form: ", formData);
-            dispatch(reset(RENAME_GROUP_FORM));
-            dispatch<any>(initialize(RENAME_GROUP_FORM, formData));
-            dispatch(dialogActions.OPEN_DIALOG({ id: RENAME_GROUP_DIALOG, data: group }));
+            dispatch<any>(openProjectUpdateDialog(group));
         }
+        // if (group) {
+        //     const formData: RenameGroupFormData = {[RENAME_GROUP_UUID_FIELD_NAME]: group.uuid, [RENAME_GROUP_NAME_FIELD_NAME]: group.name};
+        //     console.log("Initialize form: ", formData);
+        //     dispatch(reset(RENAME_GROUP_FORM));
+        //     dispatch<any>(initialize(RENAME_GROUP_FORM, formData));
+        //     dispatch(dialogActions.OPEN_DIALOG({ id: RENAME_GROUP_DIALOG, data: group }));
+        // }
     };

I'll look into it more

#11 Updated by Peter Amstutz 6 months ago

  • Target version changed from 2021-11-10 sprint to 2021-11-24 sprint

#12 Updated by Peter Amstutz 6 months ago

  • Target version changed from 2021-11-24 sprint to 2021-12-08 sprint

#13 Updated by Stephen Smith 6 months ago

Changes at arvados-workbench2|5ea93d2e3c077f9cad78f8176a903ced7ceea62e branch 18123-group-edit-page-rebase1
Tests: developer-tests-workbench2: #524

Current limitations / omissions:
  • Without the permissions API, the control-disabling logic for the members tab uses writableBy, which is not exactly correct since it should be manageableBy / can manage
  • Outgoing permissions can't easily checked for permissions also without the permissions API, so they are just available and return an error
  • There is no add permission dialog, so adding permissions must be done using the sharing dialog of an resource
  • Non-admin users cannot see the group's links even with read permissions on the objects

#14 Updated by Peter Amstutz 6 months ago

18123-group-edit-page-rebase1 @ arvados-workbench2|5ea93d2e3c077f9cad78f8176a903ced7ceea62e

Groups

  • "Groups" in the left nav tree needs a different icon than the generic folder
  • The "New group" dialog box has an "enter email address" field but not a place to write a description. The "New group" dialog should use the same code as the "Edit" dialog for renaming groups.
  • The "Edit" dialog says "Edit project" instead of "Edit group". (It should use the same "Edit project" dialog code, just add a parameter to set the title).

Members tab

  • "Members" has too many columns, the remove button is scrolled off the screen. We should either prune some columns and/or add a menu that lets you toggle individual columns.
    • The "Email" column seems to be redundant with the "Name" column which is also displaying the email address
    • I don't know if having the user UUID in a column is necessary (and it takes up a lot of horizontal space)
  • Instead of "Member hidden", suggest calling it "Visible to other members" and flip the checkbox state (so visible is checked and hidden is unchecked).
  • The link on the "name" column goes to the user's home project. It would be better if this went to a page that displays the user's profile. However, that page doesn't exist yet, so we will follow up in a different ticket.
  • The "User active" checkbox should should either be made read-only in all cases, or the column removed entirely. We don't want to activate/deactivate users through this particular UI.
  • The "Add user" dialog is functionally almost the same as the "sharing" dialog (but the sharing dialog has more features). Could you use the sharing dialog instead? (you might have to add a couple of options to tweak the dialog contents but that should still be simpler than duplicating the functionality).
  • The "Name" column says "Project: ..." when the member is actually a role group (in that case it should say "Group: ...").

Permissions tab

  • It is listing "read" permission to users who are members of the group. This is a bit confusing, and is already captured by the "member hidden / visible to other members" checkbox. Read links to users who are also group members should should be hidden.

#15 Updated by Peter Amstutz 6 months ago

  • Related to Story #16946: WB2 user/group management features added

#16 Updated by Peter Amstutz 6 months ago

  • Target version changed from 2021-12-08 sprint to 2022-01-05 sprint

#17 Updated by Stephen Smith 5 months ago

Changes at arvados-workbench2|7bf8014027507777a91a0266cf37beaa9841a2d1 18123-group-edit-page-rebase1
Tests: developer-tests-workbench2: #544

  • Changed groups icon to fontawesome users icon
  • New group now uses the edit project dialog * Added users entry field when creating group
  • Title of create/edit group/project reflects project or group
  • Removed email and uuid from member list table
  • Inverted logic and renamed hidden/visible control
  • User active now read only
  • Add user uses sharing dialog
  • Fixed incorrect labeling of group members
  • Skipped hiding read permissions for visible members due to pagination coming from the api

#18 Updated by Peter Amstutz 5 months ago

Stephen Smith wrote:

Changes at arvados-workbench2|7bf8014027507777a91a0266cf37beaa9841a2d1 18123-group-edit-page-rebase1
Tests: developer-tests-workbench2: #544

one thing to address:

  • There's a field below "Project Name" that says "Enter email addresses" which makes me think I am setting an email address for the whole group or something, not that it is a way to add members. Can you change it to say something like "Search for users to add to the group"

Additional thoughts:

  • I noticed that when you add users, by default it doesn't add back links (allowing the group to see individual members). I think that is probably fine, we have been going in the direction of making all users and role groups visible by default, so you don't need group membership to be able to see other users. I appreciate making the checkbox represent "visible" instead of "hidden", it makes that detail more evident.
  • I skimmed through the code, looks good, nothing jumped out at me

#20 Updated by Stephen Smith 5 months ago

  • Status changed from In Progress to Resolved

#21 Updated by Peter Amstutz about 2 months ago

  • Release changed from 31 to 46

Also available in: Atom PDF