# Ionic v4 PWA: Dealing with root page and physical back button

**URL:** <https://forum.ionicframework.com/t/ionic-v4-pwa-dealing-with-root-page-and-physical-back-button/154637>\
**Category:** Ionic Framework\
**Created:** [January 29, 2019, 7:27pm UTC](https://forum.ionicframework.com/t/ionic-v4-pwa-dealing-with-root-page-and-physical-back-button/154637 "2019-01-29T19:27:25Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![aguiarguilherme](https://avatars.discourse-cdn.com/v4/letter/a/2acd7d/32.png) [@aguiarguilherme](https://forum.ionicframework.com/u/aguiarguilherme)\
**Post date:** [January 29, 2019, 7:27pm UTC](https://forum.ionicframework.com/t/ionic-v4-pwa-dealing-with-root-page-and-physical-back-button/154637/1 "2019-01-29T19:27:25Z")

</div>

Hi there, Ionicists!

I’m developing a PWA using the v4 (with ng 6.x) with a team. We’re currently close to the end of development for the first phase, but there is a bottleneck we are facing.

Imagine that our current flow of screens is the following: (_Yes, there is some kind of exaggeration on the login stuff, but we were required by our customer to follow a pattern they already have on a working software, specially due to our target users_)

- **pre-login** : The user is prompted to continue authentication or as a guest, which has limited features. **It’s the root page when they open the app**.
- **login** : If the user decides to log in, they input user/password and reset it thru this screen.
- **home** : A home screen, with our customer logo and directions to our features, version etc. Just dummy static content. **Should be our new root page after log in as authenticated/guest**
- **[feature screen]**: screens with features required by our customer, such as graphs, data and such.

Our issue is: I was supposed to set the root page before login to our `pre-login` page, and after the user is authenticated, on `home` page, so that when they hit the back button, it goes to the root page.

If user goes: HomePage \> FirstPage \> SecondPage and hit back, they return to home instead of FirstPage or the level of screens he has navigated through - and if they hit again at HomePage, it should close the PWA.

I tried almost everything I saw on forums and internet. Using `navigateRoot`, changing the `Router.navigateByUrl()` calls, and such but i can’t get this behavior to work.

Also, `platform.backButton.subscribe()` doesn’t get triggered on the PWA.

Any tips on how to deal with it? I’m also attaching our `app-routing-module.ts` for reference.

```auto
import { AuthService } from '@services';
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { PreLoginComponent, OidcComponent, RedirectSilentRenewComponent } from '@components';

const routes: Routes = [
    {
        path: '',
        loadChildren: './pages/pre-login/pre-login.module#PreLoginPageModule',
    },
    {
        path: 'home',
        loadChildren: './pages/home/home.module#HomePageModule',
    },
    {
        path: 'lista-atracacao',
        loadChildren: './pages/lista-atracacao/lista-atracacao.module#ListaAtracacaoPageModule',
    },
    {
        path: 'login',
        loadChildren: './pages/login/login.module#LoginPageModule',
    },
    {
        path: 'yard-kpi',
        loadChildren: './pages/yard-kpi/yard-kpi.module#YardKpiPageModule',
        canActivate: [AuthService],
    },
    {
        path: 'gestao-a-vista',
        loadChildren: './pages/gestao-a-vista/gestao-a-vista.module#GestaoAVistaPageModule',
        canActivate: [AuthService],
    },
    {
        path: 'retencao',
        loadChildren: './pages/retencao/retencao.module#RetencaoPageModule',
        canActivate: [AuthService],
    },
    {
        path: 'tracking-carga',
        loadChildren: './pages/tracking-carga/tracking-carga.module#TrackingCargaPageModule',
        canActivate: [AuthService],
    },
];
routes.push({
    path: '**',
    redirectTo: 'home',
});

@NgModule({
    imports: [RouterModule.forRoot(routes, { useHash: false })],
    exports: [RouterModule],
})
export class AppRoutingModule {}

```