Fix Admin Panel Settings menu to show options correctly. Part 1.

Thanks to xet7 !

client/components/settings/settingBody.jade

@@ -3,9 +3,49 @@ template(name="setting")
     unless currentUser.isAdmin
       | {{_ 'error-notAuthorized'}}
     else
-      .content-title
-        i.fa.fa-cog
-        span {{_ 'settings'}}
+      .content-title.ext-box
+        if loading.get
+          +spinner
+        else if generalSetting.get
+          span
+            i.fa.fa-sign-in
+            | {{_ 'registration'}}
+        else if emailSetting.get
+          span
+            i.fa.fa-envelope
+            | {{_ 'email'}}
+        else if accountSetting.get
+          span
+            i.fa.fa-users
+            | {{_ 'accounts'}}
+        else if tableVisibilityModeSetting.get
+          span
+            i.fa.fa-eye
+            | {{_ 'tableVisibilityMode'}}
+        else if announcementSetting.get
+          span
+            i.fa.fa-bullhorn
+            | {{_ 'admin-announcement'}}
+        else if accessibilitySetting.get
+          span
+            i.fa.fa-universal-access
+            | {{_ 'accessibility'}}
+        else if layoutSetting.get
+          span
+            i.fa.fa-object-group
+            | {{_ 'layout'}}
+        else if webhookSetting.get
+          span
+            i.fa.fa-globe
+            | {{_ 'global-webhook'}}
+        else if attachmentSettings.get
+          span
+            i.fa.fa-paperclip
+            | {{_ 'attachments'}}
+        else if cronSettings.get
+          span
+            i.fa.fa-clock-o
+            | {{_ 'cron'}}
       .content-body
         .side-menu
           ul
@@ -51,28 +91,28 @@ template(name="setting")
                 i.fa.fa-clock-o
                 | {{_ 'cron'}}
         .main-body
-          if loading
+          if loading.get
             +spinner
-          else if attachmentSettings
+          else if attachmentSettings.get
             +attachmentSettings
-          else if cronSettings
+          else if cronSettings.get
             +cronSettings
-          else if generalSetting
+          else if generalSetting.get
             +general
-          else if emailSetting
+          else if emailSetting.get
             unless isSandstorm
               +email
-          else if accountSetting
+          else if accountSetting.get
             +accountSettings
-          else if tableVisibilityModeSetting
+          else if tableVisibilityModeSetting.get
             +tableVisibilityModeSettings
-          else if announcementSetting
+          else if announcementSetting.get
             +announcementSettings
-          else if accessibilitySetting
+          else if accessibilitySetting.get
             +accessibilitySettings
-          else if layoutSetting
+          else if layoutSetting.get
             +layoutSettings
-          else if webhookSetting
+          else if webhookSetting.get
             +webhookSettings
 
 template(name="webhookSettings")

client/components/settings/settingBody.js

@@ -8,7 +8,7 @@ BlazeComponent.extendComponent({
   onCreated() {
     this.error = new ReactiveVar('');
     this.loading = new ReactiveVar(false);
-    this.forgotPasswordSetting = new ReactiveVar(true);
+    this.forgotPasswordSetting = new ReactiveVar(false);
     this.generalSetting = new ReactiveVar(true);
     this.emailSetting = new ReactiveVar(false);
     this.accountSetting = new ReactiveVar(false);
@@ -152,24 +152,44 @@ BlazeComponent.extendComponent({
       $('.side-menu li.active').removeClass('active');
       target.parent().addClass('active');
       const targetID = target.data('id');
-      this.forgotPasswordSetting.set('forgot-password-setting' === targetID);
-      this.generalSetting.set('registration-setting' === targetID);
-      this.emailSetting.set('email-setting' === targetID);
-      this.accountSetting.set('account-setting' === targetID);
-      this.announcementSetting.set('announcement-setting' === targetID);
-      this.accessibilitySetting.set('accessibility-setting' === targetID);
-      this.layoutSetting.set('layout-setting' === targetID);
-      this.webhookSetting.set('webhook-setting' === targetID);
-      this.attachmentSettings.set('attachment-settings' === targetID);
-      this.cronSettings.set('cron-settings' === targetID);
       
-      // Initialize sub-menu states
-      if ('attachment-settings' === targetID) {
+      // Reset all settings to false
+      this.forgotPasswordSetting.set(false);
+      this.generalSetting.set(false);
+      this.emailSetting.set(false);
+      this.accountSetting.set(false);
+      this.tableVisibilityModeSetting.set(false);
+      this.announcementSetting.set(false);
+      this.accessibilitySetting.set(false);
+      this.layoutSetting.set(false);
+      this.webhookSetting.set(false);
+      this.attachmentSettings.set(false);
+      this.cronSettings.set(false);
+      
+      // Set the selected setting to true
+      if (targetID === 'registration-setting') {
+        this.generalSetting.set(true);
+      } else if (targetID === 'email-setting') {
+        this.emailSetting.set(true);
+      } else if (targetID === 'account-setting') {
+        this.accountSetting.set(true);
+      } else if (targetID === 'tableVisibilityMode-setting') {
+        this.tableVisibilityModeSetting.set(true);
+      } else if (targetID === 'announcement-setting') {
+        this.announcementSetting.set(true);
+      } else if (targetID === 'accessibility-setting') {
+        this.accessibilitySetting.set(true);
+      } else if (targetID === 'layout-setting') {
+        this.layoutSetting.set(true);
+      } else if (targetID === 'webhook-setting') {
+        this.webhookSetting.set(true);
+      } else if (targetID === 'attachment-settings') {
+        this.attachmentSettings.set(true);
         this.initializeAttachmentSubMenu();
-      } else if ('cron-settings' === targetID) {
+      } else if (targetID === 'cron-settings') {
+        this.cronSettings.set(true);
         this.initializeCronSubMenu();
       }
-      this.tableVisibilityModeSetting.set('tableVisibilityMode-setting' === targetID);
     }
   },