Workspace - Red dot stays if added offline incorrect number removed by Remove button

[kbecciv]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Action Performed:

1. Go to https://staging.new.expensify.com/
   and login
2. Go to Workspace \ Manage members
3. Switch offline
4. Add incorrect number as member (it is displayed grey)
5. Close workspace settings
6. Switch online
7. Red dot appears near account avatar, workspace and members
8. Go to workspace \ Manage members
9. Mark checkbox near greyed number
   10 Click Remove

Expected Result:

Red dot should disappear across the app

Actual Result:

Red dot stays if added offline incorrect number removed by Remove button

Workaround:

Unknown

Platform:

Where is this issue occurring?

• Web
• iOS
• Android
• Desktop App
• Mobile Web

Version Number: 1.2.31.7

Reproducible in staging?: Yes

Reproducible in production?: Yes

Email or phone of affected tester (no customers):

Logs: https://stackoverflow.com/c/expensify/questions/4856

Notes/Photos/Videos: Any additional supporting documentation

Bug5835672_video_18.mp4

Expensify/Expensify Issue URL:

Issue reported by: Applause - Internal Team

Slack conversation:

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @miljakljajic (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[s77rt]

Proposal

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index 6ff197f4f5..952247274a 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -152,11 +152,11 @@ class WorkspaceMembersPage extends React.Component {
      * Toggle user from the selectedEmployees list
      *
      * @param {String} login
-     * @param {String} pendingAction
+     * @param {String} role
      *
      */
-    toggleUser(login, pendingAction) {
-        if (this.willTooltipShowForLogin(login) || pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE) {
+    toggleUser(login, role) {
+        if (this.willTooltipShowForLogin(login) || !role) {
             return;
         }
 
@@ -258,20 +258,20 @@ class WorkspaceMembersPage extends React.Component {
                 <Hoverable onHoverIn={() => this.willTooltipShowForLogin(item.login, true)} onHoverOut={() => this.setState({showTooltipForLogin: ''})}>
                     <TouchableOpacity
                         style={[styles.peopleRow, !item.errors && styles.peopleRowBorderBottom, !canBeRemoved && styles.cursorDisabled]}
-                        onPress={() => this.toggleUser(item.login, item.pendingAction)}
+                        onPress={() => this.toggleUser(item.login, item.role)}
                         activeOpacity={0.7}
                     >
                         <CheckboxWithTooltip
                             style={[styles.peopleRowCell]}
                             isChecked={_.contains(this.state.selectedEmployees, item.login)}
                             disabled={!canBeRemoved}
-                            onPress={() => this.toggleUser(item.login, item.pendingAction)}
+                            onPress={() => this.toggleUser(item.login, item.role)}
                             toggleTooltip={this.state.showTooltipForLogin === item.login}
                             text={this.props.translate('workspace.people.error.cannotRemove')}
                         />
                         <View style={styles.flex1}>
                             <OptionRow
-                                onSelectRow={() => this.toggleUser(item.login, item.pendingAction)}
+                                onSelectRow={() => this.toggleUser(item.login, item.role)}
                                 forceTextUnreadStyle
                                 isDisabled={!canBeRemoved}
                                 option={{

Details

You shouldn't be able to remove a user that has a pendingAction equal to add.
In the current code, you are only not allowed to remove a user that has a pendingAction equal to delete.
The obvious fix is to check that the user does not have either pendingActions.

The better fix is to make sure the user have the role prop.

[melvin-bot]

@miljakljajic Whoops! This issue is 2 days overdue. Let's get this updated quick!

[miljakljajic]

Thank you for the proposa, @s77rt

I was able to reproduce this:

Adding the engineering triage label to confirm if we can have this worked on externally (and review @s77rt 's proposal if so), I'll then create an upwork job.

[melvin-bot]

Triggered auto assignment to @francoisl (Engineering), see https://stackoverflow.com/c/expensify/questions/4319 for more details.

[francoisl]

👍 I can reproduce. I'll take care of this internally, the fix might even have to be done in the backend.

[francoisl]

Ah sorry, I didn't see the proposal above from @s77rt at first. I'll look into this a bit more and post an update here.