diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js index cf8b8d03a34..e6ffaaa14aa 100644 --- a/src/pages/workspace/WorkspaceMembersPage.js +++ b/src/pages/workspace/WorkspaceMembersPage.js @@ -24,7 +24,6 @@ import personalDetailsPropType from '../personalDetailsPropType'; import withWindowDimensions, {windowDimensionsPropTypes} from '../../components/withWindowDimensions'; import OptionRow from '../../components/OptionRow'; import CheckboxWithTooltip from '../../components/CheckboxWithTooltip'; -import Hoverable from '../../components/Hoverable'; import withPolicy, {policyPropTypes, policyDefaultProps} from './withPolicy'; import CONST from '../../CONST'; import OfflineWithFeedback from '../../components/OfflineWithFeedback'; @@ -156,7 +155,7 @@ class WorkspaceMembersPage extends React.Component { * */ toggleUser(login, pendingAction) { - if (this.willTooltipShowForLogin(login) || pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE) { + if (pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE) { return; } @@ -170,37 +169,6 @@ class WorkspaceMembersPage extends React.Component { this.setState({showTooltipForLogin: ''}); } - /** - * Shows the tooltip for non removable members - * - * @param {String} login - * @param {Boolean} wasHovered - * @returns {Boolean} Return true if the tooltip was displayed so we can use the state of it in other functions. - */ - willTooltipShowForLogin(login, wasHovered = false) { - const isSmallOrMediumScreen = this.props.isSmallScreenWidth || this.props.isMediumScreenWidth; - - // Small screens only show the tooltip on press, so ignore hovered event on those cases. - if (wasHovered && isSmallOrMediumScreen) { - return false; - } - - const canBeRemoved = this.props.policy.owner !== login && this.props.session.email !== login; - if (!canBeRemoved) { - this.setState({ - showTooltipForLogin: login, - }, () => { - // Immediately reset the login to deactivate the tooltip trigger, otherwise, the tooltip will not open again on further interactions on small screens. - if (!isSmallOrMediumScreen) { - return; - } - this.setState({showTooltipForLogin: ''}); - }); - } - - return !canBeRemoved; - } - /** * Add user from the selectedEmployees list * @@ -253,45 +221,44 @@ class WorkspaceMembersPage extends React.Component { item, }) { // const canBeRemoved = this.props.policy.owner !== item.login && this.props.session.email !== item.login && item.pendingAction !== CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE; + // const canBeRemoved = this.props.policy.owner !== login && this.props.session.email !== login; return ( this.dismissError(item)} pendingAction={item.pendingAction} errors={item.errors}> - this.willTooltipShowForLogin(item.login, true)} onHoverOut={() => this.setState({showTooltipForLogin: ''})}> - this.toggleUser(item.login, item.pendingAction)} + activeOpacity={0.7} + > + this.toggleUser(item.login, item.pendingAction)} - activeOpacity={0.7} - > - this.toggleUser(item.login, item.pendingAction)} - toggleTooltip={this.state.showTooltipForLogin === item.login} - text={this.props.translate('workspace.people.error.cannotRemove')} + toggleTooltip={this.state.showTooltipForLogin === item.login} + text={this.props.translate('workspace.people.error.cannotRemove')} + /> + + this.toggleUser(item.login, item.pendingAction)} + boldStyle + option={{ + text: Str.removeSMSDomain(item.displayName), + alternateText: Str.removeSMSDomain(item.login), + participantsList: [item], + icons: [item.avatar], + keyForList: item.login, + }} /> - - this.toggleUser(item.login, item.pendingAction)} - boldStyle - option={{ - text: Str.removeSMSDomain(item.displayName), - alternateText: Str.removeSMSDomain(item.login), - participantsList: [item], - icons: [item.avatar], - keyForList: item.login, - }} - /> - - {(this.props.session.email === item.login || item.role === 'admin') && ( - - - - {this.props.translate('common.admin')} - - + + {(this.props.session.email === item.login || item.role === 'admin') && ( + + + + {this.props.translate('common.admin')} + - )} - - + + )} + ); }