diff --git a/src/Collections/CollectionMembers.tsx b/src/Collections/CollectionMembers.tsx index a839700..dc08448 100644 --- a/src/Collections/CollectionMembers.tsx +++ b/src/Collections/CollectionMembers.tsx @@ -9,6 +9,7 @@ import { List, ListItem } from "../widgets/List"; import IconMemberAdd from "@material-ui/icons/PersonAdd"; import VisibilityIcon from "@material-ui/icons/Visibility"; +import AdminIcon from "@material-ui/icons/SupervisedUserCircle"; import AppBarOverride from "../widgets/AppBarOverride"; import Container from "../widgets/Container"; @@ -28,13 +29,15 @@ interface PropsType { export default function CollectionMembers(props: PropsType) { const etebase = useCredentials()!; - const [members_, setMembers] = React.useState(); - const [revokeUser, setRevokeUser] = React.useState(null); + const [members, setMembers] = React.useState(); + const [revokeUser, setRevokeUser] = React.useState(null); const [addMemberOpen, setAddMemberOpen] = React.useState(false); const [error, setError] = React.useState(); const { collection, metadata } = props.collection; + const revokeUserIsAdmin = revokeUser?.accessLevel === Etebase.CollectionAccessLevel.Admin; + async function fetchMembers() { const colMgr = getCollectionManager(etebase); const memberManager = colMgr.getMemberManager(collection); @@ -62,14 +65,10 @@ export default function CollectionMembers(props: PropsType) { fetchMembers(); }, []); - function onRevokeRequest(user: string) { - setRevokeUser(user); - } - async function onRevokeDo() { const colMgr = getCollectionManager(etebase); const memberManager = colMgr.getMemberManager(collection); - await memberManager.remove(revokeUser!); + await memberManager.remove(revokeUser!.username); await fetchMembers(); setRevokeUser(null); } @@ -81,8 +80,6 @@ export default function CollectionMembers(props: PropsType) { setAddMemberOpen(false); } - const members = members_?.filter((x) => x.username !== etebase.user.username); - return ( <> @@ -98,15 +95,23 @@ export default function CollectionMembers(props: PropsType) { Invite user {(members.length > 0 ? - members.map((member) => ( - onRevokeRequest(member.username)} - rightIcon={(member.accessLevel === Etebase.CollectionAccessLevel.ReadOnly) ? () : undefined} - > - {member.username} - - )) + members.map((member) => { + let rightIcon: React.ReactElement | undefined = undefined; + if (member.accessLevel === Etebase.CollectionAccessLevel.ReadOnly) { + rightIcon = (
); + } else if (member.accessLevel === Etebase.CollectionAccessLevel.Admin) { + rightIcon = (
); + } + return ( + setRevokeUser(member)} + rightIcon={rightIcon} + > + {member.username} + + ); + }) : No members @@ -121,11 +126,19 @@ export default function CollectionMembers(props: PropsType) { title="Remove member" labelOk="OK" open={revokeUser !== null} - onOk={onRevokeDo} + onOk={(revokeUserIsAdmin) ? () => setRevokeUser(null) : onRevokeDo} onCancel={() => setRevokeUser(null)} > - Would you like to revoke {revokeUser}'s access?
- Please be advised that a malicious user would potentially be able to retain access to encryption keys. Please refer to the FAQ for more information. + {(revokeUserIsAdmin) ? ( +

+ Revoking admin access is not allowed. +

+ ) : ( +

+ Would you like to revoke {revokeUser?.username}'s access?
+ Please be advised that a malicious user would potentially be able to retain access to encryption keys. Please refer to the FAQ for more information. +

+ )} {addMemberOpen &&