From 1512c35d5f251ddd20c26a277319ff7b390ce61e Mon Sep 17 00:00:00 2001
From: rayane-djouah <77965000+rayane-djouah@users.noreply.github.com>
Date: Thu, 29 Feb 2024 16:54:35 +0100
Subject: [PATCH 1/5] Fix: Workspace - Member and Role can be clicked to select
 all the members in Members list

---
 .../SelectionList/BaseSelectionList.tsx       | 43 ++++++++++---------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx
index 1c69d00b3910..843c7ee1fc28 100644
--- a/src/components/SelectionList/BaseSelectionList.tsx
+++ b/src/components/SelectionList/BaseSelectionList.tsx
@@ -429,28 +429,31 @@ function BaseSelectionList<TItem extends ListItem>(
                         ) : (
                             <>
                                 {!headerMessage && canSelectMultiple && shouldShowSelectAll && (
-                                    <PressableWithFeedback
-                                        style={[styles.peopleRow, styles.userSelectNone, styles.ph4, styles.pb3, listHeaderWrapperStyle]}
-                                        onPress={selectAllRow}
-                                        accessibilityLabel={translate('workspace.people.selectAll')}
-                                        role="button"
-                                        accessibilityState={{checked: flattenedSections.allSelected}}
-                                        disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
-                                        dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
-                                        onMouseDown={shouldPreventDefaultFocusOnSelectRow ? (e) => e.preventDefault() : undefined}
-                                    >
-                                        <Checkbox
-                                            accessibilityLabel={translate('workspace.people.selectAll')}
-                                            isChecked={flattenedSections.allSelected}
+                                    <View style={[styles.peopleRow, styles.ph4, styles.pb3, listHeaderWrapperStyle]}>
+                                        <PressableWithFeedback
+                                            style={[styles.userSelectNone, styles.flexRow, styles.alignItemsCenter]}
                                             onPress={selectAllRow}
+                                            accessibilityLabel={translate('workspace.people.selectAll')}
+                                            role="button"
+                                            accessibilityState={{checked: flattenedSections.allSelected}}
                                             disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
-                                        />
-                                        {customListHeader ?? (
-                                            <View style={[styles.flex1]}>
-                                                <Text style={[styles.textStrong, styles.ph3]}>{translate('workspace.people.selectAll')}</Text>
-                                            </View>
-                                        )}
-                                    </PressableWithFeedback>
+                                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
+                                            onMouseDown={shouldPreventDefaultFocusOnSelectRow ? (e) => e.preventDefault() : undefined}
+                                        >
+                                            <Checkbox
+                                                accessibilityLabel={translate('workspace.people.selectAll')}
+                                                isChecked={flattenedSections.allSelected}
+                                                onPress={selectAllRow}
+                                                disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
+                                            />
+                                            {!customListHeader ? (
+                                                <View style={[styles.flex1]}>
+                                                    <Text style={[styles.textStrong, styles.ph3]}>{translate('workspace.people.selectAll')}</Text>
+                                                </View>
+                                            ) : null}
+                                        </PressableWithFeedback>
+                                        {customListHeader}
+                                    </View>
                                 )}
                                 {!headerMessage && !canSelectMultiple && customListHeader}
                                 <SectionList

From c4205502e9c039f5c6a4825052a51b18c1100150 Mon Sep 17 00:00:00 2001
From: rayane-djouah <77965000+rayane-djouah@users.noreply.github.com>
Date: Thu, 29 Feb 2024 20:39:56 +0100
Subject: [PATCH 2/5] Fix: Category - Checkbox is clickable outside near the
 right of checkbox

---
 src/components/SelectionList/BaseListItem.tsx | 2 +-
 src/styles/utils/index.ts                     | 1 -
 2 files changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/components/SelectionList/BaseListItem.tsx b/src/components/SelectionList/BaseListItem.tsx
index 98b1999625ee..5ea451c12f11 100644
--- a/src/components/SelectionList/BaseListItem.tsx
+++ b/src/components/SelectionList/BaseListItem.tsx
@@ -79,7 +79,7 @@ function BaseListItem<TItem extends ListItem>({
                                     accessibilityLabel={item.text}
                                     role={CONST.ROLE.BUTTON}
                                     onPress={handleCheckboxPress}
-                                    style={StyleUtils.getCheckboxPressableStyle()}
+                                    style={[StyleUtils.getCheckboxPressableStyle(), styles.mr3]}
                                 >
                                     <View style={selectMultipleStyle}>
                                         {item.isSelected && (
diff --git a/src/styles/utils/index.ts b/src/styles/utils/index.ts
index 72719e4795c4..5470d976eafe 100644
--- a/src/styles/utils/index.ts
+++ b/src/styles/utils/index.ts
@@ -1481,7 +1481,6 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
     getFullscreenCenteredContentStyles: () => [StyleSheet.absoluteFill, styles.justifyContentCenter, styles.alignItemsCenter],
 
     getMultiselectListStyles: (isSelected: boolean, isDisabled: boolean): ViewStyle => ({
-        ...styles.mr3,
         ...(isSelected && styles.checkedContainer),
         ...(isSelected && styles.borderColorFocus),
         ...(isDisabled && styles.cursorDisabled),

From 94452f5d83510bf6dec19be805d2a0b1e492ca2c Mon Sep 17 00:00:00 2001
From: rayane-djouah <77965000+rayane-djouah@users.noreply.github.com>
Date: Mon, 4 Mar 2024 01:24:19 +0100
Subject: [PATCH 3/5] line up checkboxes

---
 src/components/SelectionList/BaseSelectionList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx
index 4e19cba00b2f..cde7eb775f23 100644
--- a/src/components/SelectionList/BaseSelectionList.tsx
+++ b/src/components/SelectionList/BaseSelectionList.tsx
@@ -433,7 +433,7 @@ function BaseSelectionList<TItem extends ListItem>(
                         ) : (
                             <>
                                 {!headerMessage && canSelectMultiple && shouldShowSelectAll && (
-                                    <View style={[styles.userSelectNone, styles.peopleRow, styles.ph4, styles.pb3, listHeaderWrapperStyle]}>
+                                    <View style={[styles.userSelectNone, styles.peopleRow, styles.ph5, styles.pb3, listHeaderWrapperStyle]}>
                                         <PressableWithFeedback
                                             style={[styles.userSelectNone, styles.flexRow, styles.alignItemsCenter]}
                                             onPress={selectAllRow}

From 7431057cdc96d6509f91d47bb8cc99670f63a79c Mon Sep 17 00:00:00 2001
From: rayane-djouah <77965000+rayane-djouah@users.noreply.github.com>
Date: Wed, 13 Mar 2024 20:06:32 +0100
Subject: [PATCH 4/5] fix
 https://github.com/Expensify/App/pull/37521/#issuecomment-1987648277

---
 src/components/SelectionList/BaseSelectionList.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx
index 99c10550b552..308124e14e73 100644
--- a/src/components/SelectionList/BaseSelectionList.tsx
+++ b/src/components/SelectionList/BaseSelectionList.tsx
@@ -452,7 +452,7 @@ function BaseSelectionList<TItem extends ListItem>(
                                                 disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
                                             />
                                             {!customListHeader ? (
-                                                <View style={[styles.flex1]}>
+                                                <View>
                                                     <Text style={[styles.textStrong, styles.ph3]}>{translate('workspace.people.selectAll')}</Text>
                                                 </View>
                                             ) : null}

From 669099756dc09345a4415495f168604f7df9d2bb Mon Sep 17 00:00:00 2001
From: rayane-djouah <77965000+rayane-djouah@users.noreply.github.com>
Date: Wed, 13 Mar 2024 20:53:45 +0100
Subject: [PATCH 5/5] fix
 https://github.com/Expensify/App/pull/37521/#issuecomment-1987640167

---
 .../SelectionList/BaseSelectionList.tsx       | 30 +++++++++----------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/SelectionList/BaseSelectionList.tsx b/src/components/SelectionList/BaseSelectionList.tsx
index 76afb85e588e..fafbcf9b4f80 100644
--- a/src/components/SelectionList/BaseSelectionList.tsx
+++ b/src/components/SelectionList/BaseSelectionList.tsx
@@ -512,28 +512,28 @@ function BaseSelectionList<TItem extends ListItem>(
                             <>
                                 {!headerMessage && canSelectMultiple && shouldShowSelectAll && (
                                     <View style={[styles.userSelectNone, styles.peopleRow, styles.ph5, styles.pb3, listHeaderWrapperStyle]}>
-                                        <PressableWithFeedback
-                                            style={[styles.userSelectNone, styles.flexRow, styles.alignItemsCenter]}
-                                            onPress={selectAllRow}
-                                            accessibilityLabel={translate('workspace.people.selectAll')}
-                                            role="button"
-                                            accessibilityState={{checked: flattenedSections.allSelected}}
-                                            disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
-                                            dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
-                                            onMouseDown={shouldPreventDefaultFocusOnSelectRow ? (e) => e.preventDefault() : undefined}
-                                        >
+                                        <View style={[styles.flexRow, styles.alignItemsCenter]}>
                                             <Checkbox
                                                 accessibilityLabel={translate('workspace.people.selectAll')}
                                                 isChecked={flattenedSections.allSelected}
                                                 onPress={selectAllRow}
                                                 disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
                                             />
-                                            {!customListHeader ? (
-                                                <View>
+                                            {!customListHeader && (
+                                                <PressableWithFeedback
+                                                    style={[styles.userSelectNone, styles.flexRow, styles.alignItemsCenter]}
+                                                    onPress={selectAllRow}
+                                                    accessibilityLabel={translate('workspace.people.selectAll')}
+                                                    role="button"
+                                                    accessibilityState={{checked: flattenedSections.allSelected}}
+                                                    disabled={flattenedSections.allOptions.length === flattenedSections.disabledOptionsIndexes.length}
+                                                    dataSet={{[CONST.SELECTION_SCRAPER_HIDDEN_ELEMENT]: true}}
+                                                    onMouseDown={shouldPreventDefaultFocusOnSelectRow ? (e) => e.preventDefault() : undefined}
+                                                >
                                                     <Text style={[styles.textStrong, styles.ph3]}>{translate('workspace.people.selectAll')}</Text>
-                                                </View>
-                                            ) : null}
-                                        </PressableWithFeedback>
+                                                </PressableWithFeedback>
+                                            )}
+                                        </View>
                                         {customListHeader}
                                     </View>
                                 )}