From 9d9cc6fcb94ab6c8fc81616ae1f0075a4f172982 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Wed, 6 Sep 2023 01:32:46 +0200 Subject: [PATCH 01/26] - Implement map route re-fetch on going online - Add 'TBD' to pending fields --- src/components/DistanceRequest.js | 2 +- src/components/MoneyRequestConfirmationList.js | 6 ++++-- src/languages/en.ts | 1 + src/languages/es.ts | 1 + src/libs/TransactionUtils.js | 12 ++++++++++++ 5 files changed, 19 insertions(+), 3 deletions(-) diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index efaf42639567..0e7db6e21b0c 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -92,7 +92,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const isLoadingRoute = lodashGet(transaction, 'comment.isLoading', false); const hasRouteError = lodashHas(transaction, 'errorFields.route'); const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); - const doesRouteExist = lodashHas(transaction, 'routes.route0.geometry.coordinates'); + const doesRouteExist = TransactionUtils.doesRouteExist(transaction) const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); const shouldFetchRoute = (!doesRouteExist || haveWaypointsChanged) && !isLoadingRoute && _.size(validatedWaypoints) > 1; const waypointMarkers = useMemo( diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index a7695c939907..03ab693ab35f 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -33,6 +33,7 @@ import ConfirmedRoute from './ConfirmedRoute'; import transactionPropTypes from './transactionPropTypes'; import DistanceRequestUtils from '../libs/DistanceRequestUtils'; import * as IOU from '../libs/actions/IOU'; +import * as TransactionUtils from "../libs/TransactionUtils"; const propTypes = { /** Callback to inform parent modal of success */ @@ -173,7 +174,8 @@ function MoneyRequestConfirmationList(props) { const shouldCalculateDistanceAmount = props.isDistanceRequest && props.iouAmount === 0; const shouldCategoryEditable = !_.isEmpty(props.policyCategories) && !props.isDistanceRequest; - const formattedAmount = CurrencyUtils.convertToDisplayString( + const doesRouteExist = TransactionUtils.doesRouteExist(transaction) + const formattedAmount = (props.isDistanceRequest && !doesRouteExist) ? translate('common.tbd') : CurrencyUtils.convertToDisplayString( shouldCalculateDistanceAmount ? DistanceRequestUtils.getDistanceRequestAmount(distance, unit, rate) : props.iouAmount, props.isDistanceRequest ? currency : props.iouCurrencyCode, ); @@ -466,7 +468,7 @@ function MoneyRequestConfirmationList(props) { {props.isDistanceRequest ? ( Date: Wed, 6 Sep 2023 11:52:48 +0200 Subject: [PATCH 02/26] Handle null waypoint coordinates correctly --- src/components/ConfirmedRoute.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index aa7c38e0c535..31b05d03378c 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -4,6 +4,7 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; +import lodashIsNil from "lodash/isNil"; import _ from 'underscore'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; @@ -43,7 +44,7 @@ const getWaypointMarkers = (waypoints) => { const lastWaypointIndex = numberOfWaypoints - 1; return _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || waypoint.lng === undefined || waypoint.lat === undefined) { + if (!waypoint || lodashIsNil(waypoint.lng) || lodashIsNil(waypoint.lat)) { return; } From 7afdf809c352add1e614fa96d0ac3d7874a08a8d Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Wed, 6 Sep 2023 14:50:59 +0200 Subject: [PATCH 03/26] Add hasRouteError check for route re-fetch --- src/components/DistanceRequest.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index 0e7db6e21b0c..aa1f7b85bdda 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -90,11 +90,11 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const lastWaypointIndex = numberOfWaypoints - 1; const isLoadingRoute = lodashGet(transaction, 'comment.isLoading', false); - const hasRouteError = lodashHas(transaction, 'errorFields.route'); + const hasRouteError = !lodashIsNull(lodashGet(transaction, 'errorFields.route')); const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); const doesRouteExist = TransactionUtils.doesRouteExist(transaction) const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); - const shouldFetchRoute = (!doesRouteExist || haveWaypointsChanged) && !isLoadingRoute && _.size(validatedWaypoints) > 1; + const shouldFetchRoute = ((!hasRouteError && !doesRouteExist) || haveWaypointsChanged) && !isLoadingRoute && _.size(validatedWaypoints) > 1; const waypointMarkers = useMemo( () => _.filter( From 0b9596da2dc031eb0bf24314fef2dab21151bb3b Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Wed, 6 Sep 2023 17:30:24 +0200 Subject: [PATCH 04/26] Make the shouldFetchRoute condition more readable --- src/components/DistanceRequest.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index aa1f7b85bdda..8b54327aea04 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -94,7 +94,9 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); const doesRouteExist = TransactionUtils.doesRouteExist(transaction) const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); - const shouldFetchRoute = ((!hasRouteError && !doesRouteExist) || haveWaypointsChanged) && !isLoadingRoute && _.size(validatedWaypoints) > 1; + const hasMultipleValidWaypoints = _.size(validatedWaypoints) > 1; + const isRouteAbsentWithNoErrors = !hasRouteError && !doesRouteExist; + const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithNoErrors) && !isLoadingRoute && hasMultipleValidWaypoints; const waypointMarkers = useMemo( () => _.filter( From af2c13f809355acbdb8b0b622926a6c280b3a134 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Wed, 6 Sep 2023 18:04:15 +0200 Subject: [PATCH 05/26] Some refactoring --- src/components/ConfirmedRoute.js | 4 ++-- src/components/DistanceRequest.js | 10 ++++------ 2 files changed, 6 insertions(+), 8 deletions(-) diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index 31b05d03378c..c9b418849423 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -4,7 +4,7 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; -import lodashIsNil from "lodash/isNil"; +import lodashIsNil from 'lodash/isNil'; import _ from 'underscore'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; @@ -44,7 +44,7 @@ const getWaypointMarkers = (waypoints) => { const lastWaypointIndex = numberOfWaypoints - 1; return _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || lodashIsNil(waypoint.lng) || lodashIsNil(waypoint.lat)) { + if (!waypoint || lodashIsNil(lodashGet(waypoint, 'lng')) || lodashIsNil(lodashGet(waypoint, 'lat'))) { return; } diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index 8b54327aea04..5b2116b784f7 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -2,8 +2,7 @@ import React, {useEffect, useMemo, useState, useRef} from 'react'; import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; -import lodashHas from 'lodash/has'; -import lodashIsNull from 'lodash/isNull'; +import lodashIsNil from 'lodash/isNil'; import PropTypes from 'prop-types'; import _ from 'underscore'; @@ -90,18 +89,17 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const lastWaypointIndex = numberOfWaypoints - 1; const isLoadingRoute = lodashGet(transaction, 'comment.isLoading', false); - const hasRouteError = !lodashIsNull(lodashGet(transaction, 'errorFields.route')); + const hasRouteError = !lodashIsNil(lodashGet(transaction, 'errorFields.route')); const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); const doesRouteExist = TransactionUtils.doesRouteExist(transaction) const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); - const hasMultipleValidWaypoints = _.size(validatedWaypoints) > 1; const isRouteAbsentWithNoErrors = !hasRouteError && !doesRouteExist; - const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithNoErrors) && !isLoadingRoute && hasMultipleValidWaypoints; + const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithNoErrors) && !isLoadingRoute && _.size(validatedWaypoints) > 1; const waypointMarkers = useMemo( () => _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || !lodashHas(waypoint, 'lat') || !lodashHas(waypoint, 'lng') || lodashIsNull(waypoint.lat) || lodashIsNull(waypoint.lng)) { + if (!waypoint || lodashIsNil(lodashGet(waypoint, 'lng')) || lodashIsNil(lodashGet(waypoint, 'lat'))) { return; } From 9ce8d13d918cf6a0de89ae673c21dbc435a605b1 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Thu, 7 Sep 2023 18:39:39 +0200 Subject: [PATCH 06/26] Translation change --- src/languages/es.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/languages/es.ts b/src/languages/es.ts index 016337241c30..ed4855343d41 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -238,7 +238,7 @@ export default { kilometers: 'kilómetros', recent: 'Reciente', all: 'Todo', - tbd: 'A definir' + tbd: 'Por determinar' }, anonymousReportFooter: { logoTagline: 'Únete a la discusión.', From 5dc1d8e1af20b86ab66a2a60773d59271ff9d069 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Fri, 8 Sep 2023 20:51:51 +0200 Subject: [PATCH 07/26] Formatting --- src/components/DistanceRequest.js | 2 +- src/components/MoneyRequestConfirmationList.js | 15 +++++++++------ src/languages/es.ts | 2 +- src/libs/TransactionUtils.js | 2 +- 4 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index 5b2116b784f7..d978030c1f3b 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -91,7 +91,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const isLoadingRoute = lodashGet(transaction, 'comment.isLoading', false); const hasRouteError = !lodashIsNil(lodashGet(transaction, 'errorFields.route')); const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); - const doesRouteExist = TransactionUtils.doesRouteExist(transaction) + const doesRouteExist = TransactionUtils.doesRouteExist(transaction); const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); const isRouteAbsentWithNoErrors = !hasRouteError && !doesRouteExist; const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithNoErrors) && !isLoadingRoute && _.size(validatedWaypoints) > 1; diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 03ab693ab35f..784301a38933 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -33,7 +33,7 @@ import ConfirmedRoute from './ConfirmedRoute'; import transactionPropTypes from './transactionPropTypes'; import DistanceRequestUtils from '../libs/DistanceRequestUtils'; import * as IOU from '../libs/actions/IOU'; -import * as TransactionUtils from "../libs/TransactionUtils"; +import * as TransactionUtils from '../libs/TransactionUtils'; const propTypes = { /** Callback to inform parent modal of success */ @@ -174,11 +174,14 @@ function MoneyRequestConfirmationList(props) { const shouldCalculateDistanceAmount = props.isDistanceRequest && props.iouAmount === 0; const shouldCategoryEditable = !_.isEmpty(props.policyCategories) && !props.isDistanceRequest; - const doesRouteExist = TransactionUtils.doesRouteExist(transaction) - const formattedAmount = (props.isDistanceRequest && !doesRouteExist) ? translate('common.tbd') : CurrencyUtils.convertToDisplayString( - shouldCalculateDistanceAmount ? DistanceRequestUtils.getDistanceRequestAmount(distance, unit, rate) : props.iouAmount, - props.isDistanceRequest ? currency : props.iouCurrencyCode, - ); + const doesRouteExist = TransactionUtils.doesRouteExist(transaction); + const formattedAmount = + props.isDistanceRequest && !doesRouteExist + ? translate('common.tbd') + : CurrencyUtils.convertToDisplayString( + shouldCalculateDistanceAmount ? DistanceRequestUtils.getDistanceRequestAmount(distance, unit, rate) : props.iouAmount, + props.isDistanceRequest ? currency : props.iouCurrencyCode, + ); useEffect(() => { if (!shouldCalculateDistanceAmount) { diff --git a/src/languages/es.ts b/src/languages/es.ts index ed4855343d41..627abcd557d2 100644 --- a/src/languages/es.ts +++ b/src/languages/es.ts @@ -238,7 +238,7 @@ export default { kilometers: 'kilómetros', recent: 'Reciente', all: 'Todo', - tbd: 'Por determinar' + tbd: 'Por determinar', }, anonymousReportFooter: { logoTagline: 'Únete a la discusión.', diff --git a/src/libs/TransactionUtils.js b/src/libs/TransactionUtils.js index c226d4ce2a59..59d191e2daa3 100644 --- a/src/libs/TransactionUtils.js +++ b/src/libs/TransactionUtils.js @@ -279,7 +279,7 @@ function hasMissingSmartscanFields(transaction) { * @returns {Boolean} */ function doesRouteExist(transaction) { - return !lodashIsNil(lodashGet(transaction, 'routes.route0.geometry.coordinates')) + return !lodashIsNil(lodashGet(transaction, 'routes.route0.geometry.coordinates')); } /** From 6d4592fdd0384b92d99fdbd6bcab96b9f265677d Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Fri, 8 Sep 2023 20:52:55 +0200 Subject: [PATCH 08/26] Fix missing workspace rate --- src/pages/iou/steps/MoneyRequestConfirmPage.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index 178179f31745..f526b8596092 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -23,6 +23,7 @@ import reportPropTypes from '../../reportPropTypes'; import personalDetailsPropType from '../../personalDetailsPropType'; import * as FileUtils from '../../../libs/fileDownload/FileUtils'; import * as Policy from '../../../libs/actions/Policy'; +import useNetwork from '../../../hooks/useNetwork'; import useWindowDimensions from '../../../hooks/useWindowDimensions'; import * as StyleUtils from '../../../styles/StyleUtils'; import {iouPropTypes, iouDefaultProps} from '../propTypes'; @@ -59,6 +60,7 @@ const defaultProps = { }; function MoneyRequestConfirmPage(props) { + const {isOffline} = useNetwork(); const {windowHeight} = useWindowDimensions(); const prevMoneyRequestId = useRef(props.iou.id); const iouType = useRef(lodashGet(props.route, 'params.iouType', '')); @@ -77,8 +79,7 @@ function MoneyRequestConfirmPage(props) { if (policyExpenseChat) { Policy.openDraftWorkspaceRequest(policyExpenseChat.policyID); } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); + }, [isOffline]); useEffect(() => { // ID in Onyx could change by initiating a new request in a separate browser tab or completing a request From 6d35789f8fc9874874a1d6410d2ba484abb5ab89 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Fri, 8 Sep 2023 20:54:46 +0200 Subject: [PATCH 09/26] Fix missing workspace distance rate --- src/pages/iou/steps/MoneyRequestConfirmPage.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/pages/iou/steps/MoneyRequestConfirmPage.js b/src/pages/iou/steps/MoneyRequestConfirmPage.js index f526b8596092..91cb40db9f67 100644 --- a/src/pages/iou/steps/MoneyRequestConfirmPage.js +++ b/src/pages/iou/steps/MoneyRequestConfirmPage.js @@ -79,7 +79,7 @@ function MoneyRequestConfirmPage(props) { if (policyExpenseChat) { Policy.openDraftWorkspaceRequest(policyExpenseChat.policyID); } - }, [isOffline]); + }, [isOffline, participants]); useEffect(() => { // ID in Onyx could change by initiating a new request in a separate browser tab or completing a request From 657480824a945e8cc97a11c4d3717e99675baa90 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Mon, 11 Sep 2023 23:34:12 +0200 Subject: [PATCH 10/26] Render map's BlockingView without text --- src/components/BlockingViews/BlockingView.js | 6 ++++-- src/components/ConfirmedRoute.js | 6 +++--- src/components/DistanceRequest.js | 6 +++--- src/components/MoneyRequestConfirmationList.js | 2 +- src/libs/DistanceRequestUtils.js | 4 ++-- src/libs/TransactionUtils.js | 3 +-- 6 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/components/BlockingViews/BlockingView.js b/src/components/BlockingViews/BlockingView.js index 5cb342b0fada..3b38343b07eb 100644 --- a/src/components/BlockingViews/BlockingView.js +++ b/src/components/BlockingViews/BlockingView.js @@ -1,6 +1,7 @@ import React from 'react'; import {View} from 'react-native'; import PropTypes from 'prop-types'; +import _ from 'underscore'; import styles from '../../styles/styles'; import variables from '../../styles/variables'; import Icon from '../Icon'; @@ -19,7 +20,7 @@ const propTypes = { iconColor: PropTypes.string, /** Title message below the icon */ - title: PropTypes.string.isRequired, + title: PropTypes.string, /** Subtitle message below the title */ subtitle: PropTypes.string, @@ -45,6 +46,7 @@ const propTypes = { const defaultProps = { iconColor: themeColors.offline, + title: '', subtitle: '', shouldShowLink: false, linkKey: 'notFound.goBackHome', @@ -83,7 +85,7 @@ function BlockingView(props) { width={props.iconWidth} height={props.iconHeight} /> - {props.title} + {!_.isEmpty(props.title) && {props.title}} {props.shouldEmbedLinkWithSubtitle ? ( {renderContent()} diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index 1073ff843fff..aec7cd10d981 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -45,7 +45,7 @@ const getWaypointMarkers = (waypoints) => { const lastWaypointIndex = numberOfWaypoints - 1; return _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || lodashIsNil(lodashGet(waypoint, 'lng')) || lodashIsNil(lodashGet(waypoint, 'lat'))) { + if (!waypoint || !waypoint.lng || !waypoint.lat) { return; } @@ -108,8 +108,8 @@ function ConfirmedRoute({mapboxAccessToken, transaction}) { diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index f509510ff0d9..f1a93e027f7a 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -99,7 +99,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) () => _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || !!waypoint.lat || !!waypoint.lng) { + if (!waypoint || !waypoint.lat || !waypoint.lng) { return; } @@ -252,8 +252,8 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) diff --git a/src/components/MoneyRequestConfirmationList.js b/src/components/MoneyRequestConfirmationList.js index 784301a38933..7a38565a9c38 100755 --- a/src/components/MoneyRequestConfirmationList.js +++ b/src/components/MoneyRequestConfirmationList.js @@ -471,7 +471,7 @@ function MoneyRequestConfirmationList(props) { {props.isDistanceRequest ? ( { const convertedDistance = convertDistanceUnit(distanceInMeters, unit); const distanceUnit = unit === CONST.CUSTOM_UNITS.DISTANCE_UNIT_MILES ? translate('common.miles') : translate('common.kilometers'); const singularDistanceUnit = unit === CONST.CUSTOM_UNITS.DISTANCE_UNIT_MILES ? translate('common.mile') : translate('common.kilometer'); - const roundedDistance = convertedDistance.toFixed(2); + const roundedDistance = convertedDistance === 0 ? translate('common.tbd') : convertedDistance.toFixed(2); const unitString = roundedDistance === 1 ? singularDistanceUnit : distanceUnit; const ratePerUnit = rate * 0.01; const currencySymbol = CurrencyUtils.getCurrencySymbol(currency) || `${currency} `; diff --git a/src/libs/TransactionUtils.js b/src/libs/TransactionUtils.js index 1907b5f05641..fffea78e43bb 100644 --- a/src/libs/TransactionUtils.js +++ b/src/libs/TransactionUtils.js @@ -1,7 +1,6 @@ import Onyx from 'react-native-onyx'; import {format, parseISO, isValid} from 'date-fns'; import lodashGet from 'lodash/get'; -import lodashIsNil from 'lodash/isNil'; import _ from 'underscore'; import CONST from '../CONST'; import ONYXKEYS from '../ONYXKEYS'; @@ -280,7 +279,7 @@ function hasMissingSmartscanFields(transaction) { * @returns {Boolean} */ function doesRouteExist(transaction) { - return !lodashIsNil(lodashGet(transaction, 'routes.route0.geometry.coordinates')); + return !!lodashGet(transaction, 'routes.route0.geometry.coordinates'); } /** From 6b0ecd35cfe2bc77167ba5abd86847fffa66c4a9 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Mon, 11 Sep 2023 23:37:56 +0200 Subject: [PATCH 11/26] Refactoring --- src/components/ConfirmedRoute.js | 1 - src/components/DistanceRequest.js | 4 ++-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index aec7cd10d981..42a434ce084d 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -4,7 +4,6 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; -import lodashIsNil from 'lodash/isNil'; import _ from 'underscore'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index f1a93e027f7a..ea8029634cee 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -93,8 +93,8 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) const haveWaypointsChanged = !_.isEqual(previousWaypoints, waypoints); const doesRouteExist = TransactionUtils.doesRouteExist(transaction); const validatedWaypoints = TransactionUtils.getValidWaypoints(waypoints); - const isRouteAbsentWithNoErrors = !hasRouteError && !doesRouteExist; - const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithNoErrors) && !isLoadingRoute && _.size(validatedWaypoints) > 1; + const isRouteAbsentWithoutErrors = !hasRouteError && !doesRouteExist; + const shouldFetchRoute = (haveWaypointsChanged || isRouteAbsentWithoutErrors) && !isLoadingRoute && _.size(validatedWaypoints) > 1; const waypointMarkers = useMemo( () => _.filter( From 034fb4ea6ca2fa54639811270fe63f5c5de52297 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Mon, 11 Sep 2023 23:40:04 +0200 Subject: [PATCH 12/26] Refactoring --- src/components/ConfirmedRoute.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index 42a434ce084d..fd05897d5f1a 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -15,7 +15,6 @@ import styles from '../styles/styles'; import transactionPropTypes from './transactionPropTypes'; import BlockingView from './BlockingViews/BlockingView'; import useNetwork from '../hooks/useNetwork'; -import useLocalize from '../hooks/useLocalize'; import MapView from './MapView'; const propTypes = { @@ -76,7 +75,6 @@ const getWaypointMarkers = (waypoints) => { function ConfirmedRoute({mapboxAccessToken, transaction}) { const {isOffline} = useNetwork(); - const {translate} = useLocalize(); const {route0: route} = transaction.routes || {}; const waypoints = lodashGet(transaction, 'comment.waypoints', {}); const coordinates = lodashGet(route, 'geometry.coordinates', []); From 7f24db2d293b4ddd8b7e9d5090aebd08d666d0c7 Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Tue, 12 Sep 2023 21:26:23 +0200 Subject: [PATCH 13/26] Use lodashIsNil --- src/components/ConfirmedRoute.js | 3 ++- src/components/DistanceRequest.js | 3 ++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index fd05897d5f1a..f9056823fc1a 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -4,6 +4,7 @@ import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; +import lodashIsNil from 'lodash/isNil'; import _ from 'underscore'; import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; @@ -43,7 +44,7 @@ const getWaypointMarkers = (waypoints) => { const lastWaypointIndex = numberOfWaypoints - 1; return _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || !waypoint.lng || !waypoint.lat) { + if (!waypoint || lodashIsNil(waypoint.lat) || lodashIsNil(waypoint.lng)) { return; } diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index ea8029634cee..8a138f3394e3 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -2,6 +2,7 @@ import React, {useEffect, useMemo, useState, useRef} from 'react'; import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; +import lodashIsNil from "lodash/isNil"; import PropTypes from 'prop-types'; import _ from 'underscore'; @@ -99,7 +100,7 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) () => _.filter( _.map(waypoints, (waypoint, key) => { - if (!waypoint || !waypoint.lat || !waypoint.lng) { + if (!waypoint || lodashIsNil(waypoint.lat) || lodashIsNil(waypoint.lng)) { return; } From 02bfdac382dcaf1907775f6cdcf252ccce1cfd7e Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Tue, 12 Sep 2023 21:29:55 +0200 Subject: [PATCH 14/26] Use lodashIsNil --- src/components/DistanceRequest.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index 8a138f3394e3..d8464abf0d13 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -2,7 +2,7 @@ import React, {useEffect, useMemo, useState, useRef} from 'react'; import {ScrollView, View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; -import lodashIsNil from "lodash/isNil"; +import lodashIsNil from 'lodash/isNil'; import PropTypes from 'prop-types'; import _ from 'underscore'; From b0b2ea2936f36fd725595892d128d82997b3ee3b Mon Sep 17 00:00:00 2001 From: Pavlo Tsimura Date: Wed, 13 Sep 2023 00:20:16 +0200 Subject: [PATCH 15/26] Add PendingMapView component --- src/components/BlockingViews/BlockingView.js | 6 ++-- src/components/ConfirmedRoute.js | 12 ++----- src/components/DistanceRequest.js | 14 +++----- src/components/MapView/MapViewTypes.ts | 10 +++++- src/components/MapView/PendingMapView.tsx | 35 ++++++++++++++++++++ 5 files changed, 53 insertions(+), 24 deletions(-) create mode 100644 src/components/MapView/PendingMapView.tsx diff --git a/src/components/BlockingViews/BlockingView.js b/src/components/BlockingViews/BlockingView.js index 3b38343b07eb..5cb342b0fada 100644 --- a/src/components/BlockingViews/BlockingView.js +++ b/src/components/BlockingViews/BlockingView.js @@ -1,7 +1,6 @@ import React from 'react'; import {View} from 'react-native'; import PropTypes from 'prop-types'; -import _ from 'underscore'; import styles from '../../styles/styles'; import variables from '../../styles/variables'; import Icon from '../Icon'; @@ -20,7 +19,7 @@ const propTypes = { iconColor: PropTypes.string, /** Title message below the icon */ - title: PropTypes.string, + title: PropTypes.string.isRequired, /** Subtitle message below the title */ subtitle: PropTypes.string, @@ -46,7 +45,6 @@ const propTypes = { const defaultProps = { iconColor: themeColors.offline, - title: '', subtitle: '', shouldShowLink: false, linkKey: 'notFound.goBackHome', @@ -85,7 +83,7 @@ function BlockingView(props) { width={props.iconWidth} height={props.iconHeight} /> - {!_.isEmpty(props.title) && {props.title}} + {props.title} {props.shouldEmbedLinkWithSubtitle ? ( {renderContent()} diff --git a/src/components/ConfirmedRoute.js b/src/components/ConfirmedRoute.js index f9056823fc1a..630f06e6f1f6 100644 --- a/src/components/ConfirmedRoute.js +++ b/src/components/ConfirmedRoute.js @@ -1,6 +1,5 @@ import React, {useEffect} from 'react'; import PropTypes from 'prop-types'; -import {View} from 'react-native'; import {withOnyx} from 'react-native-onyx'; import lodashGet from 'lodash/get'; @@ -14,7 +13,7 @@ import * as Expensicons from './Icon/Expensicons'; import theme from '../styles/themes/default'; import styles from '../styles/styles'; import transactionPropTypes from './transactionPropTypes'; -import BlockingView from './BlockingViews/BlockingView'; +import PendingMapView from './MapView/PendingMapView'; import useNetwork from '../hooks/useNetwork'; import MapView from './MapView'; @@ -103,14 +102,7 @@ function ConfirmedRoute({mapboxAccessToken, transaction}) { styleURL={CONST.MAPBOX.STYLE_URL} /> ) : ( - - - + )} ); diff --git a/src/components/DistanceRequest.js b/src/components/DistanceRequest.js index b6d93a9f8f96..763c4b27c737 100644 --- a/src/components/DistanceRequest.js +++ b/src/components/DistanceRequest.js @@ -30,7 +30,7 @@ import Button from './Button'; import MapView from './MapView'; import LinearGradient from './LinearGradient'; import * as Expensicons from './Icon/Expensicons'; -import BlockingView from './BlockingViews/BlockingView'; +import PendingMapView from './MapView/PendingMapView'; import DotIndicatorMessage from './DotIndicatorMessage'; import MenuItemWithTopDescription from './MenuItemWithTopDescription'; import {iouPropTypes} from '../pages/iou/propTypes'; @@ -252,14 +252,10 @@ function DistanceRequest({iou, iouType, report, transaction, mapboxAccessToken}) styleURL={CONST.MAPBOX.STYLE_URL} /> ) : ( - - - + )}