feat: add FF_BUSINESS feature flag for PostGuard for Business (#81)

rubenhensen · web-flow · commit d3f2ce8dcc92 · 2026-04-17T18:03:18.000+02:00
* feat: add FF_BUSINESS feature flag for PostGuard for Business

Wire up window.APP_CONFIG (from Terraform ConfigMap) to control
visibility of the Business nav link, landing page section, and
footer link. The flag is read at runtime from config.js, which
is overridden per environment in deployed clusters.

* fix: exclude mounted config.js from sed substitution

The ConfigMap-mounted config.js is read-only, so sed -i fails when
it tries to create a temp file. Exclude it from the find since it
never contains VITE placeholders anyway.
diff --git a/docker/entrypoint.sh b/docker/entrypoint.sh
@@ -6,7 +6,7 @@ HTDOCS="/usr/share/nginx/html/postguard"
 echo "Substituting SPA environment variables..."
 echo "  VITE_FILEHOST_URL=${VITE_FILEHOST_URL}"
 
-find "${HTDOCS}" -name '*.js' -type f -exec sed -i \
+find "${HTDOCS}" -name '*.js' -not -name 'config.js' -type f -exec sed -i \
     -e "s|__VITE_FILEHOST_URL_PLACEHOLDER__|${VITE_FILEHOST_URL}|g" \
     {} +
 
diff --git a/src/app.html b/src/app.html
@@ -4,6 +4,7 @@
         <meta charset="utf-8" />
         <link rel="icon" href="%sveltekit.assets%/favicon.ico" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <script src="%sveltekit.assets%/config.js"></script>
         %sveltekit.head%
     </head>
     <body>
diff --git a/src/lib/components/Header.svelte b/src/lib/components/Header.svelte
@@ -7,8 +7,9 @@
     import Hamburger from '$lib/components/header/Hamburger.svelte'
     import { page } from '$app/state';
     import ThemeSwitcher from './ThemeSwitcher.svelte'
+    import { FF_BUSINESS } from '$lib/env'
 
-    let items = [
+    const allItems = [
         { name: 'fs', route: '/fileshare' },
         { name: 'about', route: '/about' },
         { name: 'blog', route: '/blog' },
@@ -17,6 +18,8 @@
         { name: 'docs', route: 'https://docs.postguard.eu' },
     ]
 
+    let items = FF_BUSINESS ? allItems : allItems.filter(i => i.name !== 'business')
+
     function isSelected(route: String) {
         return page.url.pathname === route;
     }
diff --git a/src/lib/env.ts b/src/lib/env.ts
@@ -13,3 +13,10 @@ export const UPLOAD_CHUNK_SIZE = Number(requireEnv('VITE_UPLOAD_CHUNK_SIZE'));
 export const FILEREAD_CHUNK_SIZE = Number(requireEnv('VITE_FILEREAD_CHUNK_SIZE'));
 export const APP_NAME = requireEnv('VITE_APP_NAME');
 export const APP_VERSION = requireEnv('VITE_APP_VERSION');
+
+/** Runtime config injected by config.js (Terraform ConfigMap in deployed environments). */
+function runtimeConfig(): Record<string, unknown> {
+    return (globalThis as any).APP_CONFIG ?? {};
+}
+
+export const FF_BUSINESS = runtimeConfig().FF_BUSINESS === true;
diff --git a/src/routes/(marketing)/+layout.svelte b/src/routes/(marketing)/+layout.svelte
@@ -3,6 +3,7 @@
     import { isLoading } from 'svelte-i18n'
     import { _ } from 'svelte-i18n'
     import { onMount } from 'svelte'
+    import { FF_BUSINESS } from '$lib/env'
 
     let { children } = $props()
     let contactEl = $state<HTMLAnchorElement>()
@@ -46,7 +47,7 @@
                     <ul>
                         <li><a href="mailto:" bind:this={contactEl} data-name="info" data-domain="postguard.eu">{$_('footer.contact')}</a></li>
                         <li><a href="https://github.com/encryption4all">GitHub</a></li>
-                        <li><a href="https://business.postguard.eu">PostGuard for Business</a></li>
+                        {#if FF_BUSINESS}<li><a href="https://business.postguard.eu">PostGuard for Business</a></li>{/if}
                     </ul>
                 </div>
             </div>
diff --git a/src/routes/(marketing)/+page.svelte b/src/routes/(marketing)/+page.svelte
@@ -2,6 +2,7 @@
     import { onMount } from 'svelte'
     import { _ } from 'svelte-i18n'
     import SEO from '$lib/components/SEO.svelte'
+    import { FF_BUSINESS } from '$lib/env'
 
     let contactEl: HTMLAnchorElement
 
@@ -54,6 +55,7 @@
         </div>
     </section>
 
+    {#if FF_BUSINESS}
     <section class="business">
         <div class="business-content">
             <h2>{$_('landing.businessTitle')}</h2>
@@ -90,6 +92,7 @@
             <a href="mailto:" bind:this={contactEl} data-name="info" data-domain="postguard.eu" class="business-cta">{$_('landing.businessCta')}</a>
         </div>
     </section>
+    {/if}
 </div>
 
 <style lang="scss">
diff --git a/static/config.js b/static/config.js
@@ -0,0 +1,5 @@
+// Runtime configuration — overridden by Terraform ConfigMap in deployed environments.
+// Values here are defaults for local development.
+window.APP_CONFIG = {
+  FF_BUSINESS: true,
+};
