18123: Add optional disabled prop to active checkbox.
[arvados-workbench2.git] / src / views-components / data-explorer / renderers.tsx
index 5040746ad53266795642a873306ea791ef48eff5..11752a5a6ae4b1c4956e7bbde04b73f3e44039dd 100644 (file)
@@ -188,11 +188,12 @@ export const ResourceEmail = connect(
         return resource || { email: '' };
     })(renderEmail);
 
-const renderIsActive = (props: { uuid: string, kind: ResourceKind, isActive: boolean, toggleIsActive: (uuid: string) => void }) => {
+const renderIsActive = (props: { uuid: string, kind: ResourceKind, isActive: boolean, toggleIsActive: (uuid: string) => void, disabled?: boolean }) => {
     if (props.kind === ResourceKind.USER) {
         return <Checkbox
             color="primary"
             checked={props.isActive}
+            disabled={!!props.disabled}
             onClick={() => props.toggleIsActive(props.uuid)} />;
     } else {
         return <Typography />;
@@ -200,41 +201,41 @@ const renderIsActive = (props: { uuid: string, kind: ResourceKind, isActive: boo
 }
 
 export const ResourceIsActive = connect(
-    (state: RootState, props: { uuid: string }) => {
+    (state: RootState, props: { uuid: string, disabled?: boolean }) => {
         const resource = getResource<UserResource>(props.uuid)(state.resources);
-        return resource || { isActive: false, kind: ResourceKind.NONE };
+        return resource ? {...resource, disabled: !!props.disabled} : { isActive: false, kind: ResourceKind.NONE };
     }, { toggleIsActive }
 )(renderIsActive);
 
 export const ResourceLinkTailIsActive = connect(
-    (state: RootState, props: { uuid: string }) => {
+    (state: RootState, props: { uuid: string, disabled?: boolean }) => {
         const link = getResource<LinkResource>(props.uuid)(state.resources);
         const tailResource = getResource<UserResource>(link?.tailUuid || '')(state.resources);
 
-        return tailResource || { isActive: false, kind: ResourceKind.NONE };
+        return tailResource ? {...tailResource, disabled: !!props.disabled} : { isActive: false, kind: ResourceKind.NONE };
     }, { toggleIsActive }
 )(renderIsActive);
 
 const renderIsHidden = (props: {
                             memberLinkUuid: string,
                             permissionLinkUuid: string,
-                            hidden: boolean,
+                            visible: boolean,
                             canManage: boolean,
                             setMemberIsHidden: (memberLinkUuid: string, permissionLinkUuid: string, hide: boolean) => void 
                         }) => {
     if (props.memberLinkUuid) {
         return <Checkbox
-                data-cy="user-hidden-checkbox"
+                data-cy="user-visible-checkbox"
                 color="primary"
-                checked={props.hidden}
+                checked={props.visible}
                 disabled={!props.canManage}
-                onClick={() => props.setMemberIsHidden(props.memberLinkUuid, props.permissionLinkUuid, !props.hidden)} />;
+                onClick={() => props.setMemberIsHidden(props.memberLinkUuid, props.permissionLinkUuid, !props.visible)} />;
     } else {
         return <Typography />;
     }
 }
 
-export const ResourceLinkTailIsHidden = connect(
+export const ResourceLinkTailIsVisible = connect(
     (state: RootState, props: { uuid: string }) => {
         const link = getResource<LinkResource>(props.uuid)(state.resources);
         const member = getResource<Resource>(link?.tailUuid || '')(state.resources);
@@ -252,8 +253,8 @@ export const ResourceLinkTailIsHidden = connect(
         const isBuiltin = isBuiltinGroup(link?.headUuid || '');
 
         return member?.kind === ResourceKind.USER
-            ? { memberLinkUuid: link?.uuid, permissionLinkUuid, hidden: !isVisible, canManage: !isBuiltin }
-            : { memberLinkUuid: '', permissionLinkUuid: '', hidden: false, canManage: false };
+            ? { memberLinkUuid: link?.uuid, permissionLinkUuid, visible: isVisible, canManage: !isBuiltin }
+            : { memberLinkUuid: '', permissionLinkUuid: '', visible: false, canManage: false };
     }, { setMemberIsHidden }
 )(renderIsHidden);
 
@@ -463,7 +464,7 @@ const renderPermissionLevel = (dispatch: Dispatch, link: LinkResource, canManage
     return <Typography noWrap>
         {formatPermissionLevel(link.name as PermissionLevel)}
         {canManage ?
-            <IconButton onClick={(event) => dispatch<any>(openPermissionEditContextMenu(event, link))}>
+            <IconButton data-cy="edit-permission-button" onClick={(event) => dispatch<any>(openPermissionEditContextMenu(event, link))}>
                 <RenameIcon />
             </IconButton> :
             ''