@aurostack/stacks 0.1.1 → 0.2.1

package/templates/react-app/files/src/main.tsx

@@ -1,5 +1,7 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
+import { initTelemetry } from '@/shared/telemetry'; // @feature telemetry
+import { API_URL, TELEMETRY } from '@/lib/env'; // @feature telemetry
 import { RouterProvider } from 'react-router';
 import '@/shared/ui/styles/globals.css';
 import { Providers } from './app/providers';
@@ -10,6 +12,8 @@ import { router } from './app/router';
 // evaluating and `providers` has already called `configureApi` at module scope,
 // so the fetch races the session check instead of queueing behind it.
 
+initTelemetry({ service: 'acme-app', ...TELEMETRY, apiUrls: [API_URL] }); // @feature telemetry
+
 createRoot(document.getElementById('root')!).render(
 	<StrictMode>
 		<Providers>

package/templates/react-app/files/src/shared/auth/provider.tsx

@@ -3,6 +3,7 @@ import { useDispatch } from 'react-redux';
 import { getAuthClient } from './client';
 import { sessionCleared, sessionLoaded, sessionLoading, type AuthUser } from './slice';
 import { AUTH_BROADCAST_CHANNEL } from './logout';
+import { setTelemetryUser } from '@/shared/telemetry'; // @feature telemetry
 
 function toAuthUser(user: Record<string, unknown> | null | undefined): AuthUser | null {
 	if (!user) return null;
@@ -33,6 +34,7 @@ export function AuthProvider({ children }: { children: ReactNode }) {
 		}
 		const user = (session.data?.user as Record<string, unknown> | undefined) ?? null;
 		dispatch(sessionLoaded(toAuthUser(user)));
+		setTelemetryUser(user ? { id: String(user.id) } : null); // @feature telemetry
 	}, [session.isPending, session.data, dispatch]);
 
 	useEffect(() => {

package/templates/react-app/files/src/shared/layouts/error-boundary.tsx

@@ -1,6 +1,7 @@
 import { Component, type ErrorInfo, type ReactNode } from 'react';
 import { Button } from '@/shared/ui';
 import { StateScreen } from './states/state-screen';
+import { reportError } from '@/shared/telemetry'; // @feature telemetry
 
 type ErrorBoundaryProps = {
 	children: ReactNode;
@@ -21,6 +22,7 @@ export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundarySt
 
 	componentDidCatch(error: Error, info: ErrorInfo): void {
 		console.error('ErrorBoundary caught an error', error, info);
+		reportError(error, { componentStack: info.componentStack }); // @feature telemetry
 	}
 
 	render(): ReactNode {

package/templates/react-app/files/src/shared/telemetry/index.ts

@@ -0,0 +1,80 @@
+// @/shared/telemetry — browser monitoring (RUM) and logs, sent to OpenObserve.
+//
+// Page views, errors, slow resources and user actions, plus console errors as
+// logs. Requests to the app's own API carry a W3C `traceparent` header, so a
+// click links to the backend trace it caused. The SDK finishes starting a
+// moment after init (its session store is async), so the first request or two
+// of a page load (typically the session check) go out without the header.
+// Off until connection settings are passed; everything here is then a no-op.
+import { DefaultPrivacyLevel, openobserveRum } from '@openobserve/browser-rum';
+import { openobserveLogs } from '@openobserve/browser-logs';
+
+export interface TelemetryOptions {
+	/** Service name, e.g. `acme-client` — one per app. */
+	service: string;
+	/** OpenObserve base URL, e.g. `https://o2.example.com`. */
+	url?: string;
+	/** The project's organization identifier. */
+	org?: string;
+	/**
+	 * A RUM client token (Ingestion → RUM). Write-only and built for shipping
+	 * in a bundle — never the backend's ingestion token.
+	 */
+	clientToken?: string;
+	/** `development`, `production`, … — Vite's `import.meta.env.MODE`. */
+	environment?: string;
+	version?: string;
+	/** Backend origin(s) whose requests should carry trace headers. */
+	apiUrls?: string[];
+	/** Share of sessions to record for replay, 0–100. Off by default. */
+	sessionReplaySampleRate?: number;
+}
+
+let started = false;
+
+export function initTelemetry(options: TelemetryOptions): boolean {
+	const { url, org, clientToken } = options;
+	if (started || !url || !org || !clientToken) return false;
+
+	// The SDK takes a bare host (no scheme) plus an explicit plain-HTTP flag.
+	const { host, protocol } = new URL(url);
+	const common = {
+		clientToken,
+		site: host,
+		organizationIdentifier: org,
+		insecureHTTP: protocol === 'http:',
+		service: options.service,
+		env: options.environment,
+		version: options.version
+	};
+
+	openobserveRum.init({
+		...common,
+		applicationId: options.service,
+		sessionSampleRate: 100,
+		sessionReplaySampleRate: options.sessionReplaySampleRate ?? 0,
+		defaultPrivacyLevel: DefaultPrivacyLevel.MASK_USER_INPUT,
+		trackResources: true,
+		trackLongTasks: true,
+		trackUserInteractions: true,
+		allowedTracingUrls: (options.apiUrls ?? []).filter(Boolean).map((match) => ({
+			match,
+			propagatorTypes: ['tracecontext' as const]
+		}))
+	});
+	openobserveLogs.init({ ...common, forwardErrorsToLogs: true });
+	started = true;
+	return true;
+}
+
+/** Report a handled error — e.g. from an error boundary. */
+export function reportError(error: unknown, context?: object): void {
+	if (started) openobserveRum.addError(error, context);
+}
+
+/** Tie the session to a signed-in user (id only), or clear it on logout. */
+export function setTelemetryUser(user: { id: string } | null): void {
+	if (!started) return;
+	if (user) openobserveRum.setUser({ id: user.id });
+	else openobserveRum.clearUser();
+}

package/templates/react-app/template.json

@@ -127,7 +127,7 @@
 		},
 		"pwa": {
 			"title": "Installable PWA",
-			"description": "vite-plugin-pwa: app-shell offline caching and an update prompt rather than a silent takeover.",
+			"description": "vite-plugin-pwa: app-shell offline caching, and registerType 'prompt' so a new build waits for the user instead of swapping assets under a running app. The update prompt and install button are yours to build with the plugin's useRegisterSW.",
 			"packageJson": {
 				"devDependencies": [
 					"vite-plugin-pwa"
@@ -136,7 +136,7 @@
 		},
 		"charts": {
 			"title": "Charts",
-			"description": "ApexCharts via react-apexcharts, theme-aware through the shared chart palette.",
+			"description": "ApexCharts and react-apexcharts, with a theme-aware chart palette (the --chart-* tokens in the UI kit). No chart components ship.",
 			"packageJson": {
 				"dependencies": [
 					"apexcharts",
@@ -189,6 +189,20 @@
 					"secrets"
 				]
 			}
+		},
+		"telemetry": {
+			"title": "Browser monitoring → OpenObserve",
+			"description": "OpenObserve RUM and logs: page views, errors (including the error boundary's), slow resources, user actions, the signed-in user id, and traceparent headers on API calls so frontend and backend traces link up. Session replay is off unless a project turns it on. Off at runtime until VITE_OPENOBSERVE_* are set.",
+			"default": true,
+			"files": [
+				"src/shared/telemetry/**"
+			],
+			"packageJson": {
+				"dependencies": [
+					"@openobserve/browser-logs",
+					"@openobserve/browser-rum"
+				]
+			}
 		}
 	},
 	"hooks": [

package/templates/react-monorepo/files/.forgejo/workflows/build-and-push.yml

@@ -1,12 +1,11 @@
-# Builds and pushes all four frontend apps from one Dockerfile.
+# Builds and pushes every app's image from one Dockerfile.
 #
-# Unlike web-backend / web-coming-soon this repo produces FOUR images, so the
-# tag is generated once in a separate job and shared by every matrix leg —
+# The tag is generated once in a separate job and shared by every matrix leg;
 # otherwise each app would get its own random tag and there would be no way to
 # deploy a matching set.
 #
 # Vite compiles the VITE_* URLs into each bundle at build time, so these images
-# are specific to one environment. See frontend/docker/README.md.
+# are specific to one environment.
 
 name: Build and Push
 
@@ -33,12 +32,10 @@ jobs:
           DATE=$(date +'%y_%m_%d')
           RAND=$(printf '%05d' "$((RANDOM % 100000))")
           echo "TAG=${DATE}_${RAND}" >> "$GITHUB_OUTPUT"
-          # Derived from `github.repository` (which web-backend's workflow already
-          # relies on) rather than `github.repository_owner`, so this doesn't
-          # depend on a context variable Forgejo may not populate. This repo is
-          # `acme-corp/web-frontend`, so OWNER=acme-corp and the
-          # images land as <registry>/acme-corp/web-<app>, matching
-          # stack/frontend.compose.yml.
+          # Derived from `github.repository` rather than
+          # `github.repository_owner`, so this doesn't depend on a context
+          # variable Forgejo may not populate. Images land as
+          # <registry>/<owner>/web-<app>.
           echo "OWNER=$(echo '${{ github.repository }}' | cut -d/ -f1)" >> "$GITHUB_OUTPUT"
 
   build-and-push:
@@ -49,7 +46,11 @@ jobs:
       # failure. Note this means a partial set can be pushed — re-run the job.
       fail-fast: false
       matrix:
-        app: [landing, auth, client, admin]
+        app:
+          - landing # @feature app-landing
+          - auth # @feature app-auth
+          - client # @feature app-client
+          - admin # @feature app-admin
 
     steps:
       - name: Checkout repository
@@ -83,6 +84,9 @@ jobs:
             VITE_APP_LANDING=${{ secrets.VITE_APP_LANDING }}
             VITE_APP_SUPPORT_EMAIL=${{ secrets.VITE_APP_SUPPORT_EMAIL }}
             VITE_APP_SITE_URL=${{ secrets.VITE_APP_SITE_URL }}
+            VITE_OPENOBSERVE_URL=${{ secrets.VITE_OPENOBSERVE_URL }} # @feature telemetry
+            VITE_OPENOBSERVE_ORG=${{ secrets.VITE_OPENOBSERVE_ORG }} # @feature telemetry
+            VITE_OPENOBSERVE_CLIENT_TOKEN=${{ secrets.VITE_OPENOBSERVE_CLIENT_TOKEN }} # @feature telemetry
           tags: |
             ${{ secrets.REGISTRY }}/${{ needs.meta.outputs.owner }}/web-${{ matrix.app }}:latest
             ${{ secrets.REGISTRY }}/${{ needs.meta.outputs.owner }}/web-${{ matrix.app }}:${{ needs.meta.outputs.tag }}

package/templates/react-monorepo/files/Dockerfile

@@ -9,24 +9,28 @@
 # IMPORTANT: Vite inlines `VITE_*` values into the JS bundle at BUILD time, so a
 # built image is pinned to one environment. The URLs below are build args, not
 # runtime env — setting them in compose does nothing. Build one image per
-# environment, or move to runtime config (see docker/README.md).
+# environment.
 
 # ---------- deps ----------
 # Manifests only, so `yarn install` re-runs solely when a dependency changes.
 FROM aurostack.dev/wesnetech/nodejs:24 AS deps
 WORKDIR /repo
 
+# One line per workspace: every workspace in the project must be here (yarn
+# install --immutable fails on a lockfile naming a missing one), and nothing
+# else (COPY of a missing file fails the build).
 COPY package.json yarn.lock .yarnrc.yml turbo.json ./
-COPY apps/admin/package.json      apps/admin/
-COPY apps/auth/package.json       apps/auth/
-COPY apps/client/package.json     apps/client/
-COPY apps/landing/package.json    apps/landing/
+COPY apps/admin/package.json      apps/admin/ # @feature app-admin
+COPY apps/auth/package.json       apps/auth/ # @feature app-auth
+COPY apps/client/package.json     apps/client/ # @feature app-client
+COPY apps/landing/package.json    apps/landing/ # @feature app-landing
 COPY packages/api/package.json    packages/api/
 COPY packages/auth/package.json   packages/auth/
 COPY packages/config/package.json packages/config/
-COPY packages/hooks/package.json  packages/hooks/
+COPY packages/hooks/package.json  packages/hooks/ # @feature hooks
 COPY packages/layouts/package.json packages/layouts/
-COPY packages/types/package.json  packages/types/
+COPY packages/telemetry/package.json packages/telemetry/ # @feature telemetry
+COPY packages/types/package.json  packages/types/ # @feature types
 COPY packages/ui/package.json     packages/ui/
 
 RUN corepack enable && yarn install --immutable
@@ -56,6 +60,16 @@ ARG VITE_APP_SUPPORT_EMAIL
 # generated sitemap.xml. Must be a build arg — .dockerignore excludes .env, so a
 # local value never reaches the image.
 ARG VITE_APP_SITE_URL
+# @feature:start telemetry
+# Browser monitoring. Leave unset and the bundle ships with telemetry off. The
+# client token is a RUM token, write-only and meant to be public.
+ARG VITE_OPENOBSERVE_URL
+ARG VITE_OPENOBSERVE_ORG
+ARG VITE_OPENOBSERVE_CLIENT_TOKEN
+ENV VITE_OPENOBSERVE_URL=$VITE_OPENOBSERVE_URL \
+	VITE_OPENOBSERVE_ORG=$VITE_OPENOBSERVE_ORG \
+	VITE_OPENOBSERVE_CLIENT_TOKEN=$VITE_OPENOBSERVE_CLIENT_TOKEN
+# @feature:end
 ENV VITE_APP_API_URL=$VITE_APP_API_URL \
 	VITE_APP_AUTH_HOST=$VITE_APP_AUTH_HOST \
 	VITE_APP_CLIENT_HOST=$VITE_APP_CLIENT_HOST \

package/templates/react-monorepo/files/_gitignore

@@ -22,6 +22,7 @@ dist/
 .env.*.local
 .env.test
 .env.production
+.env.staging
 
 # editor / os
 .DS_Store

package/templates/react-monorepo/files/apps/admin/.bin/secrets.js

@@ -1,5 +1,5 @@
 import { execSync } from 'node:child_process';
-import { readFileSync } from 'node:fs';
+import { readFileSync, writeFileSync } from 'node:fs';
 import { dirname, join } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -52,6 +52,11 @@ const env = normalizeEnv(parseEnvArg());
 const envFile = ENV_FILES[env];
 
 console.log(`Fetching secrets for '${slug}' (${env}) -> ${envFile}...`);
-execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env} > ${envFile}`, {
-	stdio: 'inherit'
+// Export first and write only on success: a shell `>` redirect would empty
+// the existing file before infisical had the chance to fail. execSync throws
+// (and the process exits non-zero) when infisical fails.
+const output = execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env}`, {
+	stdio: ['inherit', 'pipe', 'inherit']
 });
+writeFileSync(envFile, output);
+console.log(`Wrote ${envFile}`);

package/templates/react-monorepo/files/apps/admin/.env.example

@@ -14,3 +14,14 @@ VITE_APP_ADMIN_HOST='http://localhost:3003'
 
 # This app's own dev port.
 PORT='3003'
+
+# @feature:start telemetry
+# OpenObserve browser monitoring (RUM): page views, errors, slow requests, and
+# trace headers on API calls. Leave empty and it stays off. The client token is
+# a RUM token (OpenObserve → Ingestion → RUM): write-only and meant to ship in
+# the bundle — never the backend's ingestion token.
+# The instance must list this app's origin in ZO_CORS_ALLOWED_ORIGINS.
+VITE_OPENOBSERVE_URL='https://o2.aurostack.co'
+VITE_OPENOBSERVE_ORG=''
+VITE_OPENOBSERVE_CLIENT_TOKEN=''
+# @feature:end

package/templates/react-monorepo/files/apps/admin/package.json

@@ -15,6 +15,7 @@
 		"@acme/api": "workspace:*",
 		"@acme/auth": "workspace:*",
 		"@acme/layouts": "workspace:*",
+		"@acme/telemetry": "workspace:*",
 		"@acme/ui": "workspace:*",
 		"@reduxjs/toolkit": "^2.12.0",
 		"lucide-react": "^1.17.0",

package/templates/react-monorepo/files/apps/admin/src/app/router.tsx

@@ -1,7 +1,7 @@
 import { Suspense, lazy, type ReactNode } from 'react';
 import { createBrowserRouter } from 'react-router';
-import { ProtectedRoute, signOut, useAuth } from '@acme/auth';
-import { AppShell, AppShellSkeleton, ErrorBoundary, NotFound, RouteFallback } from '@acme/layouts';
+import { RoleRoute, signOut, useAuth } from '@acme/auth';
+import { AppShell, AppShellSkeleton, ErrorBoundary, Forbidden, NotFound, RouteFallback } from '@acme/layouts';
 import { NAV_ITEMS } from './nav';
 import { HomeRoute } from '../routes/home';
 
@@ -15,8 +15,8 @@ const lazyRoute = (element: ReactNode) => <Suspense fallback={<RouteFallback />}
 
 /**
  * The shell reads the session itself rather than taking it as a prop —
- * `ProtectedRoute` has already established the user is authenticated by the
- * time this renders.
+ * `RoleRoute` has already established the user is signed in with an admin role
+ * by the time this renders.
  *
  * `ErrorBoundary` wraps the shell rather than being passed as the route's
  * `errorElement`: it is a plain React error boundary taking `children`, so it
@@ -35,11 +35,15 @@ export const router = createBrowserRouter([
 	{
 		// `fallback` is required and must not be blank: the session round trip is
 		// cross-origin and takes most of a second, and rendering nothing for that
-		// long reads as a broken app.
+		// long reads as a broken app. Signed-out visitors go to the auth app;
+		// signed-in users without an admin role see Forbidden.
+		//
+		// The gate is UI, not security: every endpoint this console calls must
+		// enforce the same role on the API.
 		element: (
-			<ProtectedRoute fallback={<AppShellSkeleton />}>
+			<RoleRoute allow={['admin', 'superuser']} fallback={<AppShellSkeleton />} forbidden={<Forbidden />}>
 				<Shell />
-			</ProtectedRoute>
+			</RoleRoute>
 		),
 		children: [
 			{ index: true, element: <HomeRoute /> },

package/templates/react-monorepo/files/apps/admin/src/lib/env.ts

@@ -10,3 +10,13 @@ export const ADMIN_URL = env.VITE_APP_ADMIN_HOST as string;
 export const CLIENT_URL = env.VITE_APP_CLIENT_HOST as string;
 /** The public marketing site (logout destination). */
 export const LANDING_URL = env.VITE_APP_LANDING as string;
+
+// @feature:start telemetry
+/** OpenObserve browser monitoring (see @acme/telemetry); unset keeps it off. */
+export const TELEMETRY = {
+	url: env.VITE_OPENOBSERVE_URL as string | undefined,
+	org: env.VITE_OPENOBSERVE_ORG as string | undefined,
+	clientToken: env.VITE_OPENOBSERVE_CLIENT_TOKEN as string | undefined,
+	environment: env.MODE
+};
+// @feature:end

package/templates/react-monorepo/files/apps/admin/src/main.tsx

@@ -1,10 +1,14 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
+import { initTelemetry } from '@acme/telemetry'; // @feature telemetry
+import { API_URL, TELEMETRY } from './lib/env'; // @feature telemetry
 import { RouterProvider } from 'react-router';
 import '@acme/ui/globals.css';
 import { Providers } from './app/providers';
 import { router } from './app/router';
 
+initTelemetry({ service: 'acme-admin', ...TELEMETRY, apiUrls: [API_URL] }); // @feature telemetry
+
 createRoot(document.getElementById('root')!).render(
 	<StrictMode>
 		<Providers>

package/templates/react-monorepo/files/apps/auth/.bin/secrets.js

@@ -1,5 +1,5 @@
 import { execSync } from 'node:child_process';
-import { readFileSync } from 'node:fs';
+import { readFileSync, writeFileSync } from 'node:fs';
 import { dirname, join } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -52,6 +52,11 @@ const env = normalizeEnv(parseEnvArg());
 const envFile = ENV_FILES[env];
 
 console.log(`Fetching secrets for '${slug}' (${env}) -> ${envFile}...`);
-execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env} > ${envFile}`, {
-	stdio: 'inherit'
+// Export first and write only on success: a shell `>` redirect would empty
+// the existing file before infisical had the chance to fail. execSync throws
+// (and the process exits non-zero) when infisical fails.
+const output = execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env}`, {
+	stdio: ['inherit', 'pipe', 'inherit']
 });
+writeFileSync(envFile, output);
+console.log(`Wrote ${envFile}`);

package/templates/react-monorepo/files/apps/auth/.env.example

@@ -14,3 +14,14 @@ VITE_APP_ADMIN_HOST='http://localhost:3003'
 
 # This app's own dev port.
 PORT='3001'
+
+# @feature:start telemetry
+# OpenObserve browser monitoring (RUM): page views, errors, slow requests, and
+# trace headers on API calls. Leave empty and it stays off. The client token is
+# a RUM token (OpenObserve → Ingestion → RUM): write-only and meant to ship in
+# the bundle — never the backend's ingestion token.
+# The instance must list this app's origin in ZO_CORS_ALLOWED_ORIGINS.
+VITE_OPENOBSERVE_URL='https://o2.aurostack.co'
+VITE_OPENOBSERVE_ORG=''
+VITE_OPENOBSERVE_CLIENT_TOKEN=''
+# @feature:end

package/templates/react-monorepo/files/apps/auth/package.json

@@ -15,6 +15,7 @@
 		"@acme/api": "workspace:*",
 		"@acme/auth": "workspace:*",
 		"@acme/layouts": "workspace:*",
+		"@acme/telemetry": "workspace:*",
 		"@acme/ui": "workspace:*",
 		"@reduxjs/toolkit": "^2.12.0",
 		"formik": "^2.4.9",

package/templates/react-monorepo/files/apps/auth/src/lib/env.ts

@@ -6,3 +6,13 @@ export const API_URL = env.VITE_APP_API_URL;
 /** Terms and Privacy live on the marketing site, which is a different origin. */
 export const LANDING_URL = env.VITE_APP_LANDING;
 export const AUTH_URL = window.location.origin;
+
+// @feature:start telemetry
+/** OpenObserve browser monitoring (see @acme/telemetry); unset keeps it off. */
+export const TELEMETRY = {
+	url: env.VITE_OPENOBSERVE_URL as string | undefined,
+	org: env.VITE_OPENOBSERVE_ORG as string | undefined,
+	clientToken: env.VITE_OPENOBSERVE_CLIENT_TOKEN as string | undefined,
+	environment: env.MODE
+};
+// @feature:end

package/templates/react-monorepo/files/apps/auth/src/main.tsx

@@ -1,10 +1,14 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
+import { initTelemetry } from '@acme/telemetry'; // @feature telemetry
+import { API_URL, TELEMETRY } from './lib/env'; // @feature telemetry
 import { RouterProvider } from 'react-router';
 import '@acme/ui/globals.css';
 import { Providers } from './app/providers';
 import { router } from './app/router';
 
+initTelemetry({ service: 'acme-auth', ...TELEMETRY, apiUrls: [API_URL] }); // @feature telemetry
+
 createRoot(document.getElementById('root')!).render(
 	<StrictMode>
 		<Providers>

package/templates/react-monorepo/files/apps/client/.bin/secrets.js

@@ -1,5 +1,5 @@
 import { execSync } from 'node:child_process';
-import { readFileSync } from 'node:fs';
+import { readFileSync, writeFileSync } from 'node:fs';
 import { dirname, join } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -52,6 +52,11 @@ const env = normalizeEnv(parseEnvArg());
 const envFile = ENV_FILES[env];
 
 console.log(`Fetching secrets for '${slug}' (${env}) -> ${envFile}...`);
-execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env} > ${envFile}`, {
-	stdio: 'inherit'
+// Export first and write only on success: a shell `>` redirect would empty
+// the existing file before infisical had the chance to fail. execSync throws
+// (and the process exits non-zero) when infisical fails.
+const output = execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env}`, {
+	stdio: ['inherit', 'pipe', 'inherit']
 });
+writeFileSync(envFile, output);
+console.log(`Wrote ${envFile}`);

package/templates/react-monorepo/files/apps/client/.env.example

@@ -14,3 +14,14 @@ VITE_APP_ADMIN_HOST='http://localhost:3003'
 
 # This app's own dev port.
 PORT='3002'
+
+# @feature:start telemetry
+# OpenObserve browser monitoring (RUM): page views, errors, slow requests, and
+# trace headers on API calls. Leave empty and it stays off. The client token is
+# a RUM token (OpenObserve → Ingestion → RUM): write-only and meant to ship in
+# the bundle — never the backend's ingestion token.
+# The instance must list this app's origin in ZO_CORS_ALLOWED_ORIGINS.
+VITE_OPENOBSERVE_URL='https://o2.aurostack.co'
+VITE_OPENOBSERVE_ORG=''
+VITE_OPENOBSERVE_CLIENT_TOKEN=''
+# @feature:end

package/templates/react-monorepo/files/apps/client/package.json

@@ -15,6 +15,7 @@
 		"@acme/api": "workspace:*",
 		"@acme/auth": "workspace:*",
 		"@acme/layouts": "workspace:*",
+		"@acme/telemetry": "workspace:*",
 		"@acme/ui": "workspace:*",
 		"@reduxjs/toolkit": "^2.12.0",
 		"apexcharts": "^6.5.0",

package/templates/react-monorepo/files/apps/client/src/lib/env.ts

@@ -10,3 +10,13 @@ export const CLIENT_URL = env.VITE_APP_CLIENT_HOST as string;
 export const ADMIN_URL = env.VITE_APP_ADMIN_HOST as string;
 /** The public marketing site (logout destination). */
 export const LANDING_URL = env.VITE_APP_LANDING as string;
+
+// @feature:start telemetry
+/** OpenObserve browser monitoring (see @acme/telemetry); unset keeps it off. */
+export const TELEMETRY = {
+	url: env.VITE_OPENOBSERVE_URL as string | undefined,
+	org: env.VITE_OPENOBSERVE_ORG as string | undefined,
+	clientToken: env.VITE_OPENOBSERVE_CLIENT_TOKEN as string | undefined,
+	environment: env.MODE
+};
+// @feature:end

package/templates/react-monorepo/files/apps/client/src/main.tsx

@@ -1,5 +1,7 @@
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
+import { initTelemetry } from '@acme/telemetry'; // @feature telemetry
+import { API_URL, TELEMETRY } from './lib/env'; // @feature telemetry
 import { RouterProvider } from 'react-router';
 import '@acme/ui/globals.css';
 import { Providers } from './app/providers';
@@ -10,6 +12,8 @@ import { router } from './app/router';
 // evaluating and `providers` has already called `configureApi` at module scope,
 // so the fetch races the session check instead of queueing behind it.
 
+initTelemetry({ service: 'acme-client', ...TELEMETRY, apiUrls: [API_URL] }); // @feature telemetry
+
 createRoot(document.getElementById('root')!).render(
 	<StrictMode>
 		<Providers>

package/templates/react-monorepo/files/apps/client/src/vite-env.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="vite/client" />
 /// <reference types="vite-plugin-svgr/client" />
-/// <reference types="vite-plugin-pwa/react" />
+/// <reference types="vite-plugin-pwa/react" /> // @feature pwa
 
 interface ImportMetaEnv {
 	VITE_APP_API_URL: string;

package/templates/react-monorepo/files/apps/landing/.bin/secrets.js

@@ -1,5 +1,5 @@
 import { execSync } from 'node:child_process';
-import { readFileSync } from 'node:fs';
+import { readFileSync, writeFileSync } from 'node:fs';
 import { dirname, join } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
@@ -52,6 +52,11 @@ const env = normalizeEnv(parseEnvArg());
 const envFile = ENV_FILES[env];
 
 console.log(`Fetching secrets for '${slug}' (${env}) -> ${envFile}...`);
-execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env} > ${envFile}`, {
-	stdio: 'inherit'
+// Export first and write only on success: a shell `>` redirect would empty
+// the existing file before infisical had the chance to fail. execSync throws
+// (and the process exits non-zero) when infisical fails.
+const output = execSync(`infisical export --projectId="${PROJECT_ID}" --path="${secretPath}" --env=${env}`, {
+	stdio: ['inherit', 'pipe', 'inherit']
 });
+writeFileSync(envFile, output);
+console.log(`Wrote ${envFile}`);

package/templates/react-monorepo/files/apps/landing/.env.example

@@ -18,3 +18,14 @@ PORT='3000'
 # Canonical public URL, used for sitemap/robots/OG tags at build time.
 VITE_APP_SITE_URL='http://localhost:3000'
 VITE_APP_SUPPORT_EMAIL='support@example.com'
+
+# @feature:start telemetry
+# OpenObserve browser monitoring (RUM): page views, errors, slow requests, and
+# trace headers on API calls. Leave empty and it stays off. The client token is
+# a RUM token (OpenObserve → Ingestion → RUM): write-only and meant to ship in
+# the bundle — never the backend's ingestion token.
+# The instance must list this app's origin in ZO_CORS_ALLOWED_ORIGINS.
+VITE_OPENOBSERVE_URL='https://o2.aurostack.co'
+VITE_OPENOBSERVE_ORG=''
+VITE_OPENOBSERVE_CLIENT_TOKEN=''
+# @feature:end

package/templates/react-monorepo/files/apps/landing/package.json

@@ -15,6 +15,7 @@
 		"@acme/api": "workspace:*",
 		"@acme/auth": "workspace:*",
 		"@acme/layouts": "workspace:*",
+		"@acme/telemetry": "workspace:*",
 		"@acme/types": "workspace:*",
 		"@acme/ui": "workspace:*",
 		"@reduxjs/toolkit": "^2.12.0",

package/templates/react-monorepo/files/apps/landing/src/lib/env.ts

@@ -8,3 +8,13 @@ export const CLIENT_HOST = env.VITE_APP_CLIENT_HOST;
  *  actually posts. Falsy when the build arg is missing; the UI hides the block
  *  rather than rendering `mailto:undefined`. */
 export const SUPPORT_EMAIL = env.VITE_APP_SUPPORT_EMAIL;
+
+// @feature:start telemetry
+/** OpenObserve browser monitoring (see @acme/telemetry); unset keeps it off. */
+export const TELEMETRY = {
+	url: env.VITE_OPENOBSERVE_URL as string | undefined,
+	org: env.VITE_OPENOBSERVE_ORG as string | undefined,
+	clientToken: env.VITE_OPENOBSERVE_CLIENT_TOKEN as string | undefined,
+	environment: env.MODE
+};
+// @feature:end