fix(web): restore login page design and add runtime config injection (#435)
All checks were successful
ci/woodpecker/push/orchestrator Pipeline was successful
ci/woodpecker/push/api Pipeline was successful
ci/woodpecker/push/web Pipeline was successful

Co-authored-by: Jason Woltje <jason@diversecanvas.com>
Co-committed-by: Jason Woltje <jason@diversecanvas.com>
This commit was merged in pull request #435.
This commit is contained in:
2026-02-21 23:16:02 +00:00
committed by jason.woltje
parent 23d610ba5b
commit 1b66417be5
12 changed files with 416 additions and 150 deletions

View File

@@ -4,6 +4,11 @@
* This module provides a single source of truth for all API endpoints and URLs.
* All components should import from here instead of reading environment variables directly.
*
* Runtime config injection:
* - In production containers, NEXT_PUBLIC_* vars are baked at build time and cannot
* be overridden via Docker env vars. The root layout injects runtime values into
* `window.__MOSAIC_ENV__` via a synchronous <script>, which this module reads first.
*
* Environment Variables:
* - NEXT_PUBLIC_API_URL: The main API server URL (default: http://localhost:3001)
* - NEXT_PUBLIC_ORCHESTRATOR_URL: The orchestrator service URL (default: same as API URL)
@@ -11,6 +16,24 @@
* - If unset: development defaults to `mock`, production defaults to `real`
*/
/**
* Read an env variable, preferring runtime-injected values on the client.
*
* Execution order guarantees this works:
* 1. Root layout emits `<script>window.__MOSAIC_ENV__={…}</script>` synchronously.
* 2. Next.js hydrates, loading client modules that call this helper.
*/
function getEnv(name: string): string | undefined {
if (typeof window !== "undefined") {
const w = window as Window & { __MOSAIC_ENV__?: Record<string, string> };
if (w.__MOSAIC_ENV__?.[name]) {
return w.__MOSAIC_ENV__[name];
}
}
// Server-side or build-time fallback
return process.env[name];
}
/**
* Default API server URL for local development
*/
@@ -25,10 +48,10 @@ export type AuthMode = (typeof VALID_AUTH_MODES)[number];
* Main API server URL
* Used for authentication, tasks, events, knowledge, and all core API calls
*/
export const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL ?? DEFAULT_API_URL;
export const API_BASE_URL = getEnv("NEXT_PUBLIC_API_URL") ?? DEFAULT_API_URL;
function resolveAuthMode(): AuthMode {
const rawMode = (process.env.NEXT_PUBLIC_AUTH_MODE ?? DEFAULT_AUTH_MODE).toLowerCase();
const rawMode = (getEnv("NEXT_PUBLIC_AUTH_MODE") ?? DEFAULT_AUTH_MODE).toLowerCase();
if (!VALID_AUTH_MODES.includes(rawMode as AuthMode)) {
throw new Error(
@@ -60,7 +83,7 @@ export const IS_MOCK_AUTH_MODE = AUTH_MODE === "mock";
* Used for agent management, task progress, and orchestration features
* Falls back to main API URL if not specified (they may run on the same server)
*/
export const ORCHESTRATOR_URL = process.env.NEXT_PUBLIC_ORCHESTRATOR_URL ?? API_BASE_URL;
export const ORCHESTRATOR_URL = getEnv("NEXT_PUBLIC_ORCHESTRATOR_URL") ?? API_BASE_URL;
/**
* Build a full API endpoint URL