Confuse between IonNav and History

Hi, I’m working on a Ionic 4 + React project, and here is my App.tsx:

import LogIn from './pages/LogIn';
import FBLinking from './pages/FBLinking';
    <IonNav root="login"></IonNav>
          <Route path="/home" component={Home} exact={true} />
          <Route path="/login" component={LogIn} exact={true} />
          <Route path="/fb" component={FBLinking} exact={true} />
          <Route exact path="/" render={() => <Redirect to="/login" />} />

So login page is my landing page when the app launch. From the login page, when the user successfully login, I manage to navigate to the “fb” page using this JavaScript:


I have a modal window opened in the login page, but when I navigate to the “fb”, the modal still exist, what’s the proper way to clear everything and set my “fb” page as the New Root?