Use right order to load apis.

src/app.js

@@ -334,10 +334,6 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   const themeModule = new ThemeModule(registry)
   registry.put({api: themeModule, name: 'themeModule'})
 
-  // ----------------- main view ----------------------
-  self._components.mainview = new MainView(appStore, appManager, mainPanelComponent)
-  registry.put({ api: self._components.mainview, name: 'mainview' })
-
   // ----------------- landing page ----------------------------
   // Need to have Home initialized before VerticalIconComponent render to access profile of it for icon
   const landingPage = new LandingPage(appManager, appStore)
@@ -349,6 +345,10 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   const swapPanel = new SwapPanel(appStore)
   const mainPanel = new MainPanel(appStore)
 
+  // ----------------- main view ----------------------
+  self._components.mainview = new MainView(appStore, appManager, mainPanel)
+  registry.put({ api: self._components.mainview, name: 'mainview' })
+
   // ----------------- Renderer -----------------
   const renderer = new Renderer()
   registry.put({api: renderer, name: 'renderer'})
@@ -370,16 +370,12 @@ Please make a backup of your contracts and start using http://remix.ethereum.org
   pluginManagerComponent.setApp(appManager)
   pluginManagerComponent.setStore(appStore)
 
-
   self._components.mainview.init()
 
-  // Need to have Home initialized before VerticalIconComponent render to access profile of it for icon
-  const landingPage = new LandingPage(appManager, appStore)
-
   self._components.fileManager.init()
   self._view.mainpanel.appendChild(self._components.mainview.render())
-  self._view.iconpanel.appendChild(verticalIconsComponent.render())
+  self._view.iconpanel.appendChild(verticalIcons.render())
-  self._view.swappanel.appendChild(swapPanelComponent.render())
+  self._view.swappanel.appendChild(swapPanel.render())
 
   let filePanel = new FilePanel()
   registry.put({api: filePanel, name: 'filepanel'})

src/app/panels/main-view.js

@@ -28,7 +28,7 @@ var css = csjs`
 `
 
 export class MainView {
-  constructor (appStore, appManager, mainPanelComponent) {
+  constructor (appStore, appManager, mainPanel) {
     var self = this
     self.event = new EventManager()
     self._view = {}
@@ -38,7 +38,7 @@ export class MainView {
     self._components.registry.put({api: self._components.editor, name: 'editor'})
     self.appStore = appStore
     self.appManager = appManager
-    self.mainPanelComponent = mainPanelComponent
+    self.mainPanel = mainPanel
   }
   init () {
     var self = this
@@ -52,7 +52,7 @@ export class MainView {
     self.tabProxy = new TabProxy(self._deps.fileManager, self._components.editor, self.appStore, self.appManager)
     let showApp = function (name) {
       self._deps.fileManager.unselectCurrentFile()
-      self.mainPanelComponent.showContent(name)
+      self.mainPanel.showContent(name)
       self._view.editor.style.display = 'none'
       self._components.contextView.hide()
       self._view.mainPanel.style.display = 'block'
@@ -178,7 +178,7 @@ export class MainView {
     if (self._view.el) return self._view.el
     self._view.editor = self._components.editor.render()
     self._view.editor.style.display = 'none'
-    self._view.mainPanel = self.mainPanelComponent.render()
+    self._view.mainPanel = self.mainPanel.render()
     self._view.terminal = self._components.terminal.render()
     self._view.content = yo`
       <div class=${css.content}>