Description:
Hi,

First, thanks for your code.
However there is actually a user-case witch create a bug:

0- Open the dev chrome console
1- SignIn (or SignUp) via google auth
2- When you reach /profile, refresh your browser (F5), you'll be auto-signed to the app
3- Click on logout when you are on the profile/ route.

This error display: Cannot read property 'name' of null

I think the logout make a change somewhere and the component try to reload but as we have destroy the session, the name became null

Can you help me ?

Thanks

Hello!

I saw that the app has many icons. I cannot find the tool for generating them.

Can you help me/us?

Thanks!

First I want to thank you for this good starting point!

I have a problem with the routing system here, as I cannot reach /profile or /dashboard (whatever restricted route given), as it redirects me always to the "/" home page.

I do not want to have a seperate /signup and /signIn page, so I store them in a dialog and the login and signup itself works fine and as expected.

Somehow, within the auth-guard.js I set in the else condition next('/') instead next('/signup') (as I dont want to have this extra route)

Is this maybe causing the problem? I did not make any other changes to your code, besides this one.

If you need further information, please contact me.

Here is my router index.js and auth-guard.js

import Vue from 'vue'
import Router from 'vue-router'
import AuthGuard from './auth-guard'


const Home = () => import('@/components/Home')
const Profile = () => import('@/components/User/Profile')
const Dashboard = () => import('@/components/Dashboard/Layout')

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },
    {
      path: '/dashboard',
      name: 'Dashboard',
      component: Dashboard,
      beforeEnter: AuthGuard
    },
    {
      path: '/profile',
      name: 'Profile',
      component: Profile,
      beforeEnter: AuthGuard,
      children: [
        {
          path: '/settings',
          name: 'Settings',
          component: () => import('@/components/User/Settings')
        }
      ]
    }
  ],
  mode: 'history'
})

and the auth-guard.js

import {store} from '../store'

export default (to, from, next) => {
  if (store.getters.user) {
    next()
  } else {
    next('/')
  }
}

There is no forgot password option in this template. It would be very helpful if that is also in place. Thank you.

Hi,

I like your App a good point to start but as a new user to Vue, I'll make an offer to add the Email Link Authentication.

That isn't hard, where to put the callback though?

If in the main.js the guard will not allow access to the /profile so user will be back to the /signin then the answer from Firebase will come and the user will be redirected back to the /profile.

Setting the flag loading: false doesn't work either because the user almost certainly will be back to the new tab by the email link.

This is how it works in my app right now. Doesn't looks right.

As I said I'm new to Vue I'll be glad to see a right way to add this way of Authentication.