feat: Add option to hide navigation elements

- Add hide-navigation-elements.sh entrypoint script that patches
  data-hide-navigation-elements in index.html at container startup
- Register script in frontend Dockerfile under /docker-entrypoint.d/
- Add data-hide-navigation-elements="false" attribute to index.html
meta tag
- Export hideNavigationElements constant from api/index.ts
- Read hideNavigationElements in App.tsx to conditionally render the
sidebar, topbar, and footer
- Expose HIDE_NAVIGATION_ELEMENTS env var in docker-compose.yml

Signed-off-by: Jasmina <jasmina.piric@secomind.com>

Author: JasminaPiric

docker-compose.yml

@@ -90,6 +90,7 @@ services:
       context: frontend
     environment:
       BACKEND_URL: http://api.${DOCKER_COMPOSE_EDGEHOG_BASE_DOMAIN}/
+      HIDE_NAVIGATION_ELEMENTS: ${HIDE_NAVIGATION_ELEMENTS:-false}
     restart: on-failure
     labels:
       - "traefik.enable=true"

frontend/Dockerfile

@@ -1,4 +1,4 @@
-# SPDX-FileCopyrightText: 2021-2025 SECO Mind Srl
+# SPDX-FileCopyrightText: 2021-2026 SECO Mind Srl
 # SPDX-License-Identifier: Apache-2.0
 FROM node:24.11.0 AS builder
 
@@ -13,3 +13,4 @@ FROM nginx:1
 COPY --from=builder /app/build/ /usr/share/nginx/html/
 ADD nginx.conf /etc/nginx/conf.d/default.conf
 ADD set-backend-url.sh /docker-entrypoint.d/set-backend-url.sh
+ADD hide-navigation-elements.sh /docker-entrypoint.d/hide-navigation-elements.sh

frontend/hide-navigation-elements.sh

@@ -0,0 +1,9 @@
+#!/bin/sh
+# SPDX-FileCopyrightText: 2026 SECO Mind Srl
+# SPDX-License-Identifier: Apache-2.0
+
+# This will replace the default value in index.html
+# ${SECO_GARAGE_MODE:-false} uses the environment variable if set, otherwise defaults to false
+
+sed -i "s/data-hide-navigation-elements=\"false\"/data-hide-navigation-elements=\"${HIDE_NAVIGATION_ELEMENTS:-false}\"/g" \
+  /usr/share/nginx/html/index.html

frontend/index.html

@@ -1,7 +1,7 @@
 <!--
   This file is part of Edgehog.
 
-  Copyright 2021-2024 SECO Mind Srl
+  Copyright 2021-2026 SECO Mind Srl
 
   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
@@ -24,6 +24,7 @@
       name="application-name"
       content="Edgehog"
       data-backend-url="http://localhost:4000/"
+      data-hide-navigation-elements="false"
     />
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />

frontend/src/App.tsx

@@ -1,7 +1,7 @@
 /*
  * This file is part of Edgehog.
  *
- * Copyright 2021-2025 SECO Mind Srl
+ * Copyright 2021-2026 SECO Mind Srl
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -70,6 +70,7 @@ import DeploymentCampaign from "@/pages/DeploymentCampaign";
 import DeploymentCampaignCreate from "@/pages/DeploymentCampaignCreate";
 import Deployment from "@/pages/Deployment";
 
+import { hideNavigationElements } from "@/api";
 import { bugs, repository, version } from "../package.json";
 
 type RouterRule = {
@@ -139,20 +140,20 @@ function App() {
 
   return (
     <div data-testid="app" className="d-flex vh-100 flex-column">
-      {auth.isAuthenticated && (
+      {auth.isAuthenticated && !hideNavigationElements && (
         <header className="flex-grow-0">
           <Topbar />
         </header>
       )}
       <main className="vh-100 flex-grow-1 d-flex  overflow-hidden">
-        {auth.isAuthenticated && (
+        {auth.isAuthenticated && !hideNavigationElements && (
           <aside className="flex-grow-0 flex-shrink-0 overflow-auto">
             <Sidebar />
           </aside>
         )}
         <section className="flex-grow-1 overflow-auto">{RouterElement}</section>
       </main>
-      {auth.isAuthenticated && (
+      {auth.isAuthenticated && !hideNavigationElements && (
         <Footer
           appName={"Edgehog Device Manager"}
           appVersion={version}

frontend/src/api/index.ts

@@ -1,7 +1,7 @@
 /*
  * This file is part of Edgehog.
  *
- * Copyright 2021-2025 SECO Mind Srl
+ * Copyright 2021-2026 SECO Mind Srl
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -80,11 +80,14 @@ type PhoenixMessage = [
   PhoenixPayload,
 ];
 
-const applicationMetatag: HTMLElement = document.head.querySelector(
+const applicationMetatag: HTMLElement | null = document.head.querySelector(
   "[name=application-name]",
-)!;
+);
 const backendUrl =
-  applicationMetatag.dataset?.backendUrl || "http://localhost:4000";
+  applicationMetatag?.dataset?.backendUrl || "http://localhost:4000";
+
+const hideNavigationElements =
+  applicationMetatag?.dataset?.hideNavigationElements === "true";
 
 try {
   new URL(backendUrl);
@@ -316,4 +319,4 @@ const relayEnvironment = (session: Session) => {
 };
 
 export type { FetchGraphQL };
-export { fetchGraphQL, relayEnvironment };
+export { fetchGraphQL, relayEnvironment, hideNavigationElements };