Skip to content

Commit 7514614

Browse files
grgiaOSBotify
authored andcommitted
Merge pull request #86555 from Expensify/revert-83799-@zfurtak/change-select-icons
[CP Staging] Revert "Enhance icons UI consistency" (cherry picked from commit a0adf62) (cherry-picked to staging by grgia)
1 parent 9bbb263 commit 7514614

187 files changed

Lines changed: 1054 additions & 923 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

src/components/AddPaymentCard/PaymentCardChangeCurrencyForm.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import InputWrapper from '@components/Form/InputWrapper';
66
import type {FormInputErrors, FormOnyxValues} from '@components/Form/types';
77
import MenuItemWithTopDescription from '@components/MenuItemWithTopDescription';
88
import SelectionList from '@components/SelectionList';
9-
import SingleSelectListItem from '@components/SelectionList/ListItem/SingleSelectListItem';
9+
import RadioListItem from '@components/SelectionList/ListItem/RadioListItem';
1010
import TextInput from '@components/TextInput';
1111
import useLocalize from '@hooks/useLocalize';
1212
import usePermissions from '@hooks/usePermissions';
@@ -132,12 +132,14 @@ function PaymentCardChangeCurrencyForm({changeBillingCurrency, isSecurityCodeReq
132132
<View style={[styles.mh5, styles.flexGrow1]}>
133133
<SelectionList
134134
data={currencyOptions}
135-
ListItem={SingleSelectListItem}
135+
ListItem={RadioListItem}
136136
onSelectRow={(option) => {
137137
selectCurrency(option.value);
138138
}}
139139
style={{containerStyle: styles.mhn5}}
140+
initiallyFocusedItemKey={currency}
140141
customListHeader={<PaymentCardCurrencyHeader isSectionList />}
142+
shouldStopPropagation
141143
/>
142144
</View>
143145
);

src/components/AddPaymentCard/PaymentCardCurrencyModal.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton';
44
import Modal from '@components/Modal';
55
import ScreenWrapper from '@components/ScreenWrapper';
66
import SelectionList from '@components/SelectionList';
7-
import SingleSelectListItem from '@components/SelectionList/ListItem/SingleSelectListItem';
7+
import RadioListItem from '@components/SelectionList/ListItem/RadioListItem';
88
import useLocalize from '@hooks/useLocalize';
99
import useThemeStyles from '@hooks/useThemeStyles';
1010
import Navigation from '@libs/Navigation/Navigation';
@@ -67,10 +67,11 @@ function PaymentCardCurrencyModal({isVisible, currencies, currentCurrency = CONS
6767
/>
6868
<SelectionList
6969
data={currencyOptions}
70-
ListItem={SingleSelectListItem}
70+
ListItem={RadioListItem}
7171
onSelectRow={(option) => {
7272
onCurrencyChange(option.value);
7373
}}
74+
initiallyFocusedItemKey={currentCurrency}
7475
showScrollIndicator
7576
/>
7677
</ScreenWrapper>

src/components/AddPlaidBankAccount.tsx

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -251,11 +251,9 @@ function AddPlaidBankAccount({
251251

252252
return (
253253
<FullPageOfflineBlockingView>
254-
<Text style={[styles.mh5, styles.mb3, styles.textHeadlineLineHeightXXL]}>
255-
{translate(isDisplayedInWalletFlow ? 'walletPage.chooseYourBankAccount' : 'bankAccount.chooseAnAccount')}
256-
</Text>
257-
{!!text && <Text style={[styles.mh5, styles.mb6, styles.textSupporting]}>{text}</Text>}
258-
<View style={[styles.mh5, styles.flexRow, styles.alignItemsCenter, styles.mb6]}>
254+
<Text style={[styles.mb3, styles.textHeadlineLineHeightXXL]}>{translate(isDisplayedInWalletFlow ? 'walletPage.chooseYourBankAccount' : 'bankAccount.chooseAnAccount')}</Text>
255+
{!!text && <Text style={[styles.mb6, styles.textSupporting]}>{text}</Text>}
256+
<View style={[styles.flexRow, styles.alignItemsCenter, styles.mb6]}>
259257
<Icon
260258
src={icon}
261259
height={iconSize}
@@ -269,12 +267,12 @@ function AddPlaidBankAccount({
269267
)}
270268
</View>
271269
</View>
272-
<Text style={[styles.textLabelSupporting, styles.mh5]}>{`${translate('bankAccount.chooseAnAccountBelow')}:`}</Text>
270+
<Text style={[styles.textLabelSupporting]}>{`${translate('bankAccount.chooseAnAccountBelow')}:`}</Text>
273271
<RadioButtons
274272
items={options}
275273
defaultCheckedValue={defaultSelectedPlaidAccountID}
276274
onPress={handleSelectingPlaidAccount}
277-
radioButtonStyle={[styles.optionRowCompact, styles.ph5]}
275+
radioButtonStyle={[styles.mb6]}
278276
/>
279277
<FormHelpMessage message={errorText} />
280278
</FullPageOfflineBlockingView>

src/components/ApproverSelectionList.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -168,7 +168,6 @@ function ApproverSelectionList({
168168
shouldUpdateFocusedIndex={shouldUpdateFocusedIndex}
169169
showScrollIndicator
170170
isRowMultilineSupported
171-
shouldShowRadioButton
172171
/>
173172
</FullPageNotFoundView>
174173
</ScreenWrapper>

src/components/BaseVacationDelegateSelectionComponent.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,6 @@ function BaseVacationDelegateSelectionComponent({
187187
onEndReached={onListEndReached}
188188
shouldSingleExecuteRowSelect
189189
shouldShowTextInput
190-
shouldShowRadioButton
191190
/>
192191
</View>
193192
)}

src/components/CategoryPicker.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ import {getHeaderMessageForNonUserList} from '@libs/OptionsListUtils';
1111
import CONST from '@src/CONST';
1212
import ONYXKEYS from '@src/ONYXKEYS';
1313
import {isEmptyObject} from '@src/types/utils/EmptyObject';
14-
import SingleSelectListItem from './SelectionList/ListItem/SingleSelectListItem';
14+
import RadioListItem from './SelectionList/ListItem/RadioListItem';
1515
import SelectionListWithSections from './SelectionList/SelectionListWithSections';
1616
import type {ListItem} from './SelectionList/types';
1717

@@ -80,7 +80,7 @@ function CategoryPicker({selectedCategory, policyID, onSubmit, addBottomSafeArea
8080
<SelectionListWithSections
8181
sections={sections}
8282
onSelectRow={onSubmit}
83-
ListItem={SingleSelectListItem}
83+
ListItem={RadioListItem}
8484
shouldShowTextInput={categoriesCount >= CONST.STANDARD_LIST_ITEM_LIMIT}
8585
textInputOptions={textInputOptions}
8686
initiallyFocusedItemKey={selectedOptionKey}

src/components/CountryPicker/CountrySelectorModal.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton';
33
import Modal from '@components/Modal';
44
import ScreenWrapper from '@components/ScreenWrapper';
55
import SelectionList from '@components/SelectionList';
6-
import SingleSelectListItem from '@components/SelectionList/ListItem/SingleSelectListItem';
6+
import RadioListItem from '@components/SelectionList/ListItem/RadioListItem';
77
import useDebouncedState from '@hooks/useDebouncedState';
88
import useLocalize from '@hooks/useLocalize';
99
import useThemeStyles from '@hooks/useThemeStyles';
@@ -90,7 +90,7 @@ function CountrySelectorModal({isVisible, currentCountry, onCountrySelected, onC
9090
data={searchResults}
9191
textInputOptions={textInputOptions}
9292
onSelectRow={onCountrySelected}
93-
ListItem={SingleSelectListItem}
93+
ListItem={RadioListItem}
9494
initiallyFocusedItemKey={currentCountry}
9595
shouldSingleExecuteRowSelect
9696
shouldStopPropagation

src/components/CurrencySelectionList/index.tsx

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import {Str} from 'expensify-common';
22
import React, {useState} from 'react';
3-
import SingleSelectListItem from '@components/SelectionList/ListItem/SingleSelectListItem';
3+
import RadioListItem from '@components/SelectionList/ListItem/RadioListItem';
44
import SelectionListWithSections from '@components/SelectionList/SelectionListWithSections';
55
import {useCurrencyListActions, useCurrencyListState} from '@hooks/useCurrencyList';
66
import useLocalize from '@hooks/useLocalize';
7-
import useThemeStyles from '@hooks/useThemeStyles';
87
import getMatchScore from '@libs/getMatchScore';
98
import {isEmptyObject} from '@src/types/utils/EmptyObject';
109
import type {CurrencyListItem, CurrencySelectionListProps} from './types';
@@ -23,7 +22,6 @@ function CurrencySelectionList({
2322
const {getCurrencySymbol} = useCurrencyListActions();
2423
const [searchValue, setSearchValue] = useState('');
2524
const {translate} = useLocalize();
26-
const styles = useThemeStyles();
2725
const getUnselectedOptions = (options: CurrencyListItem[]) => options.filter((option) => !option.isSelected);
2826

2927
const currencyOptions: CurrencyListItem[] = Object.entries(currencyList).reduce((acc, [currencyCode, currencyInfo]) => {
@@ -103,11 +101,8 @@ function CurrencySelectionList({
103101
// eslint-disable-next-line react/jsx-props-no-spreading
104102
{...restProps}
105103
sections={sections}
106-
ListItem={SingleSelectListItem}
104+
ListItem={RadioListItem}
107105
onSelectRow={onSelect}
108-
style={{
109-
listItemWrapperStyle: styles.optionRow,
110-
}}
111106
textInputOptions={textInputOptions}
112107
shouldShowTextInput={!!searchInputLabel}
113108
shouldSingleExecuteRowSelect

src/components/DatePicker/CalendarPicker/YearPickerModal.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import HeaderWithBackButton from '@components/HeaderWithBackButton';
44
import Modal from '@components/Modal';
55
import ScreenWrapper from '@components/ScreenWrapper';
66
import SelectionList from '@components/SelectionList';
7-
import SingleSelectListItem from '@components/SelectionList/ListItem/SingleSelectListItem';
7+
import RadioListItem from '@components/SelectionList/ListItem/RadioListItem';
88
import useLocalize from '@hooks/useLocalize';
99
import useThemeStyles from '@hooks/useThemeStyles';
1010
import CONST from '@src/CONST';
@@ -81,7 +81,7 @@ function YearPickerModal({isVisible, years, currentYear = new Date().getFullYear
8181
/>
8282
<SelectionList
8383
data={data}
84-
ListItem={SingleSelectListItem}
84+
ListItem={RadioListItem}
8585
onSelectRow={(option) => {
8686
Keyboard.dismiss();
8787
onYearChange?.(option.value);

src/components/DestinationPicker.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import type {Destination} from '@libs/PerDiemRequestUtils';
1010
import {getPerDiemCustomUnit} from '@libs/PolicyUtils';
1111
import CONST from '@src/CONST';
1212
import ONYXKEYS from '@src/ONYXKEYS';
13-
import SingleSelectListItem from './SelectionList/ListItem/SingleSelectListItem';
13+
import RadioListItem from './SelectionList/ListItem/RadioListItem';
1414
import SelectionListWithSections from './SelectionList/SelectionListWithSections';
1515
import type {ListItem, SelectionListWithSectionsHandle} from './SelectionList/types';
1616

@@ -80,7 +80,7 @@ function DestinationPicker({selectedDestination, policyID, onSubmit, ref}: Desti
8080
shouldShowTextInput={shouldShowTextInput}
8181
textInputOptions={textInputOptions}
8282
onSelectRow={onSubmit}
83-
ListItem={SingleSelectListItem}
83+
ListItem={RadioListItem}
8484
initiallyFocusedItemKey={selectedOptionKey}
8585
shouldHideKeyboardOnScroll={false}
8686
shouldUpdateFocusedIndex

0 commit comments

Comments
 (0)