From 0fe1641433d4d9ac2c8677bef8d22b1e2446ab81 Mon Sep 17 00:00:00 2001
From: ernstmul <ernst.mulders@gmail.com>
Date: Wed, 12 Feb 2025 13:28:37 +0100
Subject: [PATCH] Add connect button to top of navigation

---
 src/lib/components/navbar.svelte    | 15 ++++++++++++++-
 src/lib/layout/shell.svelte         |  8 +++++++-
 src/routes/(console)/+layout.svelte |  4 +++-
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/lib/components/navbar.svelte b/src/lib/components/navbar.svelte
index 97d6d6f6c..5029b07ae 100644
--- a/src/lib/components/navbar.svelte
+++ b/src/lib/components/navbar.svelte
@@ -45,7 +45,13 @@
             isSelected: boolean;
             showUpgrade: boolean;
             tierName: string;
-            projects: Array<{ name: string; $id: string; isSelected: boolean }>;
+            projects: Array<{
+                name: string;
+                $id: string;
+                isSelected: boolean;
+                platformCount: number;
+                pingCount: number;
+            }>;
         }>;
         showAccountMenu: boolean;
     };
@@ -84,6 +90,7 @@
         updateTheme(activeTheme);
     }
     $: currentOrg = organizations.find((org) => org.isSelected);
+    $: selectedProject = currentOrg?.projects.find((project) => project.isSelected);
 </script>
 
 <Navbar.Base {...$$props}>
@@ -101,6 +108,12 @@
             <img src={logo.src} alt={logo.alt} />
         </a>
         <Breadcrumbs {organizations} />
+        {#if selectedProject.pingCount === 0}
+            <Button.Anchor
+                href={`${base}/project-${selectedProject.$id}/get-started`}
+                variant="secondary"
+                size="xs">Connect</Button.Anchor>
+        {/if}
     </div>
     <div slot="right" class="only-desktop">
         <div class="right">
diff --git a/src/lib/layout/shell.svelte b/src/lib/layout/shell.svelte
index 476edf9db..09b88cd3e 100644
--- a/src/lib/layout/shell.svelte
+++ b/src/lib/layout/shell.svelte
@@ -22,7 +22,13 @@
     export let showSideNavigation = false;
     export let showHeader = true;
     export let showFooter = true;
-    export let loadedProjects: Array<{ name: string; $id: string; isSelected: boolean }> = [];
+    export let loadedProjects: Array<{
+        name: string;
+        $id: string;
+        isSelected: boolean;
+        platformCount: number;
+        pingCount: number;
+    }> = [];
     export let projects: Array<Models.Project> = [];
 
     $: selectedProject = loadedProjects.find((project) => project.isSelected);
diff --git a/src/routes/(console)/+layout.svelte b/src/routes/(console)/+layout.svelte
index 975070f9c..e5969da70 100644
--- a/src/routes/(console)/+layout.svelte
+++ b/src/routes/(console)/+layout.svelte
@@ -69,7 +69,9 @@
         return {
             name: project?.name,
             $id: project.$id,
-            isSelected: data.currentProjectId === project.$id
+            isSelected: data.currentProjectId === project.$id,
+            platformCount: project.platforms.length,
+            pingCount: project.pingCount
         };
     });