home tab activation

src/app/components/vertical-icons.js

@@ -196,11 +196,19 @@ export class VerticalIcons {
    * @param {string} name Name of profile of the module to activate
    */
   select (name) {
-    this.removeActive()
-    this.addActive(name)
+    this.updateActivations(name)
     this.events.emit('showContent', name)
   }
 
+  updateActivations(name) {
+    if (name === "home") {
+      this.activateHome()
+    } else {
+      this.removeActive()
+      this.addActive(name)
+    }
+  }
+
   onThemeChanged (themeType) {
     const invert = themeType === 'dark' ? 1 : 0
     const active = this.view.querySelector(`.${css.active}`)
@@ -211,17 +219,20 @@ export class VerticalIcons {
   }
 
   _iconClick (name) {
-    this.removeActive()
-    this.addActive(name)
+    this.updateActivations(name)
     this.events.emit('toggleContent', name)
   }
 
+  activateHome() {
+    globalRegistry.get('appmanager').api.ensureActivated('home')
+  }
+
   render () {
     let home = yo`
     <div
       class="${css.homeIcon}"
       onclick="${(e) => {
-        globalRegistry.get('appmanager').api.ensureActivated('home')
+        this.activateHome()
       }}"
       plugin="${this.homeProfile.name}" title="${this.homeProfile.displayName}"
     >
@@ -345,15 +356,15 @@ export class VerticalIcons {
 
     this.view = yo`
       <div class=${css.icons}>
-      ${home}
-      ${this.iconKind['fileexplorer']}
-      ${this.iconKind['compile']}
-      ${this.iconKind['run']}
-      ${this.iconKind['testing']}
-      ${this.iconKind['analysis']}
-      ${this.iconKind['debugging']}
-      ${this.iconKind['other']}
-      ${this.iconKind['settings']}
+        ${home}
+        ${this.iconKind['fileexplorer']}
+        ${this.iconKind['compile']}
+        ${this.iconKind['run']}
+        ${this.iconKind['testing']}
+        ${this.iconKind['analysis']}
+        ${this.iconKind['debugging']}
+        ${this.iconKind['other']}
+        ${this.iconKind['settings']}
       </div>
     `
     return this.view

src/app/ui/landing-page/landing-page.js

@@ -96,9 +96,12 @@ export class LandingPage extends BaseApi {
     let load = function (service, item, examples, info) {
       let compilerImport = new CompilerImport()
       let fileProviders = globalRegistry.get('fileproviders').api
-      const msg = yo`<div class="p-2"><span>Enter the ${item} you would like to load.</span>
-      <div>${info}</div>
-      <div>e.g ${examples.map((url) => { return yo`<div class="p-1"><a>${url}</a></div>` })}</div></div>`
+      const msg = yo`
+        <div class="p-2">
+          <span>Enter the ${item} you would like to load.</span>
+          <div>${info}</div>
+          <div>e.g ${examples.map((url) => { return yo`<div class="p-1"><a>${url}</a></div>` })}</div>
+        </div>`
 
       modalDialogCustom.prompt(`Import from ${service}`, msg, null, (target) => {
         if (target !== '') {

src/framingService.js

@@ -11,7 +11,7 @@ export default {
     })
 
     verticalIcon.select('fileExplorers')
-    mainPanel.showContent('home')
+    verticalIcon.select('home')
 
     document.addEventListener('keypress', (e) => {
       if (e.shiftKey && e.ctrlKey) {