Add NavbarLinks component

2025-09-24 00:54:32 +02:00 · 2023-08-24 09:22:12 +02:00
parent 80be78604f
commit 204901189d
2 changed files with 78 additions and 101 deletions
--- a/web/frontend/src/NavbarLinks.svelte
+++ b/web/frontend/src/NavbarLinks.svelte
@@ -0,0 +1,39 @@
+<script>
+    import {
+        Icon,
+        NavLink,
+        Dropdown,
+        DropdownToggle,
+        DropdownMenu,
+        DropdownItem,
+    } from "sveltestrap";
+
+    export let clusters; // array of names
+    export let links; // array of nav links
+</script>
+
+{#each links as item}
+    {#if !item.perCluster}
+        <NavLink href={item.href} active={window.location.pathname == item.href}
+            ><Icon name={item.icon} /> {item.title}</NavLink
+        >
+    {:else}
+        <Dropdown nav inNavbar>
+            <DropdownToggle nav caret>
+                <Icon name={item.icon} />
+                {item.title}
+            </DropdownToggle>
+            <DropdownMenu class="dropdown-menu-lg-end">
+                {#each clusters as cluster}
+                    <DropdownItem
+                        href={item.href + cluster.name}
+                        active={window.location.pathname ==
+                            item.href + cluster.name}
+                    >
+                        {cluster.name}
+                    </DropdownItem>
+                {/each}
+            </DropdownMenu>
+        </Dropdown>
+    {/if}
+{/each}