Multi page app with side menu and tabs

Hello,
I have an app i’m building which has a side menu - which should be available on all pages.
Some child pages will also have tabs.

I have managed to get it partially working - i can have a menu and tabs showing, but when i add the the top menu button disappears.

This is how i have set out my config -
My dashboard page uses the ‘menuContent’ template and thats all fine
My Tabs page also uses the menuContent, but then within it has the ion-tabs ( see below )

.>

state(‘app’, {
url: “/app”,
abstract: true,
scope:{},
templateUrl: “src/menu.html”,
controller: ‘AppMenu’
})

.state('login', {
    url: "/login",
    templateUrl: "src/login.html",
    controller: 'login'
})
.state('app.dashboard', {
    url: "/dashboard",
    views: {
        'menuContent': {
            templateUrl: "src/dashboard.html",
            controller: 'dashboard'
        }
    }
})
.state('app.tabs', {
    url: "/tabs",
    views: {
        'menuContent': {
            templateUrl: 'src/tabs.html'
        }
    }
})
 
.state('app.tabs.tabOne', {
    url: "/tabOne",
    views: {
        'tabOne': {
            templateUrl: "src/tabOne.html"
        }
    }
})

This is the code form the tabOne.html page

Hello
        </ion-content>
    </ion-tab>
    <ion-tab title="Two">
    </ion-tab>
    <ion-tab title="Three">
    </ion-tab>
</ion-tabs>

But when ever i navigate to the page and its shows the tabs - the menu button is missing.
If however i just enter an incorrect name for the and have the content inline on the age the menu button shows.

Please help - how can i get the menu button to show across all pages.

I have tried the enable-menu-with-back-views=“true” but that done nothing.