Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions src/components/ApproverSelectionList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -159,10 +159,10 @@ function ApproverSelectionList({
canSelectMultiple={allowMultipleSelection}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
listEmptyContent={listEmptyContent}
showListEmptyContent={shouldShowListEmptyContent}
shouldShowListEmptyContent={shouldShowListEmptyContent}
initiallyFocusedItemKey={initiallyFocusedOptionKey}
shouldShowTextInput={shouldShowTextInput}
showLoadingPlaceholder={shouldShowLoadingPlaceholder}
shouldShowLoadingPlaceholder={shouldShowLoadingPlaceholder}
footerContent={footerContent}
addBottomSafeAreaPadding
shouldUpdateFocusedIndex={shouldUpdateFocusedIndex}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@ function BaseVacationDelegateSelectionComponent({
onSelectRow(item);
}}
textInputOptions={textInputOptions}
showLoadingPlaceholder={!areOptionsInitialized}
shouldShowLoadingPlaceholder={!areOptionsInitialized}
isLoadingNewOptions={!!isSearchingForReports}
onEndReached={onListEndReached}
shouldSingleExecuteRowSelect
Expand Down
2 changes: 1 addition & 1 deletion src/components/CurrencySelectionList/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ function CurrencySelectionList({
shouldShowTextInput={!!searchInputLabel}
shouldSingleExecuteRowSelect
initiallyFocusedItemKey={initiallySelectedCurrencyCode}
showLoadingPlaceholder={!didScreenTransitionEnd}
shouldShowLoadingPlaceholder={!didScreenTransitionEnd}
/>
);
}
Expand Down
2 changes: 1 addition & 1 deletion src/components/MoneyRequestConfirmationList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -1353,7 +1353,7 @@ function MoneyRequestConfirmationList({
onSelectRow={navigateToParticipantPage}
shouldSingleExecuteRowSelect
shouldPreventDefaultFocusOnSelectRow
showListEmptyContent={false}
shouldShowListEmptyContent={false}
footerContent={footerContent}
listFooterContent={listFooterContent}
style={selectionListStyle}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -126,7 +126,7 @@ function SingleSelectPopup<T extends string>({label, value, items, closeOverlay,
textInputOptions={textInputOptions}
shouldUpdateFocusedIndex={isSearchable}
initiallyFocusedItemKey={isSearchable ? value?.value : undefined}
showLoadingPlaceholder={!noResultsFound}
shouldShowLoadingPlaceholder={!noResultsFound}
/>
</View>
<View style={[styles.flexRow, styles.gap2, styles.ph5]}>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Search/SearchAutocompleteList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -355,7 +355,7 @@
}, [autocompleteQueryWithoutFilters, debounceHandleSearch]);

/* Sections generation */
const sections: Array<Section<AutocompleteListItem>> = [];

Check warning on line 358 in src/components/Search/SearchAutocompleteList.tsx

View workflow job for this annotation

GitHub Actions / ESLint check

The 'sections' array makes the dependencies of useEffect Hook (at line 440) change on every render. To fix this, wrap the initialization of 'sections' in its own useMemo() Hook

Check warning on line 358 in src/components/Search/SearchAutocompleteList.tsx

View workflow job for this annotation

GitHub Actions / Changed files ESLint check

The 'sections' array makes the dependencies of useEffect Hook (at line 440) change on every render. To fix this, wrap the initialization of 'sections' in its own useMemo() Hook
let sectionIndex = 0;

if (searchQueryItem) {
Expand Down Expand Up @@ -472,7 +472,7 @@

return (
<SelectionListWithSections<AutocompleteListItem>
showLoadingPlaceholder
shouldShowLoadingPlaceholder
sections={sections}
onSelectRow={onListItemPress}
ListItem={SearchRouterItem}
Expand Down
4 changes: 2 additions & 2 deletions src/components/Search/SearchFiltersChatsSelector.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -166,7 +166,7 @@ function SearchFiltersChatsSelector({initialReportIDs, onFiltersUpdate, isScreen
);

const isLoadingNewOptions = !!isSearchingForReports;
const showLoadingPlaceholder = !didScreenTransitionEnd || !areOptionsInitialized || !initialReportIDs || !personalDetails;
const shouldShowLoadingPlaceholder = !didScreenTransitionEnd || !areOptionsInitialized || !initialReportIDs || !personalDetails;

const textInputOptions = {
value: searchTerm,
Expand All @@ -185,7 +185,7 @@ function SearchFiltersChatsSelector({initialReportIDs, onFiltersUpdate, isScreen
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
textInputOptions={textInputOptions}
isLoadingNewOptions={isLoadingNewOptions}
showLoadingPlaceholder={showLoadingPlaceholder}
shouldShowLoadingPlaceholder={shouldShowLoadingPlaceholder}
shouldShowTextInput
/>
);
Expand Down
4 changes: 2 additions & 2 deletions src/components/Search/SearchFiltersParticipantsSelector.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -401,7 +401,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
);

const isLoadingNewOptions = !!isSearchingForReports;
const showLoadingPlaceholder = !didScreenTransitionEnd || !areOptionsInitialized || !initialAccountIDs || !personalDetails;
const shouldShowLoadingPlaceholder = !didScreenTransitionEnd || !areOptionsInitialized || !initialAccountIDs || !personalDetails;

const textInputOptions = useMemo(
() => ({
Expand All @@ -423,7 +423,7 @@ function SearchFiltersParticipantsSelector({initialAccountIDs, onFiltersUpdate,
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
onSelectRow={handleParticipantSelection}
isLoadingNewOptions={isLoadingNewOptions}
showLoadingPlaceholder={showLoadingPlaceholder}
shouldShowLoadingPlaceholder={shouldShowLoadingPlaceholder}
canSelectMultiple
/>
);
Expand Down
2 changes: 1 addition & 1 deletion src/components/Search/SearchMultipleSelectionPicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ function SearchMultipleSelectionPicker({items, initiallySelectedItems, pickerTit
shouldShowTextInput={shouldShowTextInput}
textInputOptions={textInputOptions}
onSelectRow={onSelectItem}
showLoadingPlaceholder={!noResultsFound}
shouldShowLoadingPlaceholder={!noResultsFound}
shouldStopPropagation
shouldShowTooltips
canSelectMultiple
Expand Down
2 changes: 1 addition & 1 deletion src/components/Search/SearchSingleSelectionPicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,7 @@ function SearchSingleSelectionPicker({
shouldShowTextInput={shouldShowTextInput}
textInputOptions={textInputOptions}
footerContent={shouldAutoSave ? undefined : footerContent}
showLoadingPlaceholder={!noResultsFound}
shouldShowLoadingPlaceholder={!noResultsFound}
shouldUpdateFocusedIndex
shouldStopPropagation
/>
Expand Down
12 changes: 6 additions & 6 deletions src/components/SelectionList/BaseSelectionList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -67,8 +67,8 @@ function BaseSelectionList<TItem extends ListItem>({
isLoadingNewOptions,
isRowMultilineSupported = false,
addBottomSafeAreaPadding,
showListEmptyContent = true,
showLoadingPlaceholder,
shouldShowListEmptyContent = true,
shouldShowLoadingPlaceholder,
showScrollIndicator = true,
canSelectMultiple = false,
disableKeyboardShortcuts = false,
Expand Down Expand Up @@ -313,7 +313,7 @@ function BaseSelectionList<TItem extends ListItem>({
dataLength={data.length}
isLoading={isLoadingNewOptions}
onFocusChange={(v: boolean) => (isTextInputFocusedRef.current = v)}
showLoadingPlaceholder={showLoadingPlaceholder}
shouldShowLoadingPlaceholder={shouldShowLoadingPlaceholder}
isLoadingNewOptions={isLoadingNewOptions}
/>
);
Expand Down Expand Up @@ -385,10 +385,10 @@ function BaseSelectionList<TItem extends ListItem>({
};

const renderListEmptyContent = () => {
if (showLoadingPlaceholder) {
if (shouldShowLoadingPlaceholder) {
return customLoadingPlaceholder ?? <OptionsListSkeletonView shouldStyleAsTable={shouldUseUserSkeletonView} />;
}
if (showListEmptyContent) {
if (shouldShowListEmptyContent) {
return listEmptyContent;
}
};
Expand Down Expand Up @@ -507,7 +507,7 @@ function BaseSelectionList<TItem extends ListItem>({
return (
<View style={[styles.flex1, addBottomSafeAreaPadding && !hasFooter && paddingBottomStyle, style?.containerStyle]}>
{textInputComponent({shouldBeInsideList: false})}
{data.length === 0 && (showLoadingPlaceholder || showListEmptyContent) ? (
{data.length === 0 && (shouldShowLoadingPlaceholder || shouldShowListEmptyContent) ? (
renderListEmptyContent()
) : (
<>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -59,8 +59,8 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
addBottomSafeAreaPadding,
isLoadingNewOptions,
canSelectMultiple = false,
showLoadingPlaceholder = false,
showListEmptyContent = true,
shouldShowLoadingPlaceholder = false,
shouldShowListEmptyContent = true,
shouldShowTooltips = true,
disableKeyboardShortcuts = false,
shouldShowTextInput,
Expand Down Expand Up @@ -271,17 +271,17 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
dataLength={flattenedData.length}
isLoading={isLoadingNewOptions}
onFocusChange={(v: boolean) => (isTextInputFocusedRef.current = v)}
showLoadingPlaceholder={showLoadingPlaceholder}
shouldShowLoadingPlaceholder={shouldShowLoadingPlaceholder}
isLoadingNewOptions={isLoadingNewOptions}
/>
);
};

const renderListEmptyContent = () => {
if (showLoadingPlaceholder) {
if (shouldShowLoadingPlaceholder) {
return <OptionsListSkeletonView />;
}
if (showListEmptyContent) {
if (shouldShowListEmptyContent) {
return listEmptyContent;
}
};
Expand Down Expand Up @@ -345,7 +345,7 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
>
{textInputComponent()}
{customHeaderContent}
{itemsCount === 0 && (showLoadingPlaceholder || showListEmptyContent) ? (
{itemsCount === 0 && (shouldShowLoadingPlaceholder || shouldShowListEmptyContent) ? (
renderListEmptyContent()
) : (
<FlashList
Expand Down
6 changes: 3 additions & 3 deletions src/components/SelectionList/components/TextInput.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ type TextInputProps = {
shouldShowTextInput?: boolean;

/** Whether to show the loading placeholder */
showLoadingPlaceholder?: boolean;
shouldShowLoadingPlaceholder?: boolean;

/** Whether to show the loading indicator for new options */
isLoadingNewOptions?: boolean;
Expand All @@ -58,7 +58,7 @@ function TextInput({
onSubmit,
onKeyPress,
onFocusChange,
showLoadingPlaceholder,
shouldShowLoadingPlaceholder,
isLoadingNewOptions,
shouldShowTextInput,
focusTextInput,
Expand All @@ -67,7 +67,7 @@ function TextInput({
const {translate} = useLocalize();
const {label, value, onChangeText, errorText, headerMessage, hint, disableAutoFocus, placeholder, maxLength, inputMode, ref: optionsRef, style, disableAutoCorrect} = options ?? {};
const resultsFound = headerMessage !== translate('common.noResultsFound');
const noData = dataLength === 0 && !showLoadingPlaceholder;
const noData = dataLength === 0 && !shouldShowLoadingPlaceholder;
const shouldShowHeaderMessage = !!headerMessage && (!isLoadingNewOptions || resultsFound || noData);

const focusTimeoutRef = useRef<NodeJS.Timeout | null>(null);
Expand Down
4 changes: 2 additions & 2 deletions src/components/SelectionList/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ type BaseSelectionListProps<TItem extends ListItem> = {
listFooterContent?: React.JSX.Element | null | undefined;

/** Whether to show the loading placeholder */
showLoadingPlaceholder?: boolean;
shouldShowLoadingPlaceholder?: boolean;

/** Component to display on the right side of each item */
rightHandSideComponent?: ((item: TItem, isFocused?: boolean) => ReactElement | null | undefined) | ReactElement | null;
Expand Down Expand Up @@ -65,7 +65,7 @@ type BaseSelectionListProps<TItem extends ListItem> = {
listEmptyContent?: React.JSX.Element | null | undefined;

/** Whether to show the empty list content */
showListEmptyContent?: boolean;
shouldShowListEmptyContent?: boolean;

/** Whether to add bottom safe area padding */
addBottomSafeAreaPadding?: boolean;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
footerContentAbovePagination,
listEmptyContent,
showScrollIndicator = true,
showLoadingPlaceholder = false,
shouldShowLoadingPlaceholder = false,
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think changing it here makes sense, we'll be removing this file in a week

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@zfurtak I agree, but if since it's gonna be removed anyway, any changes to it doesn't matter that much. Reverting those changes'd be a waste of time as much as applying them.

LoadingPlaceholderComponent = OptionsListSkeletonView,
showConfirmButton = false,
isConfirmButtonDisabled = false,
Expand Down Expand Up @@ -735,7 +735,7 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
};

const renderListEmptyContent = () => {
if (showLoadingPlaceholder) {
if (shouldShowLoadingPlaceholder) {
return (
<LoadingPlaceholderComponent
fixedNumItems={fixedNumItemsForLoader}
Expand Down Expand Up @@ -1019,7 +1019,7 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
);

const headerMessageContent = () =>
(!isLoadingNewOptions || headerMessage !== translate('common.noResultsFound') || (flattenedSections.allOptions.length === 0 && !showLoadingPlaceholder)) &&
(!isLoadingNewOptions || headerMessage !== translate('common.noResultsFound') || (flattenedSections.allOptions.length === 0 && !shouldShowLoadingPlaceholder)) &&
!!headerMessage && (
<View style={headerMessageStyle ?? [styles.ph5, styles.pb5]}>
<Text style={[styles.textLabel, styles.colorMuted, styles.minHeight5]}>{headerMessage}</Text>
Expand Down Expand Up @@ -1047,7 +1047,7 @@ function BaseSelectionListWithSections<TItem extends ListItem>({
{/* This is misleading because we might be in the process of loading fresh options from the server. */}
{!shouldShowHeaderMessageAfterHeader && headerMessageContent()}
{!!headerContent && headerContent}
{flattenedSections.allOptions.length === 0 && (showLoadingPlaceholder || shouldShowListEmptyContent) ? (
{flattenedSections.allOptions.length === 0 && (shouldShowLoadingPlaceholder || shouldShowListEmptyContent) ? (
renderListEmptyContent()
) : (
<>
Expand Down
2 changes: 1 addition & 1 deletion src/components/SelectionListWithSections/types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -929,7 +929,7 @@ type SelectionListProps<TItem extends ListItem> = Partial<ChildrenProps> & {
showScrollIndicator?: boolean;

/** Whether to show the loading placeholder */
showLoadingPlaceholder?: boolean;
shouldShowLoadingPlaceholder?: boolean;

/** The component to show when the list is loading */
LoadingPlaceholderComponent?: React.ComponentType<LoadingPlaceholderComponentProps>;
Expand Down
2 changes: 1 addition & 1 deletion src/components/WorkspaceMembersSelectionList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ function WorkspaceMembersSelectionList({policyID, selectedApprover, setApprover}
ListItem={InviteMemberListItem}
onSelectRow={(approver) => setApprover(approver.login)}
textInputOptions={textInputOptions}
showLoadingPlaceholder={!didScreenTransitionEnd}
shouldShowLoadingPlaceholder={!didScreenTransitionEnd}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
disableMaintainingScrollPosition
addBottomSafeAreaPadding
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/useFilteredOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ type UseFilteredOptionsResult = {
*
* <SelectionList
* sections={isLoading ? [] : sections}
* showLoadingPlaceholder={isLoading}
* shouldShowLoadingPlaceholder={isLoading}
* />
*/
function useFilteredOptions(config: UseFilteredOptionsConfig = {}): UseFilteredOptionsResult {
Expand Down
2 changes: 1 addition & 1 deletion src/hooks/usePersonalDetailOptions.ts
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ const filterReportAttributes = (reportAttributes: OnyxEntry<ReportAttributesDeri
*
* <SelectionList
* sections={isLoading ? [] : sections}
* showLoadingPlaceholder={isLoading}
* shouldShowLoadingPlaceholder={isLoading}
* />
*/
function usePersonalDetailOptions(config: UseFilteredOptionsConfig = {}): UseFilteredOptionsResult {
Expand Down
2 changes: 1 addition & 1 deletion src/pages/InviteReportParticipantsPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -202,7 +202,7 @@ function InviteReportParticipantsPage({report}: InviteReportParticipantsPageProp
shouldShowTextInput
textInputOptions={textInputOptions}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
showLoadingPlaceholder={!areOptionsInitialized || !didScreenTransitionEnd}
shouldShowLoadingPlaceholder={!areOptionsInitialized || !didScreenTransitionEnd}
footerContent={footerContent}
onEndReached={onListEndReached}
/>
Expand Down
2 changes: 1 addition & 1 deletion src/pages/NewChatPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -498,7 +498,7 @@ function NewChatPage({ref}: NewChatPageProps) {
onConfirm={(e, option) => (selectedOptions.length > 0 ? createGroup() : selectOption(option))}
rightHandSideComponent={itemRightSideComponent}
footerContent={footerContent}
showLoadingPlaceholder={!areOptionsInitialized}
shouldShowLoadingPlaceholder={!areOptionsInitialized}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
isLoadingNewOptions={!!isSearchingForReports || isLoadingMore}
onEndReached={handleEndReached}
Expand Down
2 changes: 1 addition & 1 deletion src/pages/NewReportWorkspaceSelectionPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -275,7 +275,7 @@ function NewReportWorkspaceSelectionPage({route}: NewReportWorkspaceSelectionPag
ListItem={UserListItem}
onSelectRow={selectPolicy}
textInputOptions={textInputOptions}
showLoadingPlaceholder={fetchStatus.status === 'loading' || !didScreenTransitionEnd}
shouldShowLoadingPlaceholder={fetchStatus.status === 'loading' || !didScreenTransitionEnd}
/>
</>
)}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -254,7 +254,7 @@ function BaseOnboardingWorkspaceInvite({shouldUseNativeStyles}: BaseOnboardingWo
ListItem={InviteMemberListItem}
onSelectRow={toggleSelection}
shouldShowTextInput
showLoadingPlaceholder={!areOptionsInitialized || !didScreenTransitionEnd}
shouldShowLoadingPlaceholder={!areOptionsInitialized || !didScreenTransitionEnd}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
style={{
sectionTitleStyles: onboardingIsMediumOrLargerScreenWidth ? styles.ph3 : undefined,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -163,7 +163,7 @@ function BaseOnboardingWorkspaces({route, shouldUseNativeStyles}: BaseOnboarding
onSelectRow={() => {}}
ListItem={UserListItem}
style={{listItemWrapperStyle: onboardingIsMediumOrLargerScreenWidth ? [styles.pl8, styles.pr8, styles.cursorDefault] : []}}
showLoadingPlaceholder={joinablePoliciesLoading}
shouldShowLoadingPlaceholder={joinablePoliciesLoading}
shouldStopPropagation
showScrollIndicator
customListHeader={
Expand Down
2 changes: 1 addition & 1 deletion src/pages/ReportChangeWorkspacePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -195,7 +195,7 @@ function ReportChangeWorkspacePage({report, route}: ReportChangeWorkspacePagePro
onSelectRow={(option) => selectPolicy(option.policyID)}
textInputOptions={textInputOptions}
initiallyFocusedItemKey={report.policyID}
showLoadingPlaceholder={fetchStatus.status === 'loading' || !didScreenTransitionEnd}
shouldShowLoadingPlaceholder={fetchStatus.status === 'loading' || !didScreenTransitionEnd}
disableMaintainingScrollPosition
/>
)}
Expand Down
2 changes: 1 addition & 1 deletion src/pages/RoomInvitePage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -291,7 +291,7 @@ function RoomInvitePage({
onConfirm: inviteUsers,
}}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
showLoadingPlaceholder={!areOptionsInitialized}
shouldShowLoadingPlaceholder={!areOptionsInitialized}
isLoadingNewOptions={!!isSearchingForReports}
shouldShowTextInput
canSelectMultiple
Expand Down
2 changes: 1 addition & 1 deletion src/pages/RoomMembersPage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -462,7 +462,7 @@ function RoomMembersPage({report, policy}: RoomMembersPageProps) {
onCheckboxPress={toggleUser}
textInputOptions={textInputOptions}
shouldShowTextInput={shouldShowTextInput}
showLoadingPlaceholder={!isPersonalDetailsReady(personalDetails) || !didLoadRoomMembers}
shouldShowLoadingPlaceholder={!isPersonalDetailsReady(personalDetails) || !didLoadRoomMembers}
shouldPreventDefaultFocusOnSelectRow={!canUseTouchScreen()}
onTurnOnSelectionMode={(item) => item && toggleUser(item)}
onSelectAll={() => toggleAllUsers(data)}
Expand Down
Loading
Loading