From 346fb06165cf9904132fc33816499c83e37a7d6d Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Tue, 13 Dec 2022 15:55:59 +0000
Subject: [PATCH] Fix top nav colours and fix selected tab not updating

---
 packages/bbui/src/Tabs/Tab.svelte             |  3 +-
 .../src/pages/builder/portal/_layout.svelte   | 31 ++++++++++---------
 .../builder/portal/settings/_layout.svelte    | 10 ------
 3 files changed, 18 insertions(+), 26 deletions(-)

diff --git a/packages/bbui/src/Tabs/Tab.svelte b/packages/bbui/src/Tabs/Tab.svelte
index c25be7dbc9..637371ded2 100644
--- a/packages/bbui/src/Tabs/Tab.svelte
+++ b/packages/bbui/src/Tabs/Tab.svelte
@@ -82,7 +82,8 @@
   .spectrum-Tabs-item {
     color: var(--spectrum-global-color-gray-600);
   }
-  .spectrum-Tabs-item.is-selected {
+  .spectrum-Tabs-item.is-selected,
+  .spectrum-Tabs-item:hover {
     color: var(--spectrum-global-color-gray-900);
   }
 </style>
diff --git a/packages/builder/src/pages/builder/portal/_layout.svelte b/packages/builder/src/pages/builder/portal/_layout.svelte
index ff735fbc76..336867f5de 100644
--- a/packages/builder/src/pages/builder/portal/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/_layout.svelte
@@ -1,5 +1,5 @@
 <script>
-  import { isActive, redirect, goto } from "@roxi/routify"
+  import { isActive, redirect, goto, url } from "@roxi/routify"
   import {
     Icon,
     Avatar,
@@ -16,7 +16,7 @@
   import UpdateUserInfoModal from "components/settings/UpdateUserInfoModal.svelte"
   import ChangePasswordModal from "components/settings/ChangePasswordModal.svelte"
   import Logo from "assets/bb-emblem.svg"
-  import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
+  // import { isEnabled, TENANT_FEATURE_FLAGS } from "helpers/featureFlags"
 
   let loaded = false
   let userInfoModal
@@ -25,6 +25,18 @@
   let activeTab = "Apps"
 
   $: menu = buildMenu($auth.isAdmin)
+  $: $url(), updateActiveTab()
+
+  const updateActiveTab = () => {
+    for (let entry of menu) {
+      if ($isActive(entry.href)) {
+        if (activeTab !== entry.title) {
+          activeTab = entry.title
+        }
+        break
+      }
+    }
+  }
 
   const buildMenu = admin => {
     let menu = [
@@ -64,7 +76,7 @@
     }
 
     // add link to account portal if the user has access
-    let accountSectionAdded = false
+    // let accountSectionAdded = false
 
     // link out to account-portal if account holder in cloud or always in self-host
     // if ($auth?.user?.accountPortalAccess || (!$adminStore.cloud && admin)) {
@@ -146,14 +158,6 @@
         loaded = true
       }
     }
-
-    // Find selected tab
-    for (let entry of menu) {
-      if ($isActive(entry.href)) {
-        activeTab = entry.title
-        break
-      }
-    }
   })
 </script>
 
@@ -255,10 +259,7 @@
     padding: 7px 0;
   }
   .nav :global(.spectrum-Tabs-itemLabel) {
-    color: #d0d0d0;
-  }
-  .nav :global(.spectrum-Tabs-item.is-selected .spectrum-Tabs-itemLabel) {
-    color: #ffffff;
+    font-weight: 600;
   }
   .branding {
     display: grid;
diff --git a/packages/builder/src/pages/builder/portal/settings/_layout.svelte b/packages/builder/src/pages/builder/portal/settings/_layout.svelte
index 142196bd91..c1103bdaa7 100644
--- a/packages/builder/src/pages/builder/portal/settings/_layout.svelte
+++ b/packages/builder/src/pages/builder/portal/settings/_layout.svelte
@@ -43,16 +43,6 @@
           url={$url("./upgrade")}
           active={$isActive("./upgrade")}
         />
-        <SideNavItem
-          text="Secrets"
-          url={$url("./secrets")}
-          active={$isActive("./secrets")}
-        />
-        <SideNavItem
-          text="Scheduled Backups"
-          url={$url("./backups")}
-          active={$isActive("./backups")}
-        />
       </SideNav>
     </div>
     <slot />