Login best option passing from single page layout to tabbed app layout?

Questions
1

Hi,

despite having read the various forum posts, some quite outdated so I don’t know if they are still viable solutions, I haven’t understood (sure a noob problem) how to implement the login logic by loading a specific (overlaying) page in a tabbed app layout with multiple separated tabs/views.

In a single page views scenario, using js/core f7 version, I am doing this and works as expected:

index.html, main app, empty:

only the divs “app”, “views” and “view view-main”

app.js, after the app initialization:


var mainView = app.views.create('.view-main', { url: '/'});
routes.js, load one page or the other depending on user condition 

{
  path: '/',
     async({ resolve }) {
       if (userIsLoggedIn) {
          resolve({ url: './pages/home.html' });        
       }  else  {
          resolve({ url: './pages/login.html' });
       }
    }
 },
or with the cordova plugin I'm using: 

{
  path: '/',
  async({ resolve }) {
    firebase.auth.getCurrentUser()
      .then(user => {
        if (user) {
          resolve({ url: './pages/home.html' });
        } else {
          resolve({ url: './pages/fb-login.html' });
        }
      })
      .catch(error => {
         console.error('Firebase auth error: ', error);
         resolve({ url: './pages/fb-login.html' });
     });
}
Best options for the same result in a tabbed multi-views app ?

Thanks,
Alessandro

2

I dont know if your tab views are routable or not. But those routes for tabs, can also have the same async code you did there in the routes… right?

So i think there is no real issue by creating a function “loginProtectedPage(url)” where you apply all that

logic you already have. And make the resolve param come from the url param of the function arguments. Then you just reuse that loginProtectedPage(‘./pages/home.html’) or loginProtectedPage(‘./pages/userProfile.html’) …etc… in all your routes?

3

Thanks for the reply Miguel,

my tab views are not routable, are Views as Tabs.
Yesterday I found a different solution but not so clean,
I thinkg I should try the Routable Tabs to have more control over navigation and code.