Go back to the root page

I tried this exact code in my home.ts and it works, but the tab icons are still on the bottom of the screen when it goes to login page.

logout() {
  this.oauthService.logOut();
  this.nav.setRoot(LoginPage);
  this.nav.popToRoot();
}

Any idea how to change that behavior? Note that in my app.component.ts, I’m setting the root page on launch.

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,
            oauthService: OAuthService) {
  if (oauthService.hasValidIdToken()) {
    this.rootPage = TabsPage;
  } else {
    this.rootPage = LoginPage;
  }
  
  platform.ready().then(() => {
    // Okay, so the platform is ready and our plugins are available.
    // Here you can do any higher level native things you might need.
    statusBar.styleDefault();
    splashScreen.hide();
  });
}