Merge pull request #20355 from adamgrzybowski/@swm/navigation-refacto…

…r-currency-selection [navigation-refactor] fix: currency and date picker selection (cherry picked from commit 8415bb2)
Expensify · Jun 7, 2023 · d0256cd · d0256cd
1 parent 039d460
commit d0256cd
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 32 deletions.
diff --git a/src/components/CalendarPicker/index.js b/src/components/CalendarPicker/index.js
@@ -58,19 +58,21 @@ class CalendarPicker extends React.PureComponent {
         throw new Error('Minimum date cannot be greater than the maximum date.');
     }
 
-    componentDidUpdate(prevProps) {
-        // Check if selectedYear has changed
-        if (this.props.selectedYear === prevProps.selectedYear) {
+    componentDidUpdate(prevProps, prevState) {
+        // if the selectedYear prop or state has changed, update the currentDateView state with the new year value
+        if (this.props.selectedYear === prevProps.selectedYear && prevState.selectedYear === this.state.selectedYear) {
             return;
         }
 
-        // If the selectedYear prop has changed, update the currentDateView state with the new year value
+        // If we changed the prop for selectedYear, update the state to match it, otherwise use the state value
+        const newSelectedYear = this.props.selectedYear !== prevProps.selectedYear ? this.props.selectedYear : this.state.selectedYear;
+
         this.setState(
             (prev) => {
-                const newMomentDate = moment(prev.currentDateView).set('year', this.props.selectedYear);
+                const newMomentDate = moment(prev.currentDateView).set('year', newSelectedYear);
 
                 return {
-                    selectedYear: this.props.selectedYear,
+                    selectedYear: newSelectedYear,
                     currentDateView: this.clampDate(newMomentDate.toDate()),
                 };
             },

diff --git a/src/libs/Navigation/Navigation.js b/src/libs/Navigation/Navigation.js
@@ -158,15 +158,10 @@ function getActiveRoute() {
         return '';
     }
 
-    const routeState = navigationRef.current.getState();
-    const currentRoute = routeState.routes[routeState.index];
+    const routeFromState = getPathFromState(navigationRef.getRootState(), linkingConfig.config);
 
-    if (currentRoute.state) {
-        return getPathFromState(routeState, linkingConfig.config);
-    }
-
-    if (currentRoute.params && currentRoute.params.path) {
-        return currentRoute.params.path;
+    if (routeFromState) {
+        return routeFromState;
     }
 
     return '';

diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js
@@ -1048,7 +1048,7 @@ function getReportName(report) {
  * @returns {Object}
  */
 function getReport(reportID) {
-    return allReports[`${ONYXKEYS.COLLECTION.REPORT}${reportID}`];
+    return lodashGet(allReports, `${ONYXKEYS.COLLECTION.REPORT}${reportID}`, {});
 }
 
 /**

diff --git a/src/pages/YearPickerPage.js b/src/pages/YearPickerPage.js
@@ -1,4 +1,5 @@
 import _ from 'underscore';
+import lodashGet from 'lodash/get';
 import React from 'react';
 import {withCurrentUserPersonalDetailsPropTypes, withCurrentUserPersonalDetailsDefaultProps} from '../components/withCurrentUserPersonalDetails';
 import ScreenWrapper from '../components/ScreenWrapper';
@@ -64,7 +65,15 @@ class YearPickerPage extends React.Component {
      */
     updateSelectedYear(selectedYear) {
         // We have to navigate using concatenation here as it is not possible to pass a function as a route param
-        Navigation.goBack(`${ROUTES.SETTINGS_PERSONAL_DETAILS_DATE_OF_BIRTH}?year=${selectedYear}`, true);
+        const routes = lodashGet(this.props.navigation.getState(), 'routes', []);
+        const dateOfBirthRoute = _.find(routes, (route) => route.name === 'Settings_PersonalDetails_DateOfBirth');
+
+        if (dateOfBirthRoute) {
+            Navigation.setParams({year: selectedYear.toString()}, lodashGet(dateOfBirthRoute, 'key', ''));
+            Navigation.goBack();
+        } else {
+            Navigation.goBack(`${ROUTES.SETTINGS_PERSONAL_DETAILS_DATE_OF_BIRTH}?year=${selectedYear}`);
+        }
     }
 
     /**

diff --git a/src/pages/tasks/TaskDescriptionPage.js b/src/pages/tasks/TaskDescriptionPage.js
@@ -9,11 +9,9 @@ import Form from '../../components/Form';
 import ONYXKEYS from '../../ONYXKEYS';
 import TextInput from '../../components/TextInput';
 import styles from '../../styles/styles';
-import Navigation from '../../libs/Navigation/Navigation';
 import compose from '../../libs/compose';
 import reportPropTypes from '../reportPropTypes';
 import * as TaskUtils from '../../libs/actions/Task';
-import ROUTES from '../../ROUTES';
 
 const propTypes = {
     /** Current user session */
@@ -55,12 +53,7 @@ function TaskDescriptionPage(props) {
             includeSafeAreaPaddingBottom={false}
             onEntryTransitionEnd={() => inputRef.current && inputRef.current.focus()}
         >
-            <HeaderWithBackButton
-                title={props.translate('newTaskPage.task')}
-                shouldShowBackButton
-                onBackButtonPress={() => Navigation.goBack(ROUTES.NEW_TASK)}
-                onCloseButtonPress={() => TaskUtils.dismissModalAndClearOutTaskInfo()}
-            />
+            <HeaderWithBackButton title={props.translate('newTaskPage.task')} />
             <Form
                 style={[styles.flexGrow1, styles.ph5]}
                 formID={ONYXKEYS.FORMS.EDIT_TASK_FORM}

diff --git a/src/pages/tasks/TaskTitlePage.js b/src/pages/tasks/TaskTitlePage.js
@@ -10,11 +10,9 @@ import Form from '../../components/Form';
 import ONYXKEYS from '../../ONYXKEYS';
 import TextInput from '../../components/TextInput';
 import styles from '../../styles/styles';
-import Navigation from '../../libs/Navigation/Navigation';
 import reportPropTypes from '../reportPropTypes';
 import compose from '../../libs/compose';
 import * as TaskUtils from '../../libs/actions/Task';
-import ROUTES from '../../ROUTES';
 
 const propTypes = {
     /** Task Report Info */
@@ -73,12 +71,7 @@ function TaskTitlePage(props) {
             includeSafeAreaPaddingBottom={false}
             onEntryTransitionEnd={() => inputRef.current && inputRef.current.focus()}
         >
-            <HeaderWithBackButton
-                title={props.translate('newTaskPage.task')}
-                shouldShowBackButton
-                onBackButtonPress={() => Navigation.goBack(ROUTES.NEW_TASK)}
-                onCloseButtonPress={() => TaskUtils.dismissModalAndClearOutTaskInfo()}
-            />
+            <HeaderWithBackButton title={props.translate('newTaskPage.task')} />
             <Form
                 style={[styles.flexGrow1, styles.ph5]}
                 formID={ONYXKEYS.FORMS.EDIT_TASK_FORM}