title: Sencha Touch: destroy panel on logout
body: <p>When user logs out, I want to remove all the panels, specifically the main entry to the app after the login page which is the "Main.js" and its subviews like 'My Data' that you see below, the reason is that I want to make sure the right store data will be loaded and not show the old data.</p>
  
  <p>However, I am not sure how to do this and the best practices to unload stores / remove views when the user logs out.</p>
  
  <p>What are the best practices to handling user Logout?</p>
  
  <p>Main.js</p>
  
  <pre><code>Ext.define('app.view.Main', {
  
  extend: 'Ext.tab.Panel',
  
  xtype: 'main',
  
  requires: [
      'app.view.TeacherPanel',
      'app.view.ParentPanel',
      'app.view.AboutPanel',
      'app.view.user.Profile'
  ],
  
  config: {
  
      tabBarPosition: 'bottom',
  
  },
  
  initialize: function() {
  
      console.log('main.initialize');
  
      this.callParent(arguments);
  
      // add data panel
      var dataPanel = {
          title: 'My Data',
          iconCls: 'home',
          xtype: eMaliApp.services.App.getActivePanel()
          store: 'somestore' // i want this to be reloaded
      };
      this.add(dataPanel);
  
      // add user panel
      var profilePanel = {
          title: 'Profile',
          iconCls: 'user',
          xtype: 'userprofile'
      };
      this.add(profilePanel);
  
      // add about panel
      var aboutPanel = {
          title: 'About',
          iconCls: 'info',
          xtype: 'aboutpanel'
      };
      this.add(aboutPanel);
  
      // Load general app data
      app.services.Store.loadSomeStores();
  }
  </code></pre>
  
  <p>});</p>
  
  <p>Profile.js </p>
  
  <pre><code>onLogoutTap: function(e) {
      Ext.Ajax.request({
          url: 'session/mobileLogout',
          method: 'POST',
          useDefaultXhrHeader: false,
          withCredentials: true,
          callback: function(options, success, response) {
              if (!success) {
                  console.log('Logout failed, redirecting to login page anyway');
              }
              //Ext.getCmp('main').destroy(); // should be so
              Ext.Viewport.removeAll(true, true); // does not remove main
              Ext.Viewport.add(Ext.create('app.view.LoginPanel'));
          }
      });
  }
  </code></pre>