From 477ca8fa7180815d918cf1e1218212f22f7f209e Mon Sep 17 00:00:00 2001 From: honnamkuan Date: Tue, 26 Dec 2023 15:23:41 +0800 Subject: [PATCH 1/3] do not focus on text input on select row using touch screen device --- src/pages/NewChatPage.js | 4 ++-- .../MoneyTemporaryForRefactorRequestParticipantsSelector.js | 4 ++-- .../MoneyRequestParticipantsSelector.js | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index d7abbab6e93f..c76984dd136b 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -13,7 +13,7 @@ import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import * as Browser from '@libs/Browser'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import Permissions from '@libs/Permissions'; @@ -248,7 +248,7 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i onChangeText={setSearchTermAndSearchInServer} headerMessage={headerMessage} boldStyle - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} shouldShowOptions={isOptionsDataReady} shouldShowConfirmButton shouldShowReferralCTA diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index 4db9c4ce3fb7..cc9f1ea52057 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -12,7 +12,7 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; -import * as Browser from '@libs/Browser'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; @@ -321,7 +321,7 @@ function MoneyTemporaryForRefactorRequestParticipantsSelector({ shouldShowOptions={isOptionsDataReady} shouldShowReferralCTA referralContentType={iouType === 'send' ? CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY : CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST} - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} shouldDelayFocus footerContent={isAllowedToSplit && footerContent} isLoadingNewOptions={isSearchingForReports} diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index f51e6d7e9fdd..ed69bcd61943 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -13,7 +13,7 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; -import * as Browser from '@libs/Browser'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; @@ -334,7 +334,7 @@ function MoneyRequestParticipantsSelector({ shouldShowOptions={isOptionsDataReady} shouldShowReferralCTA referralContentType={iouType === 'send' ? CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY : CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST} - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} shouldDelayFocus footerContent={isAllowedToSplit && footerContent} isLoadingNewOptions={isSearchingForReports} From 09cec5486e9e83d7d1a4b216e961663a6412b383 Mon Sep 17 00:00:00 2001 From: honnamkuan Date: Tue, 26 Dec 2023 17:04:13 +0800 Subject: [PATCH 2/3] apply prettier diff --- src/pages/NewChatPage.js | 2 +- .../MoneyTemporaryForRefactorRequestParticipantsSelector.js | 2 +- .../MoneyRequestParticipantsSelector.js | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/pages/NewChatPage.js b/src/pages/NewChatPage.js index c76984dd136b..0a00f39552e4 100755 --- a/src/pages/NewChatPage.js +++ b/src/pages/NewChatPage.js @@ -13,8 +13,8 @@ import useAutoFocusInput from '@hooks/useAutoFocusInput'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import useWindowDimensions from '@hooks/useWindowDimensions'; -import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import Permissions from '@libs/Permissions'; import * as ReportUtils from '@libs/ReportUtils'; diff --git a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js index cc9f1ea52057..61b042052b05 100644 --- a/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js +++ b/src/pages/iou/request/MoneyTemporaryForRefactorRequestParticipantsSelector.js @@ -12,8 +12,8 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; -import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import personalDetailsPropType from '@pages/personalDetailsPropType'; diff --git a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js index ed69bcd61943..38f7ac7cd6ef 100755 --- a/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js +++ b/src/pages/iou/steps/MoneyRequstParticipantsPage/MoneyRequestParticipantsSelector.js @@ -13,8 +13,8 @@ import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; import * as Report from '@libs/actions/Report'; -import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as ReportUtils from '@libs/ReportUtils'; import reportPropTypes from '@pages/reportPropTypes'; From 32191bc3db868c884d917047cc13c641f328d66b Mon Sep 17 00:00:00 2001 From: honnamkuan Date: Thu, 4 Jan 2024 17:07:54 +0800 Subject: [PATCH 3/3] do not focus on text input when checking selection list using touch screen device --- src/pages/RoomInvitePage.js | 4 ++-- src/pages/RoomMembersPage.js | 4 ++-- src/pages/workspace/WorkspaceInvitePage.js | 4 ++-- src/pages/workspace/WorkspaceMembersPage.js | 4 ++-- 4 files changed, 8 insertions(+), 8 deletions(-) diff --git a/src/pages/RoomInvitePage.js b/src/pages/RoomInvitePage.js index aebdec047895..e2398d7c5210 100644 --- a/src/pages/RoomInvitePage.js +++ b/src/pages/RoomInvitePage.js @@ -11,8 +11,8 @@ import ScreenWrapper from '@components/ScreenWrapper'; import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PersonalDetailsUtils from '@libs/PersonalDetailsUtils'; @@ -227,7 +227,7 @@ function RoomInvitePage(props) { onSelectRow={toggleOption} onConfirm={inviteUsers} showScrollIndicator - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} showLoadingPlaceholder={!didScreenTransitionEnd || !OptionsListUtils.isPersonalDetailsReady(props.personalDetails)} /> diff --git a/src/pages/RoomMembersPage.js b/src/pages/RoomMembersPage.js index 27e1cd1da2e6..f40a7708f8c5 100644 --- a/src/pages/RoomMembersPage.js +++ b/src/pages/RoomMembersPage.js @@ -14,8 +14,8 @@ import withCurrentUserPersonalDetails, {withCurrentUserPersonalDetailsDefaultPro import withLocalize, {withLocalizePropTypes} from '@components/withLocalize'; import withWindowDimensions, {windowDimensionsPropTypes} from '@components/withWindowDimensions'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Log from '@libs/Log'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; @@ -289,7 +289,7 @@ function RoomMembersPage(props) { onSelectAll={() => toggleAllUsers(data)} showLoadingPlaceholder={!OptionsListUtils.isPersonalDetailsReady(personalDetails) || !didLoadRoomMembers} showScrollIndicator - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} /> diff --git a/src/pages/workspace/WorkspaceInvitePage.js b/src/pages/workspace/WorkspaceInvitePage.js index 589c4971506b..6496fbecfc9f 100644 --- a/src/pages/workspace/WorkspaceInvitePage.js +++ b/src/pages/workspace/WorkspaceInvitePage.js @@ -12,8 +12,8 @@ import SelectionList from '@components/SelectionList'; import useLocalize from '@hooks/useLocalize'; import useNetwork from '@hooks/useNetwork'; import useThemeStyles from '@hooks/useThemeStyles'; -import * as Browser from '@libs/Browser'; import compose from '@libs/compose'; +import * as DeviceCapabilities from '@libs/DeviceCapabilities'; import Navigation from '@libs/Navigation/Navigation'; import * as OptionsListUtils from '@libs/OptionsListUtils'; import * as PolicyUtils from '@libs/PolicyUtils'; @@ -281,7 +281,7 @@ function WorkspaceInvitePage(props) { onConfirm={inviteUser} showScrollIndicator showLoadingPlaceholder={!didScreenTransitionEnd || !OptionsListUtils.isPersonalDetailsReady(props.personalDetails)} - shouldPreventDefaultFocusOnSelectRow={!Browser.isMobile()} + shouldPreventDefaultFocusOnSelectRow={!DeviceCapabilities.canUseTouchScreen()} />