bug: react, tab navigation breaks when opening a modal on a tab page

### Prequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [X] v5.x
- [ ] v6.x

### Current Behavior

When creating an Ionic React application that has a modal in a nested tab page, the tab navigation will break after opening the modal.

The Application in the provided repository has three tabs: Tab 1, Tab 2 and Tab 3.
Tab 3 has a nested page (path `/tab3/page1`) and on that page there is a simple ``.
When you open (and close) the modal on the nested page, the navigation to Tab 1 will break (Page 1 remains visible - app location is updated to `/tab1`). Oddly, when you navigate to Tab 2 with the tab button, navigation for that tab still works.

### Expected Behavior

The App should show the content of Tab 1 page when tapped on the tab bar button.

### Steps to Reproduce

- Create a new Ionic React app with tabs
- Add a nested page in Tab 3 (with entry in `App.tsx` router outlet ``)
- Add a modal in the nested page
- Run the app, navigate to Tab 3
- Go to the nested page in Tab 3
- Open (and close) the modal in the nested page
- Navigate to Tab 1
- See Bug (the nested page remains visible)

### Code Reproduction URL

https://github.com/hansvn/Ionic-React-tab-navigation-with-modal-bug

### Ionic Info

Ionic:

Ionic CLI : 6.17.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 5.7.0

Capacitor:

Capacitor CLI : 3.2.0
@capacitor/android : not installed
@capacitor/core : 3.2.0
@capacitor/ios : not installed

Utility:

cordova-res : 0.15.3
native-run : 1.4.0

System:

NodeJS : v12.14.0 (/usr/local/bin/node)
npm : 7.6.0
OS : macOS Big Sur

### Additional Information

I suspect the router doesn't hide the `ion-page` Dom element. The nested page has the `can-go-back` class on the element, but there is no `ion-page-hidden` added to that element when navigating to the first tab.

Start by running the linked reproduction repository and following the tab, nested-page, and modal steps. Inspect App.tsx, especially the router outlet and the /tab3/page1 route, while observing page visibility after the modal closes. Done means tapping Tab 1 displays its content instead of leaving the nested page visible.

Rédigé par le modèle d'indexation à partir du texte de l'issue.