From 9d0ca37160121ba643c86dcb00d67c0f4272f1fc Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 5 Mar 2026 02:31:05 +0000
Subject: [PATCH 1/3] Initial plan


From 3a6d87cd9fe379211b0da89c8d0c77821326b940 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 5 Mar 2026 02:36:55 +0000
Subject: [PATCH 2/3] Fix Integrations tab selection not matching nested routes

Co-authored-by: stnguyen90 <1477010+stnguyen90@users.noreply.github.com>
---
 .../project-[region]-[project]/overview/+layout.svelte          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte b/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
index 4c6fb4341a..1d89e9152f 100644
--- a/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
+++ b/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
@@ -53,7 +53,7 @@
     }
 
     function isTabSelected(key: string) {
-        return page.url.pathname.endsWith(`/${key}`);
+        return page.url.pathname.split('/').includes(key);
     }
 
     $: $registerCommands([

From 010f2f865a1f47f7e5ee34deb2ab084d84b4cb62 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Thu, 5 Mar 2026 02:53:47 +0000
Subject: [PATCH 3/3] Fix tab reactivity by passing page.url.pathname directly
 in template

Co-authored-by: stnguyen90 <1477010+stnguyen90@users.noreply.github.com>
---
 .../project-[region]-[project]/overview/+layout.svelte | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte b/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
index 1d89e9152f..d12ea97f81 100644
--- a/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
+++ b/src/routes/(console)/project-[region]-[project]/overview/+layout.svelte
@@ -52,8 +52,8 @@
         return usage.load(dates.start, dates.end, dates.period);
     }
 
-    function isTabSelected(key: string) {
-        return page.url.pathname.split('/').includes(key);
+    function isTabSelected(key: string, pathname: string) {
+        return pathname.split('/').includes(key);
     }
 
     $: $registerCommands([
@@ -227,17 +227,17 @@
                         noscroll
                         event="platforms"
                         href={`${path}/platforms`}
-                        selected={isTabSelected('platforms')}>Platforms</Tab>
+                        selected={isTabSelected('platforms', page.url.pathname)}>Platforms</Tab>
                     <Tab
                         noscroll
                         event="api-keys"
                         href={`${path}/api-keys`}
-                        selected={isTabSelected('api-keys')}>API keys</Tab>
+                        selected={isTabSelected('api-keys', page.url.pathname)}>API keys</Tab>
                     <Tab
                         noscroll
                         event="dev-keys"
                         href={`${path}/dev-keys`}
-                        selected={isTabSelected('dev-keys')}>Dev keys</Tab>
+                        selected={isTabSelected('dev-keys', page.url.pathname)}>Dev keys</Tab>
                 </Tabs>
                 {#if $action}
                     <svelte:component this={$action} />