fix: remove medium theme, fix navbar re-render, fix Node.js env loading

- Remove 'medium' theme from dashboard and marketplace; keep only light/dark
- Marketplace: move public pages into (public)/ route group so header/footer
  persist across navigations without re-rendering (eliminates usePathname)
- MarketplaceShell is now a pure context provider; chrome lives in
  (public)/layout.tsx which Next.js holds stable across navigations
- WorkspaceFrame: remove history.replaceState and standalone-route logic
- Docker API: bypass npm run dev to avoid node --env-file in containers
- Add scripts/run-with-env-file.cjs for Node.js < 20.6 compatibility;
  update apps/api/package.json dev script to use it

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

apps/api/package.json

@@ -4,7 +4,7 @@
   "private": true,
   "scripts": {
     "predev": "npm run build --workspace @rentaldrivego/types",
-    "dev": "node --env-file=../../.env.local ../../node_modules/.bin/ts-node-dev --respawn --transpile-only src/index.ts",
+    "dev": "node ../../scripts/run-with-env-file.cjs ../../.env.local ../../node_modules/.bin/ts-node-dev --respawn --transpile-only src/index.ts",
     "prebuild": "npm run build --workspace @rentaldrivego/types",
     "build": "tsc",
     "prestart": "npm run build --workspace @rentaldrivego/types",

apps/dashboard/src/app/layout.tsx

@@ -26,7 +26,7 @@ export default function RootLayout({ children }: { children: React.ReactNode })
         <script
           dangerouslySetInnerHTML={{
             __html:
-              "(function(){try{var m=document.cookie.match(/(?:^|; )rentaldrivego-theme=([^;]+)/);var theme=m?decodeURIComponent(m[1]):(localStorage.getItem('rentaldrivego-theme')||localStorage.getItem('dashboard-theme'));if(theme!=='light'&&theme!=='medium'&&theme!=='dark'){theme=window.matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}var rootTheme=theme==='light'?'light':'dark';document.documentElement.classList.remove('light','dark');document.documentElement.classList.add(rootTheme);document.documentElement.style.colorScheme=rootTheme;document.body&&document.body.setAttribute('data-theme',theme)}catch(e){}})();",
+              "(function(){try{var m=document.cookie.match(/(?:^|; )rentaldrivego-theme=([^;]+)/);var theme=m?decodeURIComponent(m[1]):(localStorage.getItem('rentaldrivego-theme')||localStorage.getItem('dashboard-theme'));if(theme!=='light'&&theme!=='dark'){theme=window.matchMedia('(prefers-color-scheme: dark)').matches?'dark':'light'}var rootTheme=theme==='light'?'light':'dark';document.documentElement.classList.remove('light','dark');document.documentElement.classList.add(rootTheme);document.documentElement.style.colorScheme=rootTheme;document.body&&document.body.setAttribute('data-theme',theme)}catch(e){}})();",
           }}
         />
       </head>

apps/dashboard/src/app/sign-in/[[...sign-in]]/SignInPageClient.tsx

@@ -92,7 +92,7 @@ export default function SignInPageClient({ embedded = false }: { embedded?: bool
     }
 
     if (
-      (requestedTheme === 'light' || requestedTheme === 'medium' || requestedTheme === 'dark') &&
+      (requestedTheme === 'light' || requestedTheme === 'dark') &&
       requestedTheme !== theme
     ) {
       setTheme(requestedTheme)

apps/dashboard/src/components/I18nProvider.tsx

@@ -5,7 +5,7 @@ import { SHARED_LANGUAGE_COOKIE, SHARED_LANGUAGE_KEY, SHARED_THEME_KEY, readCurr
 import { apiFetch } from '@/lib/api'
 
 export type DashboardLanguage = 'en' | 'fr' | 'ar'
-export type DashboardTheme = 'light' | 'medium' | 'dark'
+export type DashboardTheme = 'light' | 'dark'
 
 type FleetDict = {
   statusLabels: Record<'AVAILABLE' | 'RENTED' | 'MAINTENANCE' | 'OUT_OF_SERVICE', string>
@@ -297,7 +297,6 @@ type DashboardDictionary = {
   language: string
   theme: string
   light: string
-  medium: string
   dark: string
   fleet: FleetDict
   vehicleDetail: VehicleDetailDict
@@ -348,7 +347,6 @@ const dictionaries: Record<DashboardLanguage, DashboardDictionary> = {
     language: 'Language',
     theme: 'Theme',
     light: 'Light',
-    medium: 'Medium',
     dark: 'Dark',
     fleet: {
       statusLabels: { AVAILABLE: 'Available', RENTED: 'Rented', MAINTENANCE: 'Maintenance', OUT_OF_SERVICE: 'Out of Service' },
@@ -692,7 +690,6 @@ const dictionaries: Record<DashboardLanguage, DashboardDictionary> = {
     language: 'Langue',
     theme: 'Mode',
     light: 'Clair',
-    medium: 'Moyen',
     dark: 'Sombre',
     fleet: {
       statusLabels: { AVAILABLE: 'Disponible', RENTED: 'Loué', MAINTENANCE: 'Maintenance', OUT_OF_SERVICE: 'Hors service' },
@@ -1036,7 +1033,6 @@ const dictionaries: Record<DashboardLanguage, DashboardDictionary> = {
     language: 'اللغة',
     theme: 'الوضع',
     light: 'فاتح',
-    medium: 'متوسط',
     dark: 'داكن',
     fleet: {
       statusLabels: { AVAILABLE: 'متاح', RENTED: 'مؤجر', MAINTENANCE: 'صيانة', OUT_OF_SERVICE: 'خارج الخدمة' },
@@ -1421,7 +1417,7 @@ export function DashboardI18nProvider({
 
   useEffect(() => {
     const storedTheme = readScopedPreference(SHARED_THEME_KEY, ['dashboard-theme'])
-    if (storedTheme === 'light' || storedTheme === 'medium' || storedTheme === 'dark') {
+    if (storedTheme === 'light' || storedTheme === 'dark') {
       if (storedTheme !== theme) setThemeState(storedTheme)
       return
     }
@@ -1474,7 +1470,7 @@ export function DashboardI18nProvider({
         writeScopedPreference(SHARED_LANGUAGE_KEY, langToWrite, [DASHBOARD_LANGUAGE_KEY])
       }
 
-      if (scopedTheme === 'light' || scopedTheme === 'medium' || scopedTheme === 'dark') {
+      if (scopedTheme === 'light' || scopedTheme === 'dark') {
         if (scopedTheme !== theme) setThemeState(scopedTheme)
       } else {
         writeScopedPreference(SHARED_THEME_KEY, theme, ['dashboard-theme'])
@@ -1557,7 +1553,7 @@ export function DashboardThemeSwitcher() {
       <span className="px-2 text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-500 dark:text-slate-400">
         {dict.theme}
       </span>
-      {(['light', 'medium', 'dark'] as DashboardTheme[]).map((value) => {
+      {(['light', 'dark'] as DashboardTheme[]).map((value) => {
         const active = value === theme
         return (
           <button
@@ -1570,7 +1566,7 @@ export function DashboardThemeSwitcher() {
                 : 'text-slate-600 hover:bg-slate-100 dark:text-slate-300 dark:hover:bg-slate-800'
             }`}
           >
-            {value === 'light' ? dict.light : value === 'medium' ? dict.medium : dict.dark}
+            {value === 'light' ? dict.light : dict.dark}
           </button>
         )
       })}

apps/marketplace/src/app/(public)/layout.tsx

@@ -0,0 +1,41 @@
+'use client'
+
+import MarketplaceHeader from '@/components/MarketplaceHeader'
+import MarketplaceFooter from '@/components/MarketplaceFooter'
+import { useMarketplacePreferences, getFooterContent, localeOptions } from '@/components/MarketplaceShell'
+import { resolveBrowserAppUrl } from '@/lib/appUrls'
+
+export default function PublicLayout({ children }: { children: React.ReactNode }) {
+  const { language, theme, dict, companyName, setLanguage, setTheme } = useMarketplacePreferences()
+  const dashboardUrl = resolveBrowserAppUrl(process.env.NEXT_PUBLIC_DASHBOARD_URL ?? 'http://localhost:3001/dashboard')
+  const footerContent = getFooterContent(language)
+  const available = localeOptions.filter((o) => o.value !== language)
+  const current = localeOptions.find((o) => o.value === language) ?? localeOptions[0]
+
+  return (
+    <div className="flex min-h-screen flex-col bg-stone-50 text-stone-900 transition-colors dark:bg-stone-950 dark:text-stone-100">
+      <MarketplaceHeader
+        dict={dict}
+        theme={theme}
+        setTheme={setTheme}
+        companyName={companyName}
+        dashboardUrl={dashboardUrl}
+        currentLanguage={{ value: current.value, flag: current.flag, shortLabel: current.value.toUpperCase() }}
+        localeOptions={available.map((o) => ({ value: o.value, flag: o.flag, shortLabel: o.value.toUpperCase() }))}
+        onSelectLanguage={setLanguage}
+      />
+      <div className="flex flex-1 flex-col">
+        <div className="flex-1">{children}</div>
+        <MarketplaceFooter
+          primaryItems={footerContent.primary}
+          secondaryItems={footerContent.secondary}
+          localeLabel={footerContent.localeLabel}
+          rightsLabel={footerContent.rightsLabel}
+          localeOptions={available}
+          currentLocale={current}
+          onSelectLanguage={setLanguage}
+        />
+      </div>
+    </div>
+  )
+}

apps/marketplace/src/components/MarketplaceHeader.tsx

@@ -5,7 +5,7 @@ import Image from 'next/image'
 import Link from 'next/link'
 import { useEffect, useRef, useState } from 'react'
 
-type Theme = 'light' | 'medium' | 'dark'
+type Theme = 'light' | 'dark'
 type Language = 'en' | 'fr' | 'ar'
 
 type Dictionary = {
@@ -15,7 +15,6 @@ type Dictionary = {
   ownerSignIn: string
   theme: string
   light: string
-  medium: string
   dark: string
 }
 
@@ -50,7 +49,6 @@ export default function MarketplaceHeader({
   const [themeMenuOpen, setThemeMenuOpen] = useState(false)
   const themeOptions = [
     { value: 'light' as const, label: dict.light },
-    { value: 'medium' as const, label: dict.medium },
     { value: 'dark' as const, label: dict.dark },
   ]
   const currentTheme = themeOptions.find((option) => option.value === theme) ?? themeOptions[0]

apps/marketplace/src/components/MarketplaceShell.tsx

@@ -1,15 +1,12 @@
 'use client'
 
 import { createContext, useContext, useEffect, useMemo, useRef, useState } from 'react'
-import { usePathname, useRouter } from 'next/navigation'
+import { useRouter } from 'next/navigation'
-import MarketplaceFooter from '@/components/MarketplaceFooter'
-import MarketplaceHeader from '@/components/MarketplaceHeader'
 import { footerPageHref } from '@/lib/footerContent'
 import { MARKETPLACE_LANGUAGE_COOKIE, SHARED_LANGUAGE_COOKIE, isMarketplaceLanguage, type MarketplaceLanguage } from '@/lib/i18n'
-import { resolveBrowserAppUrl } from '@/lib/appUrls'
 import { SHARED_LANGUAGE_KEY, SHARED_THEME_KEY, readCurrentUserScopedPreference, readScopedPreference, writeScopedPreference } from '@/lib/preferences'
 
-type Theme = 'light' | 'medium' | 'dark'
+type Theme = 'light' | 'dark'
 
 type Dictionary = {
   marketplace: string
@@ -19,7 +16,6 @@ type Dictionary = {
   language: string
   theme: string
   light: string
-  medium: string
   dark: string
   preferences: string
 }
@@ -33,7 +29,6 @@ const dictionaries: Record<MarketplaceLanguage, Dictionary> = {
     language: 'Language',
     theme: 'Theme',
     light: 'Light',
-    medium: 'Medium',
     dark: 'Dark',
     preferences: 'Marketplace preferences',
   },
@@ -41,11 +36,10 @@ const dictionaries: Record<MarketplaceLanguage, Dictionary> = {
     marketplace: 'Accueil',
     explore: 'Marketplace',
     signIn: 'Connexion',
-    ownerSignIn: 'Créer un espace d’agence',
+    ownerSignIn: "Créer un espace d'agence",
     language: 'Langue',
     theme: 'Mode',
     light: 'Clair',
-    medium: 'Moyen',
     dark: 'Sombre',
     preferences: 'Préférences marketplace',
   },
@@ -57,29 +51,18 @@ const dictionaries: Record<MarketplaceLanguage, Dictionary> = {
     language: 'اللغة',
     theme: 'الوضع',
     light: 'فاتح',
-    medium: 'متوسط',
     dark: 'داكن',
     preferences: 'تفضيلات السوق',
   },
 }
 
-type PreferencesContextValue = {
+export const localeOptions: Array<{ value: MarketplaceLanguage; label: string; flag: string }> = [
-  language: MarketplaceLanguage
-  theme: Theme
-  dict: Dictionary
-  setLanguage: (language: MarketplaceLanguage) => void
-  setTheme: (theme: Theme) => void
-}
-
-const PreferencesContext = createContext<PreferencesContextValue | null>(null)
-
-const localeOptions: Array<{ value: MarketplaceLanguage; label: string; flag: string }> = [
   { value: 'en', label: 'Global (English)', flag: '🇺🇸' },
   { value: 'ar', label: 'North Africa (Arabic)', flag: '🇲🇦' },
   { value: 'fr', label: 'Europe (French)', flag: '🇫🇷' },
 ]
 
-function getFooterContent(language: MarketplaceLanguage): {
+export function getFooterContent(language: MarketplaceLanguage): {
   primary: Array<{ label: string; href?: string }>
   secondary: Array<{ label: string; href?: string }>
   localeLabel: string
@@ -90,7 +73,7 @@ function getFooterContent(language: MarketplaceLanguage): {
       return {
         primary: [
           { label: 'À propos de nous', href: footerPageHref['about-us'] },
-          { label: 'Conditions d’utilisation', href: footerPageHref['terms-of-service'] },
+          { label: "Conditions d'utilisation", href: footerPageHref['terms-of-service'] },
           { label: 'Sécurité', href: footerPageHref.security },
           { label: 'Conformité', href: footerPageHref.compliance },
           { label: 'Politique de confidentialité', href: footerPageHref['privacy-policy'] },
@@ -154,6 +137,17 @@ function detectBrowserLanguage(): string | null {
   return null
 }
 
+type PreferencesContextValue = {
+  language: MarketplaceLanguage
+  theme: Theme
+  dict: Dictionary
+  companyName: string | null
+  setLanguage: (language: MarketplaceLanguage) => void
+  setTheme: (theme: Theme) => void
+}
+
+const PreferencesContext = createContext<PreferencesContextValue | null>(null)
+
 export function useMarketplacePreferences() {
   const context = useContext(PreferencesContext)
   if (!context) throw new Error('useMarketplacePreferences must be used within MarketplaceShell')
@@ -167,9 +161,7 @@ export default function MarketplaceShell({
   children: React.ReactNode
   initialLanguage?: MarketplaceLanguage
 }) {
-  const pathname = usePathname()
   const router = useRouter()
-  const dashboardUrl = resolveBrowserAppUrl(process.env.NEXT_PUBLIC_DASHBOARD_URL ?? 'http://localhost:3001/dashboard')
   const apiUrl = process.env.NEXT_PUBLIC_API_URL ?? 'http://localhost:4000/api/v1'
   const [language, setLanguageState] = useState<MarketplaceLanguage>(initialLanguage)
   const [theme, setThemeState] = useState<Theme>('light')
@@ -196,7 +188,7 @@ export default function MarketplaceShell({
     if (nextTheme === theme) return
 
     if (typeof window !== 'undefined') {
-      document.documentElement.classList.toggle('dark', nextTheme === 'dark' || nextTheme === 'medium')
+      document.documentElement.classList.toggle('dark', nextTheme === 'dark')
       document.documentElement.style.colorScheme = nextTheme === 'light' ? 'light' : 'dark'
       document.body.dataset.theme = nextTheme
       writeScopedPreference(SHARED_THEME_KEY, nextTheme, ['marketplace-theme'])
@@ -245,8 +237,6 @@ export default function MarketplaceShell({
   }
 
   function syncScopedPreferencesForSession() {
-    // Tab-session choice always wins — never let an employee-scoped cookie override
-    // a language the user explicitly picked during this browsing session.
     const sessionLang = readSessionLanguage()
     if (sessionLang) {
       if (sessionLang !== language) setLanguageState(sessionLang)
@@ -258,7 +248,7 @@ export default function MarketplaceShell({
     }
 
     const scopedTheme = readCurrentUserScopedPreference(SHARED_THEME_KEY)
-    if ((scopedTheme === 'light' || scopedTheme === 'medium' || scopedTheme === 'dark') && scopedTheme !== theme) {
+    if ((scopedTheme === 'light' || scopedTheme === 'dark') && scopedTheme !== theme) {
       setThemeState(scopedTheme)
     } else {
       writeScopedPreference(SHARED_THEME_KEY, theme, ['marketplace-theme'])
@@ -266,14 +256,9 @@ export default function MarketplaceShell({
   }
 
   useEffect(() => {
-    // sessionStorage is tab-local — check it first so a selection made earlier in
-    // this tab is honoured even after a server refresh.
     const sessionLang = readSessionLanguage()
     if (sessionLang) {
       setLanguageState(sessionLang)
-      // Write the persistent cookie immediately so any subsequent RSC request
-      // (e.g. router.refresh or next navigation) sees the correct language
-      // without waiting for the language effect's render cycle.
       writeScopedPreference(SHARED_LANGUAGE_KEY, sessionLang, ['marketplace-language'])
     } else {
       const storedLanguage = readScopedPreference(SHARED_LANGUAGE_KEY, ['marketplace-language'])
@@ -290,7 +275,7 @@ export default function MarketplaceShell({
     }
 
     const storedTheme = readScopedPreference(SHARED_THEME_KEY, ['marketplace-theme']) as Theme | null
-    if (storedTheme === 'light' || storedTheme === 'medium' || storedTheme === 'dark') {
+    if (storedTheme === 'light' || storedTheme === 'dark') {
       setThemeState(storedTheme)
     }
 
@@ -330,9 +315,6 @@ export default function MarketplaceShell({
     document.documentElement.lang = language
     document.documentElement.dir = language === 'ar' ? 'rtl' : 'ltr'
 
-    // Don't write to storage on the initial render (language='en' default) — wait
-    // until hydration has resolved the correct stored preference.  Writing 'en'
-    // here before hydration would overwrite a previously-saved 'ar' preference.
     if (!hydrated) return
 
     try { sessionStorage.setItem('marketplace-language', language) } catch {}
@@ -342,64 +324,18 @@ export default function MarketplaceShell({
       router.refresh()
     }
     previousLanguage.current = language
-  }, [hydrated, language, pathname, router])
+  }, [hydrated, language, router])
 
   useEffect(() => {
-    document.documentElement.classList.toggle('dark', theme === 'dark' || theme === 'medium')
+    document.documentElement.classList.toggle('dark', theme === 'dark')
     document.body.dataset.theme = theme
     writeScopedPreference(SHARED_THEME_KEY, theme, ['marketplace-theme'])
   }, [theme])
 
-  const dict = dictionaries[language]
-  const footerContent = getFooterContent(language)
-  const availableLocaleOptions = localeOptions.filter((option) => option.value !== language)
-  const currentLocale = localeOptions.find((option) => option.value === language) ?? localeOptions[0]
-  const isRenterApp = pathname.startsWith('/renter/')
-  const isAuthFrameRoute = pathname === '/sign-in'
   const value = useMemo(
-    () => ({ language, theme, dict, setLanguage: applyLanguage, setTheme: applyTheme }),
+    () => ({ language, theme, dict: dictionaries[language], companyName, setLanguage: applyLanguage, setTheme: applyTheme }),
-    [dict, language, theme],
+    [language, theme, companyName],
   )
 
-  return (
+  return <PreferencesContext.Provider value={value}>{children}</PreferencesContext.Provider>
-    <PreferencesContext.Provider value={value}>
-      <div className="flex min-h-screen flex-col bg-stone-50 text-stone-900 transition-colors dark:bg-stone-950 dark:text-stone-100">
-        {isRenterApp || isAuthFrameRoute ? null : (
-          <MarketplaceHeader
-            dict={dict}
-            theme={theme}
-            setTheme={applyTheme}
-            companyName={companyName}
-            dashboardUrl={dashboardUrl}
-            currentLanguage={{
-              value: currentLocale.value,
-              flag: currentLocale.flag,
-              shortLabel: currentLocale.value.toUpperCase(),
-            }}
-            localeOptions={availableLocaleOptions.map((option) => ({
-              value: option.value,
-              flag: option.flag,
-              shortLabel: option.value.toUpperCase(),
-            }))}
-            onSelectLanguage={applyLanguage}
-          />
-        )}
-
-        <div className="flex flex-1 flex-col">
-          <div className="flex-1">{children}</div>
-          {isRenterApp || isAuthFrameRoute ? null : (
-            <MarketplaceFooter
-              primaryItems={footerContent.primary}
-              secondaryItems={footerContent.secondary}
-              localeLabel={footerContent.localeLabel}
-              rightsLabel={footerContent.rightsLabel}
-              localeOptions={availableLocaleOptions}
-              currentLocale={currentLocale}
-              onSelectLanguage={applyLanguage}
-            />
-          )}
-        </div>
-      </div>
-    </PreferencesContext.Provider>
-  )
 }

apps/marketplace/src/components/WorkspaceFrame.tsx

@@ -1,7 +1,6 @@
 'use client'
 
 import { useEffect, useState } from 'react'
-import { usePathname } from 'next/navigation'
 import { resolveBrowserAppUrl } from '@/lib/appUrls'
 import { useMarketplacePreferences } from './MarketplaceShell'
 
@@ -44,14 +43,13 @@ function buildFrameUrl(appUrl: string, path: string) {
   return appBase.toString()
 }
 
+const FRAME_HEIGHT = 'calc(100vh - 56px)'
+
 export default function WorkspaceFrame({ target }: { target: FrameId }) {
-  const pathname = usePathname()
   const { language, theme } = useMarketplacePreferences()
   const [src, setSrc] = useState('')
   const [framePath, setFramePath] = useState(() => getDefaultFramePath(target))
   const config = frameConfig[target]
-  const isStandaloneAuthRoute = target === 'sign-in' && pathname === '/sign-in'
-  const frameHeight = isStandaloneAuthRoute ? '100vh' : 'calc(100vh - 56px)'
   const loadingLabel = {
     en: 'Loading',
     fr: 'Chargement',
@@ -62,13 +60,6 @@ export default function WorkspaceFrame({ target }: { target: FrameId }) {
     setFramePath(getDefaultFramePath(target))
   }, [target])
 
-  useEffect(() => {
-    if (!isStandaloneAuthRoute || typeof window === 'undefined') return
-    if (window.location.pathname !== '/sign-in') return
-
-    window.history.replaceState(window.history.state, '', '/')
-  }, [isStandaloneAuthRoute])
-
   useEffect(() => {
     function handleFrameMessage(event: MessageEvent) {
       if (!event.data || typeof event.data !== 'object') return
@@ -88,25 +79,21 @@ export default function WorkspaceFrame({ target }: { target: FrameId }) {
     const nextUrl = new URL(buildFrameUrl(config.appUrl, framePath))
     nextUrl.searchParams.set('theme', theme)
     nextUrl.searchParams.set('lang', language)
-    if (isStandaloneAuthRoute) {
+    nextUrl.searchParams.set('embedded', '1')
-      nextUrl.searchParams.delete('embedded')
-    } else {
-      nextUrl.searchParams.set('embedded', '1')
-    }
     setSrc(nextUrl.toString())
-  }, [config.appUrl, framePath, isStandaloneAuthRoute, language, theme])
+  }, [config.appUrl, framePath, language, theme])
 
   return (
-    <main className="bg-stone-950" style={{ minHeight: frameHeight }}>
+    <main className="bg-stone-950" style={{ minHeight: FRAME_HEIGHT }}>
       {src ? (
         <iframe
           title={config.label}
           src={src}
           className="w-full border-0 bg-white"
-          style={{ height: frameHeight }}
+          style={{ height: FRAME_HEIGHT }}
         />
       ) : (
-        <div className="flex items-center justify-center text-sm text-stone-300" style={{ height: frameHeight }}>
+        <div className="flex items-center justify-center text-sm text-stone-300" style={{ height: FRAME_HEIGHT }}>
           {loadingLabel} {config.label}…
         </div>
       )}

docker-compose.dev.yml

@@ -92,7 +92,7 @@ services:
       - .env.docker.dev
     environment:
       FILE_STORAGE_ROOT: /var/lib/rentaldrivego/storage
-    command: ["npm", "run", "dev", "--workspace", "@rentaldrivego/api"]
+    command: ["sh", "-c", "npm run build --workspace @rentaldrivego/types && cd /app/apps/api && exec /app/node_modules/.bin/ts-node-dev --respawn --transpile-only src/index.ts"]
     ports:
       - "4000:4000"
     volumes:

scripts/run-with-env-file.cjs

@@ -0,0 +1,78 @@
+#!/usr/bin/env node
+
+const fs = require('node:fs')
+const path = require('node:path')
+const { spawn } = require('node:child_process')
+
+function parseEnvFile(content) {
+  const env = {}
+
+  for (const rawLine of content.split(/\r?\n/)) {
+    const line = rawLine.trim()
+    if (!line || line.startsWith('#')) continue
+
+    const normalized = line.startsWith('export ') ? line.slice(7).trim() : line
+    const separatorIndex = normalized.indexOf('=')
+    if (separatorIndex === -1) continue
+
+    const key = normalized.slice(0, separatorIndex).trim()
+    if (!/^[A-Za-z_][A-Za-z0-9_]*$/.test(key)) continue
+
+    let value = normalized.slice(separatorIndex + 1)
+
+    if (
+      (value.startsWith('"') && value.endsWith('"')) ||
+      (value.startsWith("'") && value.endsWith("'"))
+    ) {
+      const quote = value[0]
+      value = value.slice(1, -1)
+
+      if (quote === '"') {
+        value = value
+          .replace(/\\n/g, '\n')
+          .replace(/\\r/g, '\r')
+          .replace(/\\t/g, '\t')
+          .replace(/\\"/g, '"')
+          .replace(/\\\\/g, '\\')
+      }
+    }
+
+    env[key] = value
+  }
+
+  return env
+}
+
+const [, , envFileArg, commandArg, ...commandArgs] = process.argv
+
+if (!envFileArg || !commandArg) {
+  console.error('Usage: node run-with-env-file.cjs <env-file> <command> [args...]')
+  process.exit(1)
+}
+
+const envFilePath = path.resolve(process.cwd(), envFileArg)
+const commandPath = path.resolve(process.cwd(), commandArg)
+const fileContent = fs.readFileSync(envFilePath, 'utf8')
+const parsedEnv = parseEnvFile(fileContent)
+
+const child = spawn(commandPath, commandArgs, {
+  stdio: 'inherit',
+  env: {
+    ...process.env,
+    ...parsedEnv,
+  },
+})
+
+child.on('exit', (code, signal) => {
+  if (signal) {
+    process.kill(process.pid, signal)
+    return
+  }
+
+  process.exit(code ?? 0)
+})
+
+child.on('error', (error) => {
+  console.error(error.message)
+  process.exit(1)
+})