Refresh application route after login

I would like to know what the correct way is to refresh my application route after a login, so that my model is loading correctly. At the moment i only get the desired results after hard refreshing the browser.

This is my application.js (app/routes/application.js)

import Ember from 'ember';

export default Ember.Route.extend({

  beforeModel: function() {
     return this.get("session").fetch().catch(function() {});
   },

  model() {
    console.log("Session is:" + this.get("session.uid"));
    if(this.get("session.uid")) {
      return this.store.find('user', this.get('session.uid')).then(function(user){
        return user;
      });
    }
  },

  actions: {
    accessDenied() {
      this.transitionTo('login');
    },
    logout: function() {
      this.get('session').close().then(function() {
        this.transitionTo('index');
      }.bind(this));
    }
  },
});

And my login.js (app/routes/login.js)

import Ember from 'ember';

export default Ember.Route.extend({
  beforeModel: function() {
    if(this.get('session.isAuthenticated')){
      this.transitionTo('dashboard');
    }
  },
  actions: {
    login: function() {
      var controller = this.get('controller');
      var email = controller.get('userEmail');
      var password = controller.get('userPassword');
      this.get('session').open('firebase', {
        provider: 'password',
        email: email,
        password: password
      }).then(function() {

        this.transitionTo('index');
      }.bind(this));
    }
  }
});

The problem takes place in my application.hbs template. In here i'm calling e.t.c.

This is my application.hbs (app/templates/application.js)

  <div class="sidebar-menu">
    <div class="brand">
      <strong>Project</strong>Todo
    </div>
    
  </div>
  <div class="main-content">
    <div class="topbar">
  <div class="current-user">
    <div class="media-object" data-toggle="example-dropdown">
      <div class="media-object-section">
          <div class="current-user-image" style='background-image:url()'>
          &nbsp;
        </div>
      </div>
      <div class="media-object-section middle">
          <svg role="img"><use xlink:href="/assets/icons.svg#icon-angle-down"></use></svg>
      </div>
    </div>
  </div>
  
    <ul class="menu vertical">
      <li>
        My Account
      </li>
      <li>
        View settings
      </li>
    </ul>
     <button >Logout</button>
  
</div>
    
      
        
      
    
      
  </div>