Ion-back-button not working when I have ion-tabs in the page

I have three pages

[HOME] ->[Search]->[Feed]

I use this.navCtrl.navigateForward to navigate next page, in all the three pages I use ion-back-button in the ion-header

 <ion-buttons slot="start">
      <ion-back-button text="" defaultHref="home" fill="clear" icon="chevron-back-outline" ></ion-back-button>
 </ion-buttons>

All of those three pages are configured as children of page component

pages.page.html

<ion-router-outlet></ion-router-outlet>
<app-footer></app-footer>

app-footer is custom component it has ion-tabs. If I remove <app-footer></app-footer>, back button taking me to previous page correctly, but it’s there, it always takes me to defaultHref="/home" page