From 15a90b1021fc073220c5090f066ec0ffe782111f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Ska=C5=82ka?= <michal.skalka@swmansion.com>
Date: Fri, 26 May 2023 12:55:59 +0200
Subject: [PATCH 1/2] migrate WorkspaceMembersPage to PressableWithFeedback

---
 src/pages/workspace/WorkspaceMembersPage.js | 21 +++++++++++++++------
 1 file changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index c9d6deab2b0e..0d87033ed7f5 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import _ from 'underscore';
 import lodashGet from 'lodash/get';
-import {View, TouchableOpacity} from 'react-native';
+import {View} from 'react-native';
 import PropTypes from 'prop-types';
 import {withOnyx} from 'react-native-onyx';
 import styles from '../../styles/styles';
@@ -34,6 +34,7 @@ import TextInput from '../../components/TextInput';
 import KeyboardDismissingFlatList from '../../components/KeyboardDismissingFlatList';
 import withCurrentUserPersonalDetails from '../../components/withCurrentUserPersonalDetails';
 import * as PolicyUtils from '../../libs/PolicyUtils';
+import PressableWithFeedback from '../../components/Pressable/PressableWithFeedback';
 
 const propTypes = {
     /** The personal details of the person who is logged in */
@@ -318,6 +319,7 @@ class WorkspaceMembersPage extends React.Component {
      * @returns {React.Component}
      */
     renderItem({item}) {
+        const isChecked = _.contains(this.state.selectedEmployees, item.login);
         return (
             <OfflineWithFeedback
                 errorRowStyles={[styles.peopleRowBorderBottom]}
@@ -325,18 +327,25 @@ class WorkspaceMembersPage extends React.Component {
                 pendingAction={item.pendingAction}
                 errors={item.errors}
             >
-                <TouchableOpacity
+                <PressableWithFeedback
                     style={[styles.peopleRow, (_.isEmpty(item.errors) || this.state.errors[item.login]) && styles.peopleRowBorderBottom]}
                     onPress={() => this.toggleUser(item.login, item.pendingAction)}
-                    activeOpacity={0.7}
+                    accessibilityRole="checkbox"
+                    accessibilityState={{
+                        checked: isChecked,
+                    }}
+                    accessibilityLabel={this.props.formatPhoneNumber(item.displayName)}
+                    // disable hover style when disabled
+                    hoverDimmingValue={1}
+                    pressDimmingValue={0.7}
                 >
                     <Checkbox
-                        isChecked={_.contains(this.state.selectedEmployees, item.login)}
+                        isChecked={isChecked}
                         onPress={() => this.toggleUser(item.login, item.pendingAction)}
                     />
                     <View style={styles.flex1}>
                         <OptionRow
-                            onSelectRow={() => this.toggleUser(item.login, item.pendingAction)}
+                            isDisabled
                             boldStyle
                             option={{
                                 text: this.props.formatPhoneNumber(item.displayName),
@@ -358,7 +367,7 @@ class WorkspaceMembersPage extends React.Component {
                             <Text style={[styles.peopleBadgeText]}>{this.props.translate('common.admin')}</Text>
                         </View>
                     )}
-                </TouchableOpacity>
+                </PressableWithFeedback>
                 {!_.isEmpty(this.state.errors[item.login]) && (
                     <FormHelpMessage
                         isError

From f229aa8e48f34711f2ecdad118f2f105549b03b2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Ska=C5=82ka?= <michal.skalka@swmansion.com>
Date: Mon, 29 May 2023 11:52:04 +0200
Subject: [PATCH 2/2] fixed comment

---
 src/pages/workspace/WorkspaceMembersPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceMembersPage.js b/src/pages/workspace/WorkspaceMembersPage.js
index 0d87033ed7f5..cd86874f56e9 100644
--- a/src/pages/workspace/WorkspaceMembersPage.js
+++ b/src/pages/workspace/WorkspaceMembersPage.js
@@ -335,7 +335,7 @@ class WorkspaceMembersPage extends React.Component {
                         checked: isChecked,
                     }}
                     accessibilityLabel={this.props.formatPhoneNumber(item.displayName)}
-                    // disable hover style when disabled
+                    // disable hover dimming
                     hoverDimmingValue={1}
                     pressDimmingValue={0.7}
                 >