Merge pull request #18944 from hoangzinh/df/18815

Fix reload year search page, date search selection breaks in DOB page

src/pages/settings/Profile/PersonalDetails/DateOfBirthPage.js

@@ -15,6 +15,7 @@ import * as PersonalDetails from '../../../../libs/actions/PersonalDetails';
 import compose from '../../../../libs/compose';
 import NewDatePicker from '../../../../components/NewDatePicker';
 import CONST from '../../../../CONST';
+import withNavigationFocus from '../../../../components/withNavigationFocus';
 
 const propTypes = {
     /* Onyx Props */
@@ -49,11 +50,16 @@ class DateOfBirthPage extends Component {
     }
 
     componentDidMount() {
-        this.props.navigation.addListener('focus', this.getYearFromRouteParams);
+        this.getYearFromRouteParams();
     }
 
-    componentWillUnmount() {
-        this.props.navigation.removeListener('focus', this.getYearFromRouteParams);
+    componentDidUpdate(prevProps) {
+        // When we're navigating back from Year page. We need to update the selected year from the URL
+        if (prevProps.isFocused || !this.props.isFocused) {
+            return;
+        }
+
+        this.getYearFromRouteParams();
     }
 
     /**
@@ -135,6 +141,7 @@ DateOfBirthPage.defaultProps = defaultProps;
 
 export default compose(
     withLocalize,
+    withNavigationFocus,
     withOnyx({
         privatePersonalDetails: {
             key: ONYXKEYS.PRIVATE_PERSONAL_DETAILS,