fix: #768 topbar navigation style restored

frontend/package-lock.json

@@ -17,10 +17,10 @@
 				"@xterm/addon-fit": "^0.11.0",
 				"@xterm/xterm": "^6.0.0",
 				"iconify-icon": "^3.0.2",
-				"picocrank": "^1.12.1",
+				"picocrank": "^1.13.0",
 				"standard": "^17.1.2",
 				"unplugin-vue-components": "^30.0.0",
-				"vite": "^7.3.0",
+				"vite": "^7.3.1",
 				"vue-i18n": "^11.2.8",
 				"vue-router": "^4.6.4"
 			},
@@ -2961,9 +2961,9 @@
 			}
 		},
 		"node_modules/femtocrank": {
-			"version": "2.4.12",
+			"version": "2.5.0",
-			"resolved": "https://registry.npmjs.org/femtocrank/-/femtocrank-2.4.12.tgz",
+			"resolved": "https://registry.npmjs.org/femtocrank/-/femtocrank-2.5.0.tgz",
-			"integrity": "sha512-X2a4WVG1ADGjQcULUyH2FJ4njJNZobfP+iPO1MpAEtWRyVEDxps6dmktbOb3igoyCxNObF0T0uKwUC7zV21C0A==",
+			"integrity": "sha512-plV1HNS/fUzohWJ349kuCBZ3TCfXz7V4F/sY2lVbVWtGXUV+aHxLG6IddAMEf64k2LJ8j0KVrj+nIIKepFaKvg==",
 			"license": "AGPL-3.0"
 		},
 		"node_modules/file-entry-cache": {
@@ -4607,17 +4607,17 @@
 			"license": "ISC"
 		},
 		"node_modules/picocrank": {
-			"version": "1.12.1",
+			"version": "1.13.0",
-			"resolved": "https://registry.npmjs.org/picocrank/-/picocrank-1.12.1.tgz",
+			"resolved": "https://registry.npmjs.org/picocrank/-/picocrank-1.13.0.tgz",
-			"integrity": "sha512-2qcIcveWQkkA2Wyo+KQdZANTbjb/9ydzinbpNN/1U/4x0BBUjyHhWoK5lNAx/KDVNl6ZM3xGo3eMb5/n6xWoVA==",
+			"integrity": "sha512-kfUU2KVZnHyZ3/s+vM2tw25G+rK//eMjhF7cuXNQm0Ar/o5YvPiLBx8uxCrNNNvhGqb+jQK1Jbn41KO6rAR8Lw==",
 			"license": "ISC",
 			"dependencies": {
-				"@hugeicons/core-free-icons": "^3.1.0",
+				"@hugeicons/core-free-icons": "^3.1.1",
 				"@hugeicons/vue": "^1.0.4",
 				"@vitejs/plugin-vue": "^6.0.3",
-				"femtocrank": "^2.4.12",
+				"femtocrank": "^2.5.0",
 				"unplugin-vue-components": "^30.0.0",
-				"vite": "^7.3.0",
+				"vite": "^7.3.1",
 				"vue": "^3.5.26",
 				"vue-router": "^4.6.4"
 			}
@@ -6122,9 +6122,9 @@
 			}
 		},
 		"node_modules/vite": {
-			"version": "7.3.0",
+			"version": "7.3.1",
-			"resolved": "https://registry.npmjs.org/vite/-/vite-7.3.0.tgz",
+			"resolved": "https://registry.npmjs.org/vite/-/vite-7.3.1.tgz",
-			"integrity": "sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==",
+			"integrity": "sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==",
 			"license": "MIT",
 			"dependencies": {
 				"esbuild": "^0.27.0",

frontend/package.json

@@ -30,10 +30,10 @@
 		"@xterm/addon-fit": "^0.11.0",
 		"@xterm/xterm": "^6.0.0",
 		"iconify-icon": "^3.0.2",
-		"picocrank": "^1.12.1",
+		"picocrank": "^1.13.0",
 		"standard": "^17.1.2",
 		"unplugin-vue-components": "^30.0.0",
-		"vite": "^7.3.0",
+		"vite": "^7.3.1",
 		"vue-i18n": "^11.2.8",
 		"vue-router": "^4.6.4"
 	}

frontend/resources/vue/App.vue

@@ -1,5 +1,5 @@
 <template>
-    <Header :title="pageTitle" :logoUrl="logoUrl" @toggleSidebar="toggleSidebar" :sidebarEnabled="showNavigation">
+    <Header :title="pageTitle" :logoUrl="logoUrl" @toggleSidebar="toggleSidebar" :sidebarEnabled="sidebarEnabled" :topBarEnabled="topbarEnabled" :navigation="navigation">
         <template #toolbar>
             <div id="banner" v-if="bannerMessage" :style="bannerCss">
                 <p>{{ bannerMessage }}</p>
@@ -19,8 +19,8 @@
     </Header>
 
     <div id="layout">
-        <Navigation ref="navigation" v-if="showNavigation">
+        <Navigation ref="navigation">
-            <Sidebar ref="sidebar" id = "mainnav" v-if="showNavigation" />
+            <Sidebar ref="sidebar" id = "mainnav" v-if="sidebarEnabled && showNavigation"/>
         </Navigation>
 
 		<div id="content" initial-martial-complete="{{ hasLoaded }}">
@@ -108,6 +108,7 @@ const showNavigation = ref(true)
 const showLogs = ref(true)
 const showDiagnostics = ref(true)
 const showLoginLink = ref(true)
+const sectionNavigationStyle = ref('sidebar')
 
 const languageDialog = ref(null)
 const browserLanguages = ref([])
@@ -135,6 +136,15 @@ const currentLanguageName = computed(() => {
     return availableLanguages[languagePreference.value] || languagePreference.value
 })
 
+// Computed properties for navigation style
+const topbarEnabled = computed(() => {
+    return sectionNavigationStyle.value === 'topbar'
+})
+
+const sidebarEnabled = computed(() => {
+    return sectionNavigationStyle.value !== 'topbar' && showNavigation.value
+})
+
 function normalizeBrowserLanguage() {
     const available = Object.keys(combinedTranslations.messages || {})
 
@@ -180,6 +190,7 @@ function updateHeaderFromInit() {
     showNavigation.value = window.initResponse.showNavigation
     showLogs.value = window.initResponse.showLogList
     showDiagnostics.value = window.initResponse.showDiagnostics
+    sectionNavigationStyle.value = window.initResponse.sectionNavigationStyle || 'sidebar'
 
     if (!window.initResponse.authLocalLogin && window.initResponse.oAuth2Providers.length === 0) {
         showLoginLink.value = false