Bind type together

src/lib/components/navbar.svelte

@@ -1,3 +1,13 @@
+<script lang="ts" context="module">
+    export type NavbarProject = {
+        name: string;
+        $id: string;
+        isSelected: boolean;
+        platformCount: number;
+        pingCount: number;
+    };
+</script>
+
 <script lang="ts">
     import {
         Navbar,
@@ -45,13 +55,7 @@
             isSelected: boolean;
             showUpgrade: boolean;
             tierName: string;
-            projects: Array<{
-                name: string;
-                $id: string;
-                isSelected: boolean;
-                platformCount: number;
-                pingCount: number;
-            }>;
+            projects: Array<NavbarProject>;
         }>;
         showAccountMenu: boolean;
     };

src/lib/layout/shell.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
     import { beforeNavigate } from '$app/navigation';
     import { Navbar, Sidebar } from '$lib/components';
+    import { type NavbarProject } from '$lib/components/navbar.svelte';
     import { page } from '$app/stores';
     import { log } from '$lib/stores/logs';
     import { wizard } from '$lib/stores/wizard';
@@ -22,13 +23,7 @@
     export let showSideNavigation = false;
     export let showHeader = true;
     export let showFooter = true;
-    export let loadedProjects: Array<{
-        name: string;
-        $id: string;
-        isSelected: boolean;
-        platformCount: number;
-        pingCount: number;
-    }> = [];
+    export let loadedProjects: Array<NavbarProject> = [];
     export let projects: Array<Models.Project> = [];
 
     $: selectedProject = loadedProjects.find((project) => project.isSelected);