From 6d3576fc888233b9c41d9a61be55f4b7a2595a17 Mon Sep 17 00:00:00 2001
From: Ely Lucas <ely@meta-tek.net>
Date: Fri, 4 Sep 2020 06:01:23 -0600
Subject: [PATCH] fix(react): redirect routes should unmount leaving component,
 fixes #22022

---
 .../react-router/src/ReactRouter/IonRouter.tsx  |  4 +---
 .../src/ReactRouter/StackManager.tsx            | 17 ++++++++++-------
 .../cypress/integration/routing.spec.js         |  2 +-
 packages/react-router/test-app/package.json     |  2 +-
 packages/react/src/routing/NavManager.tsx       |  2 +-
 5 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/packages/react-router/src/ReactRouter/IonRouter.tsx b/packages/react-router/src/ReactRouter/IonRouter.tsx
index 0083312ab15..5b5ebd3aed0 100644
--- a/packages/react-router/src/ReactRouter/IonRouter.tsx
+++ b/packages/react-router/src/ReactRouter/IonRouter.tsx
@@ -100,8 +100,6 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
       } else {
         leavingLocationInfo = this.locationHistory.current();
       }
-    } else if (action === 'REPLACE') {
-      leavingLocationInfo = this.locationHistory.previous();
     } else {
       leavingLocationInfo = this.locationHistory.current();
     }
@@ -113,7 +111,7 @@ class IonRouterInner extends React.PureComponent<IonRouteProps, IonRouteState> {
           this.incomingRouteParams = {
             routeAction: 'replace',
             routeDirection: 'none',
-            tab: this.currentTab
+            tab: this.currentTab //TODO this isn't legit if replacing to a page that is not in the tabs
           };
         }
         if (action === 'POP') {
diff --git a/packages/react-router/src/ReactRouter/StackManager.tsx b/packages/react-router/src/ReactRouter/StackManager.tsx
index a636bc7ceba..c729fcf1fe1 100644
--- a/packages/react-router/src/ReactRouter/StackManager.tsx
+++ b/packages/react-router/src/ReactRouter/StackManager.tsx
@@ -65,15 +65,18 @@ export class StackManager extends React.PureComponent<StackManagerProps, StackMa
       let enteringViewItem = this.context.findViewItemByRouteInfo(routeInfo, this.id);
       const leavingViewItem = this.context.findLeavingViewItemByRouteInfo(routeInfo, this.id);
 
-      if (!(routeInfo.routeAction === 'push' && routeInfo.routeDirection === 'forward')) {
-        const shouldLeavingViewBeRemoved = routeInfo.routeDirection !== 'none' && leavingViewItem && (enteringViewItem !== leavingViewItem);
-        if (shouldLeavingViewBeRemoved) {
-          leavingViewItem!.mount = false;
+      //Check if leavingViewItem should be unmounted
+      if(leavingViewItem) {
+        if(routeInfo.routeAction === 'replace') {
+          leavingViewItem.mount = false;
+        } else if (!(routeInfo.routeAction === 'push' && routeInfo.routeDirection === 'forward')) {
+          if(routeInfo.routeDirection !== 'none' && (enteringViewItem !== leavingViewItem)) {
+            leavingViewItem.mount = false;
+          }
+        } else if(routeInfo.routeOptions?.unmount) {
+          leavingViewItem.mount = false;
         }
-      }
 
-      if (leavingViewItem && routeInfo.routeOptions?.unmount) {
-        leavingViewItem.mount = false;
       }
 
       const enteringRoute = matchRoute(this.ionRouterOutlet?.props.children, routeInfo) as React.ReactElement;
diff --git a/packages/react-router/test-app/cypress/integration/routing.spec.js b/packages/react-router/test-app/cypress/integration/routing.spec.js
index 8c0e015418f..065166fff56 100644
--- a/packages/react-router/test-app/cypress/integration/routing.spec.js
+++ b/packages/react-router/test-app/cypress/integration/routing.spec.js
@@ -1,6 +1,6 @@
 const port = 3000;
 
-describe('Navigation Tests', () => {
+describe('Routing Tests', () => {
 
   // before(() => {
   //   Cypress.config('userAgent', 'Mozilla/5.0 (iPhone; CPU iPhone OS 13_2_3 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.3 Mobile/15E148 Safari/604.1')
diff --git a/packages/react-router/test-app/package.json b/packages/react-router/test-app/package.json
index fa87cc6e67b..9ee16e3d825 100644
--- a/packages/react-router/test-app/package.json
+++ b/packages/react-router/test-app/package.json
@@ -8,7 +8,7 @@
     "@capacitor/core": "1.5.2",
     "@capacitor/ios": "^2.2.0",
     "@ionic/core": "^5.3.0-dev.202006121329.e968bd0",
-    "@ionic/react": "file:../../react/ionic-react-5.3.1.tgz",
+    "@ionic/react": "file:../../react/ionic-react-5.3.2.tgz",
     "@svgr/webpack": "4.3.3",
     "@testing-library/jest-dom": "^4.2.4",
     "@testing-library/react": "^9.4.0",
diff --git a/packages/react/src/routing/NavManager.tsx b/packages/react/src/routing/NavManager.tsx
index 66ac0aa3c5b..2a3b0899365 100644
--- a/packages/react/src/routing/NavManager.tsx
+++ b/packages/react/src/routing/NavManager.tsx
@@ -25,7 +25,7 @@ interface NavManagerProps {
   locationHistory: LocationHistory;
 }
 
-export class NavManager extends React.Component<NavManagerProps, NavContextState> {
+export class NavManager extends React.PureComponent<NavManagerProps, NavContextState> {
 
   ionRouterContextValue: IonRouterContextState = {
     push: (pathname: string, routerDirection?: RouterDirection, routeAction?: RouteAction, routerOptions?: RouterOptions, animationBuilder?: AnimationBuilder) => {