import { useState, useEffect } from 'react' import PropTypes from 'prop-types' import { Trans, useTranslation } from 'react-i18next' import { useShareProjectContext } from './share-project-modal' import TransferOwnershipModal from './transfer-ownership-modal' import { removeMemberFromProject, updateMember } from '../utils/api' import { Button, Col, Form, FormControl, FormGroup } from 'react-bootstrap' import Tooltip from '../../../shared/components/tooltip' import Icon from '../../../shared/components/icon' import { useProjectContext } from '../../../shared/context/project-context' export default function EditMember({ member }) { const [privileges, setPrivileges] = useState(member.privileges) const [confirmingOwnershipTransfer, setConfirmingOwnershipTransfer] = useState(false) // update the local state if the member's privileges change externally useEffect(() => { setPrivileges(member.privileges) }, [member.privileges]) const { updateProject, monitorRequest } = useShareProjectContext() const { _id: projectId, members } = useProjectContext() function handleSubmit(event) { event.preventDefault() if (privileges === 'owner') { setConfirmingOwnershipTransfer(true) } else { monitorRequest(() => updateMember(projectId, member, { privilegeLevel: privileges, }) ).then(() => { updateProject({ members: members.map(item => item._id === member._id ? { ...item, privileges } : item ), }) }) } } if (confirmingOwnershipTransfer) { return ( setConfirmingOwnershipTransfer(false)} /> ) } return (
{member.email} setPrivileges(event.target.value)} /> {privileges === member.privileges ? ( ) : ( setPrivileges(member.privileges)} /> )}
) } EditMember.propTypes = { member: PropTypes.shape({ _id: PropTypes.string.isRequired, email: PropTypes.string.isRequired, privileges: PropTypes.string.isRequired, }), } function SelectPrivilege({ value, handleChange }) { const { t } = useTranslation() return ( ) } SelectPrivilege.propTypes = { value: PropTypes.string.isRequired, handleChange: PropTypes.func.isRequired, } function RemoveMemberAction({ member }) { const { t } = useTranslation() const { updateProject, monitorRequest } = useShareProjectContext() const { _id: projectId, members } = useProjectContext() function handleClick(event) { event.preventDefault() monitorRequest(() => removeMemberFromProject(projectId, member)).then( () => { updateProject({ members: members.filter(existing => existing !== member), }) } ) } return ( } overlayProps={{ placement: 'bottom' }} > ) } RemoveMemberAction.propTypes = { member: PropTypes.shape({ _id: PropTypes.string.isRequired, email: PropTypes.string.isRequired, privileges: PropTypes.string.isRequired, }), } function ChangePrivilegesActions({ handleReset }) { return (
 
) } ChangePrivilegesActions.propTypes = { handleReset: PropTypes.func.isRequired, }