@geekmidas/cli 0.53.0 → 1.0.0

package/dist/index.mjs

@@ -1,19 +1,20 @@
 #!/usr/bin/env -S npx tsx
-import { __require, getAppBuildOrder, getDependencyEnvVars, getDeployTargetError, isDeployTargetSupported } from "./workspace-DLFRaDc-.mjs";
-import { getAppNameFromCwd, loadAppConfig, loadConfig, loadWorkspaceConfig, parseModuleConfig } from "./config-C3LSBNSl.mjs";
-import { ConstructGenerator, EndpointGenerator, OPENAPI_OUTPUT_PATH, OpenApiTsGenerator, generateOpenApi, openapiCommand, resolveOpenApiConfig } from "./openapi-C3C-BzIZ.mjs";
-import { getKeyPath, maskPassword, readStageSecrets, secretsExist, setCustomSecret, toEmbeddableSecrets, writeStageSecrets } from "./storage-Dhst7BhI.mjs";
-import { DokployApi } from "./dokploy-api-94KzmTVf.mjs";
-import { encryptSecrets } from "./encryption-BC4MAODn.mjs";
-import { generateReactQueryCommand } from "./openapi-react-query-ZoP9DPbY.mjs";
+import { __require, getAppBuildOrder, getDependencyEnvVars, getDeployTargetError, isDeployTargetSupported } from "./workspace-DAxG3_H2.mjs";
+import { getAppNameFromCwd, loadAppConfig, loadConfig, loadWorkspaceConfig, parseModuleConfig } from "./config-C6awcFBx.mjs";
+import { getCredentialsPath, getDokployCredentials, getDokployRegistryId, getDokployToken, removeDokployCredentials, storeDokployCredentials, storeDokployRegistryId } from "./credentials-DT1dSxIx.mjs";
+import { ConstructGenerator, EndpointGenerator, OPENAPI_OUTPUT_PATH, OpenApiTsGenerator, generateOpenApi, openapiCommand, resolveOpenApiConfig } from "./openapi-BMFmLnX6.mjs";
+import { getKeyPath, maskPassword, readStageSecrets, secretsExist, setCustomSecret, toEmbeddableSecrets, writeStageSecrets } from "./storage-BMW6yLu3.mjs";
+import { DokployApi } from "./dokploy-api-7k3t7_zd.mjs";
+import { encryptSecrets } from "./encryption-JtMsiGNp.mjs";
+import { CachedStateProvider } from "./CachedStateProvider-DVyKfaMm.mjs";
+import { generateReactQueryCommand } from "./openapi-react-query-DGEkD39r.mjs";
 import { createRequire } from "node:module";
-import { copyFileSync, existsSync, mkdirSync, readFileSync, unlinkSync } from "node:fs";
+import { copyFileSync, existsSync, readFileSync, unlinkSync } from "node:fs";
 import { basename, dirname, join, parse, relative, resolve } from "node:path";
 import { Command } from "commander";
 import { stdin, stdout } from "node:process";
 import * as readline from "node:readline/promises";
 import { mkdir, readFile, writeFile } from "node:fs/promises";
-import { homedir } from "node:os";
 import { execSync, spawn } from "node:child_process";
 import { createServer } from "node:net";
 import chokidar from "chokidar";
@@ -30,7 +31,7 @@ import prompts from "prompts";
 
 //#region package.json
 var name = "@geekmidas/cli";
-var version = "0.53.0";
+var version = "0.54.0";
 var description = "CLI tools for building Lambda handlers, server applications, and generating OpenAPI specs";
 var private$1 = false;
 var type = "module";
@@ -74,6 +75,9 @@ var repository = {
 };
 var dependencies = {
 	"@apidevtools/swagger-parser": "^10.1.0",
+	"@aws-sdk/client-route-53": "~3.971.0",
+	"@aws-sdk/client-ssm": "~3.971.0",
+	"@aws-sdk/credential-providers": "~3.971.0",
 	"@geekmidas/constructs": "workspace:~",
 	"@geekmidas/envkit": "workspace:~",
 	"@geekmidas/errors": "workspace:~",
@@ -87,7 +91,8 @@ var dependencies = {
 	"lodash.kebabcase": "^4.1.1",
 	"openapi-typescript": "^7.4.2",
 	"pg": "~8.17.1",
-	"prompts": "~2.4.2"
+	"prompts": "~2.4.2",
+	"tsx": "~4.20.3"
 };
 var devDependencies = {
 	"@geekmidas/testkit": "workspace:*",
@@ -117,138 +122,6 @@ var package_default = {
 	peerDependenciesMeta
 };
 
-//#endregion
-//#region src/auth/credentials.ts
-/**
-* Get the path to the credentials directory
-*/
-function getCredentialsDir(options) {
-	const root = options?.root ?? homedir();
-	return join(root, ".gkm");
-}
-/**
-* Get the path to the credentials file
-*/
-function getCredentialsPath(options) {
-	return join(getCredentialsDir(options), "credentials.json");
-}
-/**
-* Ensure the credentials directory exists
-*/
-function ensureCredentialsDir(options) {
-	const dir = getCredentialsDir(options);
-	if (!existsSync(dir)) mkdirSync(dir, {
-		recursive: true,
-		mode: 448
-	});
-}
-/**
-* Read stored credentials from disk
-*/
-async function readCredentials(options) {
-	const path = getCredentialsPath(options);
-	if (!existsSync(path)) return {};
-	try {
-		const content = await readFile(path, "utf-8");
-		return JSON.parse(content);
-	} catch {
-		return {};
-	}
-}
-/**
-* Write credentials to disk
-*/
-async function writeCredentials(credentials, options) {
-	ensureCredentialsDir(options);
-	const path = getCredentialsPath(options);
-	await writeFile(path, JSON.stringify(credentials, null, 2), { mode: 384 });
-}
-/**
-* Store Dokploy credentials
-*/
-async function storeDokployCredentials(token, endpoint, options) {
-	const credentials = await readCredentials(options);
-	credentials.dokploy = {
-		token,
-		endpoint,
-		storedAt: (/* @__PURE__ */ new Date()).toISOString()
-	};
-	await writeCredentials(credentials, options);
-}
-/**
-* Get stored Dokploy credentials
-*/
-async function getDokployCredentials(options) {
-	const credentials = await readCredentials(options);
-	if (!credentials.dokploy) return null;
-	return {
-		token: credentials.dokploy.token,
-		endpoint: credentials.dokploy.endpoint,
-		registryId: credentials.dokploy.registryId
-	};
-}
-/**
-* Remove Dokploy credentials
-*/
-async function removeDokployCredentials(options) {
-	const credentials = await readCredentials(options);
-	if (!credentials.dokploy) return false;
-	delete credentials.dokploy;
-	await writeCredentials(credentials, options);
-	return true;
-}
-/**
-* Get Dokploy API token, checking stored credentials first, then environment
-*/
-async function getDokployToken(options) {
-	const envToken = process.env.DOKPLOY_API_TOKEN;
-	if (envToken) return envToken;
-	const stored = await getDokployCredentials(options);
-	if (stored) return stored.token;
-	return null;
-}
-/**
-* Store Dokploy registry ID
-*/
-async function storeDokployRegistryId(registryId, options) {
-	const credentials = await readCredentials(options);
-	if (!credentials.dokploy) throw new Error("Dokploy credentials not found. Run \"gkm login --service dokploy\" first.");
-	credentials.dokploy.registryId = registryId;
-	await writeCredentials(credentials, options);
-}
-/**
-* Get Dokploy registry ID from stored credentials
-*/
-async function getDokployRegistryId(options) {
-	const stored = await getDokployCredentials(options);
-	return stored?.registryId ?? void 0;
-}
-/**
-* Store Hostinger API token
-*
-* @param token - API token from hpanel.hostinger.com/profile/api
-*/
-async function storeHostingerToken(token, options) {
-	const credentials = await readCredentials(options);
-	credentials.hostinger = {
-		token,
-		storedAt: (/* @__PURE__ */ new Date()).toISOString()
-	};
-	await writeCredentials(credentials, options);
-}
-/**
-* Get stored Hostinger API token
-*
-* Checks environment variable first (HOSTINGER_API_TOKEN),
-* then falls back to stored credentials.
-*/
-async function getHostingerToken(options) {
-	const envToken = process.env.HOSTINGER_API_TOKEN;
-	if (envToken) return envToken;
-	const credentials = await readCredentials(options);
-	return credentials.hostinger?.token ?? null;
-}
-
 //#endregion
 //#region src/auth/index.ts
 const logger$11 = console;
@@ -256,7 +129,7 @@ const logger$11 = console;
 * Validate Dokploy token by making a test API call
 */
 async function validateDokployToken(endpoint, token) {
-	const { DokployApi: DokployApi$1 } = await import("./dokploy-api-CItuaWTq.mjs");
+	const { DokployApi: DokployApi$1 } = await import("./dokploy-api-CHa8G51l.mjs");
 	const api = new DokployApi$1({
 		baseUrl: endpoint,
 		token
@@ -2151,7 +2024,7 @@ async function buildForProvider(provider, context, rootOutputDir, endpointGenera
 		let masterKey;
 		if (context.production?.bundle && !skipBundle) {
 			logger$7.log(`\n📦 Bundling production server...`);
-			const { bundleServer } = await import("./bundler-DGry2vaR.mjs");
+			const { bundleServer } = await import("./bundler-BqTN5Dj5.mjs");
 			const allConstructs = [
 				...endpoints.map((e) => e.construct),
 				...functions.map((f) => f.construct),
@@ -2279,37 +2152,6 @@ function getAppOutputPath(workspace, _appName, app) {
 //#endregion
 //#region src/deploy/state.ts
 /**
-* Get the state file path for a stage
-*/
-function getStateFilePath(workspaceRoot, stage) {
-	return join(workspaceRoot, ".gkm", `deploy-${stage}.json`);
-}
-/**
-* Read the deploy state for a stage
-* Returns null if state file doesn't exist
-*/
-async function readStageState(workspaceRoot, stage) {
-	const filePath = getStateFilePath(workspaceRoot, stage);
-	try {
-		const content = await readFile(filePath, "utf-8");
-		return JSON.parse(content);
-	} catch (error) {
-		if (error.code === "ENOENT") return null;
-		console.warn(`Warning: Could not read deploy state: ${error}`);
-		return null;
-	}
-}
-/**
-* Write the deploy state for a stage
-*/
-async function writeStageState(workspaceRoot, stage, state) {
-	const filePath = getStateFilePath(workspaceRoot, stage);
-	const dir = join(workspaceRoot, ".gkm");
-	await mkdir(dir, { recursive: true });
-	state.lastDeployedAt = (/* @__PURE__ */ new Date()).toISOString();
-	await writeFile(filePath, JSON.stringify(state, null, 2));
-}
-/**
 * Create a new empty state for a stage
 */
 function createEmptyState(stage, environmentId) {
@@ -2404,155 +2246,90 @@ function isDnsVerified(state, hostname, serverIp) {
 }
 
 //#endregion
-//#region src/deploy/dns/hostinger-api.ts
+//#region src/deploy/dns/DnsProvider.ts
 /**
-* Hostinger DNS API client
+* Check if value is a DnsProvider implementation.
+*/
+function isDnsProvider(value) {
+	return typeof value === "object" && value !== null && typeof value.name === "string" && typeof value.getRecords === "function" && typeof value.upsertRecords === "function";
+}
+/**
+* Create a DNS provider based on configuration.
 *
-* API Documentation: https://developers.hostinger.com/
-* Authentication: Bearer token from hpanel.hostinger.com/profile/api
+* - 'hostinger': HostingerProvider
+* - 'route53': Route53Provider
+* - 'manual': Returns null (user handles DNS)
+* - Custom: Use provided DnsProvider implementation
+*/
+async function createDnsProvider(options) {
+	const { config: config$1 } = options;
+	if (config$1.provider === "manual") return null;
+	if (isDnsProvider(config$1.provider)) return config$1.provider;
+	const provider = config$1.provider;
+	if (provider === "hostinger") {
+		const { HostingerProvider } = await import("./HostingerProvider-DqUq6e9i.mjs");
+		return new HostingerProvider();
+	}
+	if (provider === "route53") {
+		const { Route53Provider } = await import("./Route53Provider-KUAX3vz9.mjs");
+		const route53Config = config$1;
+		return new Route53Provider({
+			region: route53Config.region,
+			profile: route53Config.profile,
+			hostedZoneId: route53Config.hostedZoneId
+		});
+	}
+	if (provider === "cloudflare") throw new Error("Cloudflare DNS provider not yet implemented");
+	throw new Error(`Unknown DNS provider: ${JSON.stringify(config$1)}`);
+}
+
+//#endregion
+//#region src/deploy/dns/index.ts
+const logger$6 = console;
+/**
+* Check if DNS config is legacy format (single domain with `domain` property)
 */
-const HOSTINGER_API_BASE = "https://developers.hostinger.com";
+function isLegacyDnsConfig(config$1) {
+	return typeof config$1 === "object" && config$1 !== null && "provider" in config$1 && "domain" in config$1;
+}
 /**
-* Hostinger API error
+* Normalize DNS config to new multi-domain format
 */
-var HostingerApiError = class extends Error {
-	constructor(message, status, statusText, errors) {
-		super(message);
-		this.status = status;
-		this.statusText = statusText;
-		this.errors = errors;
-		this.name = "HostingerApiError";
+function normalizeDnsConfig(config$1) {
+	if (isLegacyDnsConfig(config$1)) {
+		const { domain,...providerConfig } = config$1;
+		return { [domain]: providerConfig };
 	}
-};
+	return config$1;
+}
 /**
-* Hostinger DNS API client
+* Find the root domain for a hostname from available DNS configs
 *
 * @example
-* ```ts
-* const api = new HostingerApi(token);
-*
-* // Get all records for a domain
-* const records = await api.getRecords('traflabs.io');
-*
-* // Create/update records
-* await api.upsertRecords('traflabs.io', [
-*   { name: 'api.joemoer', type: 'A', ttl: 300, records: ['1.2.3.4'] }
-* ]);
-* ```
+* findRootDomain('api.geekmidas.com', { 'geekmidas.com': {...}, 'geekmidas.dev': {...} })
+* // Returns 'geekmidas.com'
 */
-var HostingerApi = class {
-	token;
-	constructor(token) {
-		this.token = token;
-	}
-	/**
-	* Make a request to the Hostinger API
-	*/
-	async request(method, endpoint, body) {
-		const url = `${HOSTINGER_API_BASE}${endpoint}`;
-		const response = await fetch(url, {
-			method,
-			headers: {
-				"Content-Type": "application/json",
-				Authorization: `Bearer ${this.token}`
-			},
-			body: body ? JSON.stringify(body) : void 0
-		});
-		if (!response.ok) {
-			let errorMessage = `Hostinger API error: ${response.status} ${response.statusText}`;
-			let errors;
-			try {
-				const errorBody = await response.json();
-				if (errorBody.message) errorMessage = `Hostinger API error: ${errorBody.message}`;
-				errors = errorBody.errors;
-			} catch {}
-			throw new HostingerApiError(errorMessage, response.status, response.statusText, errors);
+function findRootDomain(hostname, dnsConfig) {
+	const domains = Object.keys(dnsConfig).sort((a, b) => b.length - a.length);
+	for (const domain of domains) if (hostname === domain || hostname.endsWith(`.${domain}`)) return domain;
+	return null;
+}
+/**
+* Group hostnames by their root domain
+*/
+function groupHostnamesByDomain(appHostnames, dnsConfig) {
+	const grouped = /* @__PURE__ */ new Map();
+	for (const [appName, hostname] of appHostnames) {
+		const rootDomain = findRootDomain(hostname, dnsConfig);
+		if (!rootDomain) {
+			logger$6.log(`   ⚠ No DNS config found for hostname: ${hostname}`);
+			continue;
 		}
-		const text = await response.text();
-		if (!text || text.trim() === "") return void 0;
-		return JSON.parse(text);
-	}
-	/**
-	* Get all DNS records for a domain
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	*/
-	async getRecords(domain) {
-		const response = await this.request("GET", `/api/dns/v1/zones/${domain}`);
-		return response.data || [];
-	}
-	/**
-	* Create or update DNS records
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	* @param records - Records to create/update
-	* @param overwrite - If true, replaces all existing records. If false, merges with existing.
-	*/
-	async upsertRecords(domain, records, overwrite = false) {
-		await this.request("PUT", `/api/dns/v1/zones/${domain}`, {
-			overwrite,
-			zone: records
-		});
-	}
-	/**
-	* Validate DNS records before applying
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	* @param records - Records to validate
-	* @returns true if valid, throws if invalid
-	*/
-	async validateRecords(domain, records) {
-		await this.request("POST", `/api/dns/v1/zones/${domain}/validate`, {
-			overwrite: false,
-			zone: records
-		});
-		return true;
-	}
-	/**
-	* Delete specific DNS records
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	* @param filters - Filters to match records for deletion
-	*/
-	async deleteRecords(domain, filters) {
-		await this.request("DELETE", `/api/dns/v1/zones/${domain}`, { filters });
-	}
-	/**
-	* Check if a specific record exists
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	* @param name - Subdomain name (e.g., 'api.joemoer')
-	* @param type - Record type (e.g., 'A')
-	*/
-	async recordExists(domain, name$1, type$1 = "A") {
-		const records = await this.getRecords(domain);
-		return records.some((r) => r.name === name$1 && r.type === type$1);
-	}
-	/**
-	* Create a single A record if it doesn't exist
-	*
-	* @param domain - Root domain (e.g., 'traflabs.io')
-	* @param subdomain - Subdomain name (e.g., 'api.joemoer')
-	* @param ip - IP address to point to
-	* @param ttl - TTL in seconds (default: 300)
-	* @returns true if created, false if already exists
-	*/
-	async createARecordIfNotExists(domain, subdomain, ip, ttl = 300) {
-		const exists = await this.recordExists(domain, subdomain, "A");
-		if (exists) return false;
-		await this.upsertRecords(domain, [{
-			name: subdomain,
-			type: "A",
-			ttl,
-			records: [{ content: ip }]
-		}]);
-		return true;
+		if (!grouped.has(rootDomain)) grouped.set(rootDomain, /* @__PURE__ */ new Map());
+		grouped.get(rootDomain).set(appName, hostname);
 	}
-};
-
-//#endregion
-//#region src/deploy/dns/index.ts
-const logger$6 = console;
+	return grouped;
+}
 /**
 * Resolve IP address from a hostname
 */
@@ -2624,127 +2401,91 @@ function printDnsRecordsSimple(records, rootDomain) {
 	logger$6.log("");
 }
 /**
-* Prompt for input (reuse from deploy/index.ts pattern)
-*/
-async function promptForToken(message) {
-	const { stdin: stdin$1, stdout: stdout$1 } = await import("node:process");
-	if (!stdin$1.isTTY) throw new Error("Interactive input required for Hostinger token.");
-	stdout$1.write(message);
-	return new Promise((resolve$1) => {
-		let value = "";
-		const onData = (char) => {
-			const c = char.toString();
-			if (c === "\n" || c === "\r") {
-				stdin$1.setRawMode(false);
-				stdin$1.pause();
-				stdin$1.removeListener("data", onData);
-				stdout$1.write("\n");
-				resolve$1(value);
-			} else if (c === "") {
-				stdin$1.setRawMode(false);
-				stdin$1.pause();
-				stdout$1.write("\n");
-				process.exit(1);
-			} else if (c === "" || c === "\b") {
-				if (value.length > 0) value = value.slice(0, -1);
-			} else value += c;
-		};
-		stdin$1.setRawMode(true);
-		stdin$1.resume();
-		stdin$1.on("data", onData);
-	});
-}
-/**
-* Create DNS records using the configured provider
-*/
-async function createDnsRecords(records, dnsConfig) {
-	const { provider, domain: rootDomain, ttl = 300 } = dnsConfig;
-	if (provider === "manual") return records.map((r) => ({
-		...r,
-		created: false,
-		existed: false
-	}));
-	if (provider === "hostinger") return createHostingerRecords(records, rootDomain, ttl);
-	if (provider === "cloudflare") {
-		logger$6.log("   ⚠ Cloudflare DNS integration not yet implemented");
-		return records.map((r) => ({
-			...r,
-			error: "Cloudflare not implemented"
-		}));
-	}
-	return records;
-}
-/**
-* Create DNS records at Hostinger
+* Create DNS records for a single domain using its configured provider
 */
-async function createHostingerRecords(records, rootDomain, ttl) {
-	let token = await getHostingerToken();
-	if (!token) {
-		logger$6.log("\n   📋 Hostinger API token not found.");
-		logger$6.log("   Get your token from: https://hpanel.hostinger.com/profile/api\n");
-		try {
-			token = await promptForToken("   Hostinger API Token: ");
-			await storeHostingerToken(token);
-			logger$6.log("   ✓ Token saved");
-		} catch {
-			logger$6.log("   ⚠ Could not get token, skipping DNS creation");
-			return records.map((r) => ({
-				...r,
-				error: "No API token"
-			}));
-		}
-	}
-	const api = new HostingerApi(token);
-	const results = [];
-	let existingRecords = [];
+async function createDnsRecordsForDomain(records, rootDomain, providerConfig) {
+	const ttl = "ttl" in providerConfig && providerConfig.ttl ? providerConfig.ttl : 300;
+	let provider;
 	try {
-		existingRecords = await api.getRecords(rootDomain);
+		provider = await createDnsProvider({ config: providerConfig });
 	} catch (error) {
 		const message = error instanceof Error ? error.message : "Unknown error";
-		logger$6.log(`   ⚠ Failed to fetch existing DNS records: ${message}`);
+		logger$6.log(`   ⚠ Failed to create DNS provider for ${rootDomain}: ${message}`);
 		return records.map((r) => ({
 			...r,
 			error: message
 		}));
 	}
-	for (const record of records) {
-		const existing = existingRecords.find((r) => r.name === record.subdomain && r.type === "A");
-		if (existing) {
-			results.push({
-				...record,
+	if (!provider) return records.map((r) => ({
+		...r,
+		created: false,
+		existed: false
+	}));
+	const results = [];
+	const upsertRecords = records.map((r) => ({
+		name: r.subdomain,
+		type: r.type,
+		ttl,
+		value: r.value
+	}));
+	try {
+		const upsertResults = await provider.upsertRecords(rootDomain, upsertRecords);
+		for (const [i, record] of records.entries()) {
+			const result = upsertResults[i];
+			if (!result) {
+				results.push({
+					hostname: record.hostname,
+					subdomain: record.subdomain,
+					type: record.type,
+					value: record.value,
+					appName: record.appName,
+					error: "No result returned from provider"
+				});
+				continue;
+			}
+			if (result.unchanged) results.push({
+				hostname: record.hostname,
+				subdomain: record.subdomain,
+				type: record.type,
+				value: record.value,
+				appName: record.appName,
 				existed: true,
 				created: false
 			});
-			continue;
-		}
-		try {
-			await api.upsertRecords(rootDomain, [{
-				name: record.subdomain,
-				type: "A",
-				ttl,
-				records: [{ content: record.value }]
-			}]);
-			results.push({
-				...record,
-				created: true,
-				existed: false
-			});
-		} catch (error) {
-			const message = error instanceof Error ? error.message : "Unknown error";
-			results.push({
-				...record,
-				error: message
+			else results.push({
+				hostname: record.hostname,
+				subdomain: record.subdomain,
+				type: record.type,
+				value: record.value,
+				appName: record.appName,
+				created: result.created,
+				existed: !result.created
 			});
 		}
+	} catch (error) {
+		const message = error instanceof Error ? error.message : "Unknown error";
+		logger$6.log(`   ⚠ Failed to create DNS records for ${rootDomain}: ${message}`);
+		return records.map((r) => ({
+			hostname: r.hostname,
+			subdomain: r.subdomain,
+			type: r.type,
+			value: r.value,
+			appName: r.appName,
+			error: message
+		}));
 	}
 	return results;
 }
 /**
 * Main DNS orchestration function for deployments
+*
+* Supports both legacy single-domain format and new multi-domain format:
+* - Legacy: { provider: 'hostinger', domain: 'example.com' }
+* - Multi:  { 'example.com': { provider: 'hostinger' }, 'example.dev': { provider: 'route53' } }
 */
 async function orchestrateDns(appHostnames, dnsConfig, dokployEndpoint) {
 	if (!dnsConfig) return null;
-	const { domain: rootDomain, autoCreate = true } = dnsConfig;
+	const normalizedConfig = normalizeDnsConfig(dnsConfig);
 	logger$6.log("\n🌐 Setting up DNS records...");
 	let serverIp;
 	try {
@@ -2756,31 +2497,43 @@ async function orchestrateDns(appHostnames, dnsConfig, dokployEndpoint) {
 		logger$6.log(`   ⚠ Failed to resolve server IP: ${message}`);
 		return null;
 	}
-	const requiredRecords = generateRequiredRecords(appHostnames, rootDomain, serverIp);
-	if (requiredRecords.length === 0) {
-		logger$6.log("   No DNS records needed");
+	const groupedHostnames = groupHostnamesByDomain(appHostnames, normalizedConfig);
+	if (groupedHostnames.size === 0) {
+		logger$6.log("   No DNS records needed (no hostnames match configured domains)");
 		return {
 			records: [],
 			success: true,
 			serverIp
 		};
 	}
-	let finalRecords;
-	if (autoCreate && dnsConfig.provider !== "manual") {
-		logger$6.log(`   Creating DNS records at ${dnsConfig.provider}...`);
-		finalRecords = await createDnsRecords(requiredRecords, dnsConfig);
-		const created = finalRecords.filter((r) => r.created).length;
-		const existed = finalRecords.filter((r) => r.existed).length;
-		const failed = finalRecords.filter((r) => r.error).length;
-		if (created > 0) logger$6.log(`   ✓ Created ${created} DNS record(s)`);
-		if (existed > 0) logger$6.log(`   ✓ ${existed} record(s) already exist`);
-		if (failed > 0) logger$6.log(`   ⚠ ${failed} record(s) failed`);
-	} else finalRecords = requiredRecords;
-	printDnsRecordsTable(finalRecords, rootDomain);
-	const hasFailures = finalRecords.some((r) => r.error);
-	if (dnsConfig.provider === "manual" || hasFailures) printDnsRecordsSimple(finalRecords.filter((r) => !r.created && !r.existed), rootDomain);
+	const allRecords = [];
+	let hasFailures = false;
+	for (const [rootDomain, domainHostnames] of groupedHostnames) {
+		const providerConfig = normalizedConfig[rootDomain];
+		if (!providerConfig) {
+			logger$6.log(`   ⚠ No provider config for ${rootDomain}`);
+			continue;
+		}
+		const providerName = typeof providerConfig.provider === "string" ? providerConfig.provider : "custom";
+		const requiredRecords = generateRequiredRecords(domainHostnames, rootDomain, serverIp);
+		if (requiredRecords.length === 0) continue;
+		logger$6.log(`   Creating DNS records for ${rootDomain} (${providerName})...`);
+		const domainRecords = await createDnsRecordsForDomain(requiredRecords, rootDomain, providerConfig);
+		allRecords.push(...domainRecords);
+		const created = domainRecords.filter((r) => r.created).length;
+		const existed = domainRecords.filter((r) => r.existed).length;
+		const failed = domainRecords.filter((r) => r.error).length;
+		if (created > 0) logger$6.log(`   ✓ Created ${created} DNS record(s) for ${rootDomain}`);
+		if (existed > 0) logger$6.log(`   ✓ ${existed} record(s) already exist for ${rootDomain}`);
+		if (failed > 0) {
+			logger$6.log(`   ⚠ ${failed} record(s) failed for ${rootDomain}`);
+			hasFailures = true;
+		}
+		printDnsRecordsTable(domainRecords, rootDomain);
+		if (providerConfig.provider === "manual" || failed > 0) printDnsRecordsSimple(domainRecords.filter((r) => !r.created && !r.existed), rootDomain);
+	}
 	return {
-		records: finalRecords,
+		records: allRecords,
 		success: !hasFailures,
 		serverIp
 	};
@@ -3385,7 +3138,7 @@ WORKDIR /app
 COPY . .
 
 # Build production server using gkm
-RUN pnpm exec gkm build --provider server --production
+RUN ${pm.exec} gkm build --provider server --production
 
 # Stage 3: Production
 FROM ${baseImage} AS runner
@@ -3467,7 +3220,7 @@ WORKDIR /app
 COPY --from=pruner /app/out/full/ ./
 
 # Build production server using gkm
-RUN pnpm exec gkm build --provider server --production
+RUN ${pm.exec} gkm build --provider server --production
 
 # Stage 4: Production
 FROM ${baseImage} AS runner
@@ -3788,7 +3541,7 @@ RUN if [ -n "$GKM_ENCRYPTED_CREDENTIALS" ]; then \
     fi
 
 # Build production server using gkm
-RUN cd ${appPath} && pnpm exec gkm build --provider server --production
+RUN cd ${appPath} && ${pm.exec} gkm build --provider server --production
 
 # Stage 4: Production
 FROM ${baseImage} AS runner
@@ -4755,6 +4508,48 @@ async function deployListCommand(options) {
 	}
 }
 
+//#endregion
+//#region src/deploy/StateProvider.ts
+/**
+* Check if value is a StateProvider implementation.
+*/
+function isStateProvider(value) {
+	return typeof value === "object" && value !== null && typeof value.read === "function" && typeof value.write === "function";
+}
+/**
+* Create a state provider based on configuration.
+*
+* - 'local': LocalStateProvider (default)
+* - 'ssm': CachedStateProvider with SSM as source of truth
+* - Custom: Use provided StateProvider implementation
+*/
+async function createStateProvider(options) {
+	const { config: config$1, workspaceRoot, workspaceName } = options;
+	if (!config$1) {
+		const { LocalStateProvider } = await import("./LocalStateProvider-DxoSaWUV.mjs");
+		return new LocalStateProvider(workspaceRoot);
+	}
+	if (isStateProvider(config$1.provider)) return config$1.provider;
+	const provider = config$1.provider;
+	if (provider === "local") {
+		const { LocalStateProvider } = await import("./LocalStateProvider-DxoSaWUV.mjs");
+		return new LocalStateProvider(workspaceRoot);
+	}
+	if (provider === "ssm") {
+		if (!workspaceName) throw new Error("Workspace name is required for SSM state provider. Set \"name\" in gkm.config.ts.");
+		const { LocalStateProvider } = await import("./LocalStateProvider-DxoSaWUV.mjs");
+		const { SSMStateProvider } = await import("./SSMStateProvider-C4wp4AZe.mjs");
+		const { CachedStateProvider: CachedStateProvider$1 } = await import("./CachedStateProvider-OiFUGr7p.mjs");
+		const local = new LocalStateProvider(workspaceRoot);
+		const ssm = new SSMStateProvider({
+			workspaceName,
+			region: config$1.region
+		});
+		return new CachedStateProvider$1(ssm, local);
+	}
+	throw new Error(`Unknown state provider: ${JSON.stringify(config$1)}`);
+}
+
 //#endregion
 //#region src/deploy/secrets.ts
 /**
@@ -4857,6 +4652,14 @@ function generateSecretsReport(encryptedApps, sniffedApps) {
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 /**
+* Resolve the tsx package path from the CLI package's dependencies.
+* This ensures tsx is available regardless of whether the target project has it installed.
+*/
+function resolveTsxPath() {
+	const require$2 = createRequire(import.meta.url);
+	return require$2.resolve("tsx");
+}
+/**
 * Resolve the path to a sniffer helper file.
 * Handles both dev (.ts with tsx) and production (.mjs from dist).
 *
@@ -4881,8 +4684,9 @@ function resolveSnifferFile(baseName) {
 * 1. Frontend apps: Returns empty (no server secrets)
 * 2. Apps with `requiredEnv`: Uses explicit list from config
 * 3. Entry apps: Imports entry file in subprocess to capture config.parse() calls
-* 4. Apps with `envParser`: Runs SnifferEnvironmentParser to detect usage
-* 5. Apps with neither: Returns empty
+* 4. Route-based apps: Loads route files and calls getEnvironment() on each construct
+* 5. Apps with `envParser` (no routes): Runs SnifferEnvironmentParser to detect usage
+* 6. Apps with neither: Returns empty
 *
 * This function handles "fire and forget" async operations gracefully,
 * capturing errors and unhandled rejections without failing the build.
@@ -4911,6 +4715,14 @@ async function sniffAppEnvironment(app, appName, workspacePath, options = {}) {
 			requiredEnvVars: result.envVars
 		};
 	}
+	if (app.routes) {
+		const result = await sniffRouteFiles(app.routes, app.path, workspacePath);
+		if (logWarnings && result.error) console.warn(`[sniffer] ${appName}: Route sniffing threw error (env vars still captured): ${result.error.message}`);
+		return {
+			appName,
+			requiredEnvVars: result.envVars
+		};
+	}
 	if (app.envParser) {
 		const result = await sniffEnvParser(app.envParser, app.path, workspacePath);
 		if (logWarnings) {
@@ -5002,6 +4814,80 @@ async function sniffEntryFile(entryPath, appPath, workspacePath) {
 	});
 }
 /**
+* Sniff route files by loading constructs and calling getEnvironment().
+*
+* Route-based apps have endpoints, functions, crons, and subscribers that
+* use services. Each service's register() method accesses environment variables.
+*
+* This runs in a subprocess with tsx loader to properly handle TypeScript
+* compilation and path alias resolution (e.g., `src/...` imports).
+*
+* @param routes - Glob pattern(s) for route files
+* @param appPath - The app's path relative to workspace (e.g., 'apps/api')
+* @param workspacePath - Absolute path to workspace root
+* @returns EntrySniffResult with env vars and optional error
+*/
+async function sniffRouteFiles(routes, appPath, workspacePath) {
+	const fullAppPath = resolve(workspacePath, appPath);
+	const workerPath = resolveSnifferFile("sniffer-routes-worker");
+	const tsxPath = resolveTsxPath();
+	const routesArray = Array.isArray(routes) ? routes : [routes];
+	const pattern = routesArray[0];
+	if (!pattern) return {
+		envVars: [],
+		error: new Error("No route patterns provided")
+	};
+	return new Promise((resolvePromise) => {
+		const child = spawn("node", [
+			"--import",
+			tsxPath,
+			workerPath,
+			fullAppPath,
+			pattern
+		], {
+			cwd: fullAppPath,
+			stdio: [
+				"ignore",
+				"pipe",
+				"pipe"
+			],
+			env: { ...process.env }
+		});
+		let stdout$1 = "";
+		let stderr = "";
+		child.stdout.on("data", (data) => {
+			stdout$1 += data.toString();
+		});
+		child.stderr.on("data", (data) => {
+			stderr += data.toString();
+		});
+		child.on("close", (code) => {
+			if (stderr) stderr.split("\n").filter((line) => line.trim()).forEach((line) => console.warn(line));
+			try {
+				const jsonMatch = stdout$1.match(/\{[^{}]*"envVars"[^{}]*\}[^{]*$/);
+				if (jsonMatch) {
+					const result = JSON.parse(jsonMatch[0]);
+					resolvePromise({
+						envVars: result.envVars || [],
+						error: result.error ? new Error(result.error) : void 0
+					});
+					return;
+				}
+			} catch {}
+			resolvePromise({
+				envVars: [],
+				error: new Error(`Failed to sniff route files (exit code ${code}): ${stderr || stdout$1 || "No output"}`)
+			});
+		});
+		child.on("error", (err) => {
+			resolvePromise({
+				envVars: [],
+				error: err
+			});
+		});
+	});
+}
+/**
 * Run the SnifferEnvironmentParser on an envParser module to detect
 * which environment variables it accesses.
 *
@@ -5611,7 +5497,12 @@ async function workspaceDeployCommand(workspace, options) {
 		logger$1.log(`   ✓ Created project: ${project.projectId}`);
 	}
 	logger$1.log("\n📋 Loading deploy state...");
-	let state = await readStageState(workspace.root, stage);
+	const stateProvider = await createStateProvider({
+		config: workspace.state,
+		workspaceRoot: workspace.root,
+		workspaceName: workspace.name
+	});
+	let state = await stateProvider.read(stage);
 	if (state) {
 		logger$1.log(`   Found existing state for stage "${stage}"`);
 		if (state.environmentId !== environmentId) {
@@ -5946,14 +5837,14 @@ async function workspaceDeployCommand(workspace, options) {
 		}
 	}
 	logger$1.log("\n📋 Saving deploy state...");
-	await writeStageState(workspace.root, stage, state);
-	logger$1.log(`   ✓ State saved to .gkm/deploy-${stage}.json`);
+	await stateProvider.write(stage, state);
+	logger$1.log("   ✓ State saved");
 	const dnsConfig = workspace.deploy.dns;
 	if (dnsConfig && appHostnames.size > 0) {
 		const dnsResult = await orchestrateDns(appHostnames, dnsConfig, creds.endpoint);
 		if (dnsResult?.serverIp && appHostnames.size > 0) {
 			await verifyDnsRecords(appHostnames, dnsResult.serverIp, state);
-			await writeStageState(workspace.root, stage, state);
+			await stateProvider.write(stage, state);
 		}
 		if (dnsResult?.success && appHostnames.size > 0) {
 			logger$1.log("\n🔒 Validating domains for SSL certificates...");
@@ -6022,7 +5913,7 @@ async function deployCommand(options) {
 		dokployConfig = setupResult.config;
 		finalRegistry = dokployConfig.registry ?? dockerConfig.registry;
 		if (setupResult.serviceUrls) {
-			const { readStageSecrets: readStageSecrets$1, writeStageSecrets: writeStageSecrets$1, initStageSecrets } = await import("./storage-DNj_I11J.mjs");
+			const { readStageSecrets: readStageSecrets$1, writeStageSecrets: writeStageSecrets$1, initStageSecrets } = await import("./storage-D8XzjVaO.mjs");
 			let secrets = await readStageSecrets$1(stage);
 			if (!secrets) {
 				logger$1.log(`   Creating secrets file for stage "${stage}"...`);
@@ -6112,21 +6003,189 @@ async function deployCommand(options) {
 }
 
 //#endregion
-//#region src/secrets/generator.ts
+//#region src/deploy/state-commands.ts
 /**
-* Generate a secure random password using URL-safe base64 characters.
-* @param length Password length (default: 32)
+* Pull state from remote to local.
+* `gkm state:pull --stage=<stage>`
 */
-function generateSecurePassword(length = 32) {
-	return randomBytes(Math.ceil(length * 3 / 4)).toString("base64url").slice(0, length);
+async function statePullCommand(options) {
+	const { workspace } = await loadWorkspaceConfig();
+	if (!workspace.state || workspace.state.provider === "local") {
+		console.error("No remote state provider configured.");
+		console.error("Add a remote provider in gkm.config.ts:");
+		console.error("  state: { provider: \"ssm\", region: \"us-east-1\" }");
+		process.exit(1);
+	}
+	const provider = await createStateProvider({
+		config: workspace.state,
+		workspaceRoot: workspace.root,
+		workspaceName: workspace.name
+	});
+	if (!(provider instanceof CachedStateProvider)) {
+		console.error("State provider does not support pull operation.");
+		process.exit(1);
+	}
+	console.log(`Pulling state for stage: ${options.stage}...`);
+	const state = await provider.pull(options.stage);
+	if (state) {
+		console.log("State pulled successfully.");
+		printStateSummary(state);
+	} else console.log("No remote state found for this stage.");
 }
-/** Default service configurations */
-const SERVICE_DEFAULTS = {
-	postgres: {
-		host: "postgres",
-		port: 5432,
-		username: "app",
-		database: "app"
+/**
+* Push local state to remote.
+* `gkm state:push --stage=<stage>`
+*/
+async function statePushCommand(options) {
+	const { workspace } = await loadWorkspaceConfig();
+	if (!workspace.state || workspace.state.provider === "local") {
+		console.error("No remote state provider configured.");
+		console.error("Add a remote provider in gkm.config.ts:");
+		console.error("  state: { provider: \"ssm\", region: \"us-east-1\" }");
+		process.exit(1);
+	}
+	const provider = await createStateProvider({
+		config: workspace.state,
+		workspaceRoot: workspace.root,
+		workspaceName: workspace.name
+	});
+	if (!(provider instanceof CachedStateProvider)) {
+		console.error("State provider does not support push operation.");
+		process.exit(1);
+	}
+	console.log(`Pushing state for stage: ${options.stage}...`);
+	const state = await provider.push(options.stage);
+	if (state) {
+		console.log("State pushed successfully.");
+		printStateSummary(state);
+	} else console.log("No local state found for this stage.");
+}
+/**
+* Show current state.
+* `gkm state:show --stage=<stage>`
+*/
+async function stateShowCommand(options) {
+	const { workspace } = await loadWorkspaceConfig();
+	const provider = await createStateProvider({
+		config: workspace.state,
+		workspaceRoot: workspace.root,
+		workspaceName: workspace.name
+	});
+	const state = await provider.read(options.stage);
+	if (!state) {
+		console.log(`No state found for stage: ${options.stage}`);
+		return;
+	}
+	if (options.json) console.log(JSON.stringify(state, null, 2));
+	else printStateDetails(state);
+}
+/**
+* Compare local and remote state.
+* `gkm state:diff --stage=<stage>`
+*/
+async function stateDiffCommand(options) {
+	const { workspace } = await loadWorkspaceConfig();
+	if (!workspace.state || workspace.state.provider === "local") {
+		console.error("No remote state provider configured.");
+		console.error("Diff requires a remote provider to compare against.");
+		process.exit(1);
+	}
+	const provider = await createStateProvider({
+		config: workspace.state,
+		workspaceRoot: workspace.root,
+		workspaceName: workspace.name
+	});
+	if (!(provider instanceof CachedStateProvider)) {
+		console.error("State provider does not support diff operation.");
+		process.exit(1);
+	}
+	console.log(`Comparing state for stage: ${options.stage}...\n`);
+	const { local, remote } = await provider.diff(options.stage);
+	if (!local && !remote) {
+		console.log("No state found (local or remote).");
+		return;
+	}
+	if (!local) console.log("Local:  (none)");
+	else console.log(`Local:  Last deployed ${local.lastDeployedAt}`);
+	if (!remote) console.log("Remote: (none)");
+	else console.log(`Remote: Last deployed ${remote.lastDeployedAt}`);
+	console.log("");
+	const localApps = local?.applications ?? {};
+	const remoteApps = remote?.applications ?? {};
+	const allApps = new Set([...Object.keys(localApps), ...Object.keys(remoteApps)]);
+	if (allApps.size > 0) {
+		console.log("Applications:");
+		for (const app of allApps) {
+			const localId = localApps[app];
+			const remoteId = remoteApps[app];
+			if (localId === remoteId) console.log(`  ${app}: ${localId ?? "(none)"}`);
+			else if (!localId) console.log(`  ${app}: (none) -> ${remoteId} [REMOTE ONLY]`);
+			else if (!remoteId) console.log(`  ${app}: ${localId} -> (none) [LOCAL ONLY]`);
+			else console.log(`  ${app}: ${localId} (local) != ${remoteId} (remote) [MISMATCH]`);
+		}
+	}
+	const localServices = local?.services ?? {};
+	const remoteServices = remote?.services ?? {};
+	if (Object.keys(localServices).length > 0 || Object.keys(remoteServices).length > 0) {
+		console.log("\nServices:");
+		const serviceKeys = new Set([...Object.keys(localServices), ...Object.keys(remoteServices)]);
+		for (const key of serviceKeys) {
+			const localVal = localServices[key];
+			const remoteVal = remoteServices[key];
+			if (localVal === remoteVal) console.log(`  ${key}: ${localVal ?? "(none)"}`);
+			else console.log(`  ${key}: ${localVal ?? "(none)"} (local) != ${remoteVal ?? "(none)"} (remote)`);
+		}
+	}
+}
+function printStateSummary(state) {
+	const appCount = Object.keys(state.applications).length;
+	const hasPostgres = !!state.services.postgresId;
+	const hasRedis = !!state.services.redisId;
+	console.log(`  Stage: ${state.stage}`);
+	console.log(`  Applications: ${appCount}`);
+	console.log(`  Postgres: ${hasPostgres ? "configured" : "none"}`);
+	console.log(`  Redis: ${hasRedis ? "configured" : "none"}`);
+	console.log(`  Last deployed: ${state.lastDeployedAt}`);
+}
+function printStateDetails(state) {
+	console.log(`Stage: ${state.stage}`);
+	console.log(`Environment ID: ${state.environmentId}`);
+	console.log(`Last Deployed: ${state.lastDeployedAt}`);
+	console.log("");
+	console.log("Applications:");
+	const apps = Object.entries(state.applications);
+	if (apps.length === 0) console.log("  (none)");
+	else for (const [name$1, id] of apps) console.log(`  ${name$1}: ${id}`);
+	console.log("");
+	console.log("Services:");
+	if (!state.services.postgresId && !state.services.redisId) console.log("  (none)");
+	else {
+		if (state.services.postgresId) console.log(`  Postgres: ${state.services.postgresId}`);
+		if (state.services.redisId) console.log(`  Redis: ${state.services.redisId}`);
+	}
+	if (state.dnsVerified && Object.keys(state.dnsVerified).length > 0) {
+		console.log("");
+		console.log("DNS Verified:");
+		for (const [hostname, info] of Object.entries(state.dnsVerified)) console.log(`  ${hostname}: ${info.serverIp} (${info.verifiedAt})`);
+	}
+}
+
+//#endregion
+//#region src/secrets/generator.ts
+/**
+* Generate a secure random password using URL-safe base64 characters.
+* @param length Password length (default: 32)
+*/
+function generateSecurePassword(length = 32) {
+	return randomBytes(Math.ceil(length * 3 / 4)).toString("base64url").slice(0, length);
+}
+/** Default service configurations */
+const SERVICE_DEFAULTS = {
+	postgres: {
+		host: "postgres",
+		port: 5432,
+		username: "app",
+		database: "app"
 	},
 	redis: {
 		host: "redis",
@@ -6317,7 +6376,10 @@ function generateAuthAppFiles(options) {
 		compilerOptions: {
 			noEmit: true,
 			baseUrl: ".",
-			paths: { [`@${options.name}/*`]: ["../../packages/*/src"] }
+			paths: {
+				"~/*": ["./src/*"],
+				[`@${options.name}/*`]: ["../../packages/*/src"]
+			}
 		},
 		include: ["src/**/*.ts"],
 		exclude: ["node_modules", "dist"]
@@ -6527,7 +6589,10 @@ export default defineConfig({
 		compilerOptions: {
 			noEmit: true,
 			baseUrl: ".",
-			paths: { [`@${options.name}/*`]: ["../../packages/*/src"] }
+			paths: {
+				"~/*": ["./src/*"],
+				[`@${options.name}/*`]: ["../../packages/*/src"]
+			}
 		},
 		include: ["src/**/*.ts"],
 		exclude: ["node_modules", "dist"]
@@ -6647,7 +6712,10 @@ function generateSingleAppConfigFiles(options, _template, _helpers) {
 		compilerOptions: {
 			noEmit: true,
 			baseUrl: ".",
-			paths: { [`@${options.name}/*`]: ["../../packages/*/src"] }
+			paths: {
+				"~/*": ["./src/*"],
+				[`@${options.name}/*`]: ["../../packages/*/src"]
+			}
 		},
 		include: ["src/**/*.ts"],
 		exclude: ["node_modules", "dist"]
@@ -6945,7 +7013,11 @@ function generateModelsPackage(options) {
 // Common Schemas
 // ============================================
 
-export const IdSchema = z.string().uuid();
+export const IdSchema = z.uuid();
+
+export const IdParamsSchema = z.object({
+  id: IdSchema,
+});
 
 export const TimestampsSchema = z.object({
   createdAt: z.coerce.date(),
@@ -6971,6 +7043,7 @@ export const PaginatedResponseSchema = <T extends z.ZodTypeAny>(itemSchema: T) =
 // ============================================
 
 export type Id = z.infer<typeof IdSchema>;
+export type IdParams = z.infer<typeof IdParamsSchema>;
 export type Timestamps = z.infer<typeof TimestampsSchema>;
 export type Pagination = z.infer<typeof PaginationSchema>;
 `;
@@ -7063,6 +7136,7 @@ function generateMonorepoFiles(options, _template) {
 			lint: "biome lint .",
 			fmt: "biome format . --write",
 			"fmt:check": "biome format .",
+			...isFullstack ? { storybook: "pnpm --filter ./packages/ui storybook" } : {},
 			...options.deployTarget === "dokploy" ? { deploy: "gkm deploy --provider dokploy --stage production" } : {}
 		},
 		dependencies: { zod: "~4.1.0" },
@@ -7458,7 +7532,20 @@ export const config = envParser
 			},
 			{
 				path: getRoutePath("health.ts"),
-				content: `import { e } from '@geekmidas/constructs/endpoints';
+				content: monorepo ? `import { z } from 'zod';
+import { publicRouter } from '~/router';
+
+export const healthEndpoint = publicRouter
+  .get('/health')
+  .output(z.object({
+    status: z.string(),
+    timestamp: z.string(),
+  }))
+  .handle(async () => ({
+    status: 'ok',
+    timestamp: new Date().toISOString(),
+  }));
+` : `import { e } from '@geekmidas/constructs/endpoints';
 import { z } from 'zod';
 
 export const healthEndpoint = e
@@ -7511,12 +7598,12 @@ export const listUsersEndpoint = e
 			{
 				path: getRoutePath("users/get.ts"),
 				content: modelsImport ? `import { e } from '@geekmidas/constructs/endpoints';
-import { IdSchema } from '${modelsImport}/common';
+import { IdParamsSchema } from '${modelsImport}/common';
 import { UserResponseSchema } from '${modelsImport}/user';
 
 export const getUserEndpoint = e
   .get('/users/:id')
-  .params({ id: IdSchema })
+  .params(IdParamsSchema)
   .output(UserResponseSchema)
   .handle(async ({ params }) => ({
     id: params.id,
@@ -7542,6 +7629,91 @@ export const getUserEndpoint = e
 `
 			}
 		];
+		if (options.monorepo) {
+			files.push({
+				path: "src/services/auth.ts",
+				content: `import type { Service, ServiceRegisterOptions } from '@geekmidas/services';
+
+export interface Session {
+  user: {
+    id: string;
+    email: string;
+    name: string;
+  };
+}
+
+export interface AuthClient {
+  getSession: (cookie: string) => Promise<Session | null>;
+}
+
+export const authService = {
+  serviceName: 'auth' as const,
+  async register({ envParser, context }: ServiceRegisterOptions) {
+    const logger = context.getLogger();
+
+    const config = envParser
+      .create((get) => ({
+        url: get('AUTH_URL').string(),
+      }))
+      .parse();
+
+    logger.info({ authUrl: config.url }, 'Auth service configured');
+
+    return {
+      getSession: async (cookie: string): Promise<Session | null> => {
+        const res = await fetch(\`\${config.url}/api/auth/get-session\`, {
+          headers: { cookie },
+        });
+        if (!res.ok) return null;
+        return res.json();
+      },
+    };
+  },
+} satisfies Service<'auth', AuthClient>;
+`
+			});
+			files.push({
+				path: "src/router.ts",
+				content: `import { e } from '@geekmidas/constructs/endpoints';
+import { UnauthorizedError } from '@geekmidas/errors';
+import { authService, type Session } from './services/auth.js';
+import { logger } from './config/logger.js';
+
+// Public router - no auth required
+export const publicRouter = e.logger(logger);
+
+// Router with auth service available (but session not enforced)
+export const r = publicRouter.services([authService]);
+
+// Session router - requires active session, throws if not authenticated
+export const sessionRouter = r.session<Session>(async ({ services, header }) => {
+  const cookie = header('cookie') || '';
+  const session = await services.auth.getSession(cookie);
+
+  if (!session?.user) {
+    throw new UnauthorizedError('No active session');
+  }
+
+  return session;
+});
+`
+			});
+			files.push({
+				path: getRoutePath("profile.ts"),
+				content: `import { z } from 'zod';
+import { sessionRouter } from '~/router';
+
+export const profileEndpoint = sessionRouter
+  .get('/profile')
+  .output(z.object({
+    id: z.string(),
+    email: z.string(),
+    name: z.string(),
+  }))
+  .handle(async ({ session }) => session.user);
+`
+			});
+		}
 		if (options.database) files.push({
 			path: "src/services/database.ts",
 			content: `import type { Service, ServiceRegisterOptions } from '@geekmidas/services';
@@ -8304,6 +8476,1419 @@ function generateSourceFiles(options, template) {
 	return template.files(options);
 }
 
+//#endregion
+//#region src/init/generators/ui.ts
+/**
+* Generate UI package files for fullstack template
+* Based on @geekmidas/ui with shadcn/ui, Tailwind CSS v4, and Storybook
+*/
+function generateUiPackageFiles(options) {
+	if (!options.monorepo || options.template !== "fullstack") return [];
+	const packageName = `@${options.name}/ui`;
+	const packageJson = {
+		name: packageName,
+		version: "0.0.1",
+		private: true,
+		type: "module",
+		exports: {
+			".": "./src/index.ts",
+			"./components": "./src/components/index.ts",
+			"./lib/utils": "./src/lib/utils.ts",
+			"./styles": "./src/styles/globals.css"
+		},
+		scripts: {
+			"ts:check": "tsc --noEmit",
+			storybook: "storybook dev -p 6006",
+			"build:storybook": "storybook build -o dist/storybook"
+		},
+		dependencies: {
+			"@radix-ui/react-dialog": "~1.1.4",
+			"@radix-ui/react-label": "~2.1.2",
+			"@radix-ui/react-separator": "~1.1.2",
+			"@radix-ui/react-slot": "~1.2.4",
+			"@radix-ui/react-tabs": "~1.1.2",
+			"@radix-ui/react-tooltip": "~1.1.6",
+			"class-variance-authority": "~0.7.1",
+			clsx: "^2.1.1",
+			"lucide-react": "~0.562.0",
+			"tailwind-merge": "~3.4.0"
+		},
+		devDependencies: {
+			"@storybook/addon-a11y": "^8.4.7",
+			"@storybook/addon-essentials": "^8.4.7",
+			"@storybook/addon-interactions": "^8.4.7",
+			"@storybook/react": "^8.4.7",
+			"@storybook/react-vite": "^8.4.7",
+			"@tailwindcss/vite": "^4.0.0",
+			"@types/react": "^19.0.0",
+			"@types/react-dom": "^19.0.0",
+			react: "^19.0.0",
+			"react-dom": "^19.0.0",
+			storybook: "^8.4.7",
+			tailwindcss: "^4.0.0",
+			typescript: "^5.8.2",
+			vite: "^6.0.0"
+		},
+		peerDependencies: {
+			react: ">=18.0.0",
+			"react-dom": ">=18.0.0",
+			tailwindcss: ">=4.0.0"
+		}
+	};
+	const tsConfig = {
+		extends: "../../tsconfig.json",
+		compilerOptions: {
+			jsx: "react-jsx",
+			lib: [
+				"ES2023",
+				"DOM",
+				"DOM.Iterable"
+			],
+			noEmit: true,
+			baseUrl: ".",
+			paths: { "~/*": ["./src/*"] }
+		},
+		include: ["src/**/*"],
+		exclude: [
+			"node_modules",
+			"dist",
+			"**/*.stories.tsx"
+		]
+	};
+	const componentsJson = {
+		$schema: "https://ui.shadcn.com/schema.json",
+		style: "new-york",
+		rsc: false,
+		tsx: true,
+		tailwind: {
+			config: "",
+			css: "src/styles/globals.css",
+			baseColor: "neutral",
+			cssVariables: true,
+			prefix: ""
+		},
+		aliases: {
+			components: "~/components",
+			utils: "~/lib/utils",
+			ui: "~/components/ui",
+			lib: "~/lib",
+			hooks: "~/hooks"
+		},
+		iconLibrary: "lucide"
+	};
+	const storybookMain = `import type { StorybookConfig } from '@storybook/react-vite';
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.stories.@(ts|tsx)'],
+  addons: [
+    '@storybook/addon-essentials',
+    '@storybook/addon-interactions',
+    '@storybook/addon-a11y',
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  docs: {
+    autodocs: 'tag',
+  },
+  viteFinal: async (config) => {
+    // Add Tailwind CSS v4 plugin
+    const tailwindcss = await import('@tailwindcss/vite');
+    config.plugins = config.plugins || [];
+    config.plugins.push(tailwindcss.default());
+    return config;
+  },
+};
+
+export default config;
+`;
+	const storybookPreview = `import type { Preview } from '@storybook/react';
+import '../src/styles/globals.css';
+
+const preview: Preview = {
+  parameters: {
+    backgrounds: {
+      default: 'dark',
+      values: [
+        { name: 'dark', value: '#171717' },
+        { name: 'surface', value: '#1c1c1c' },
+        { name: 'light', value: '#fafafa' },
+      ],
+    },
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+    layout: 'centered',
+  },
+};
+
+export default preview;
+`;
+	const globalsCss = `@import "tailwindcss";
+
+@theme {
+  --color-background: hsl(var(--background));
+  --color-foreground: hsl(var(--foreground));
+  --color-card: hsl(var(--card));
+  --color-card-foreground: hsl(var(--card-foreground));
+  --color-popover: hsl(var(--popover));
+  --color-popover-foreground: hsl(var(--popover-foreground));
+  --color-primary: hsl(var(--primary));
+  --color-primary-foreground: hsl(var(--primary-foreground));
+  --color-secondary: hsl(var(--secondary));
+  --color-secondary-foreground: hsl(var(--secondary-foreground));
+  --color-muted: hsl(var(--muted));
+  --color-muted-foreground: hsl(var(--muted-foreground));
+  --color-accent: hsl(var(--accent));
+  --color-accent-foreground: hsl(var(--accent-foreground));
+  --color-destructive: hsl(var(--destructive));
+  --color-destructive-foreground: hsl(var(--destructive-foreground));
+  --color-border: hsl(var(--border));
+  --color-input: hsl(var(--input));
+  --color-ring: hsl(var(--ring));
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+}
+
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 0 0% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 0 0% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 0 0% 3.9%;
+    --primary: 160 84% 39%;
+    --primary-foreground: 0 0% 98%;
+    --secondary: 0 0% 96.1%;
+    --secondary-foreground: 0 0% 9%;
+    --muted: 0 0% 96.1%;
+    --muted-foreground: 0 0% 45.1%;
+    --accent: 0 0% 96.1%;
+    --accent-foreground: 0 0% 9%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 89.8%;
+    --input: 0 0% 89.8%;
+    --ring: 160 84% 39%;
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 0 0% 9%;
+    --foreground: 0 0% 98%;
+    --card: 0 0% 11%;
+    --card-foreground: 0 0% 98%;
+    --popover: 0 0% 11%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 160 84% 52%;
+    --primary-foreground: 0 0% 9%;
+    --secondary: 0 0% 15%;
+    --secondary-foreground: 0 0% 98%;
+    --muted: 0 0% 15%;
+    --muted-foreground: 0 0% 64%;
+    --accent: 0 0% 15%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 50.6%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 18%;
+    --input: 0 0% 18%;
+    --ring: 160 84% 52%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+`;
+	const utilsTs = `import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+`;
+	const buttonTsx = `import { Slot } from '@radix-ui/react-slot';
+import { cva, type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const buttonVariants = cva(
+  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
+  {
+    variants: {
+      variant: {
+        default:
+          'bg-primary text-primary-foreground shadow hover:bg-primary/90',
+        destructive:
+          'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
+        outline:
+          'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
+        secondary:
+          'bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        default: 'h-9 px-4 py-2',
+        sm: 'h-8 rounded-md px-3 text-xs',
+        lg: 'h-10 rounded-md px-8',
+        icon: 'h-9 w-9',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  },
+);
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+    VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+}
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : 'button';
+    return (
+      <Comp
+        className={cn(buttonVariants({ variant, size, className }))}
+        ref={ref}
+        {...props}
+      />
+    );
+  },
+);
+Button.displayName = 'Button';
+
+export { Button, buttonVariants };
+`;
+	const buttonStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Button } from '.';
+
+const meta: Meta<typeof Button> = {
+  title: 'Components/Button',
+  component: Button,
+  tags: ['autodocs'],
+  argTypes: {
+    variant: {
+      control: 'select',
+      options: ['default', 'destructive', 'outline', 'secondary', 'ghost', 'link'],
+    },
+    size: {
+      control: 'select',
+      options: ['default', 'sm', 'lg', 'icon'],
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof Button>;
+
+export const Default: Story = {
+  args: {
+    children: 'Button',
+    variant: 'default',
+    size: 'default',
+  },
+};
+
+export const Secondary: Story = {
+  args: {
+    children: 'Secondary',
+    variant: 'secondary',
+  },
+};
+
+export const Destructive: Story = {
+  args: {
+    children: 'Destructive',
+    variant: 'destructive',
+  },
+};
+
+export const Outline: Story = {
+  args: {
+    children: 'Outline',
+    variant: 'outline',
+  },
+};
+
+export const Ghost: Story = {
+  args: {
+    children: 'Ghost',
+    variant: 'ghost',
+  },
+};
+
+export const Link: Story = {
+  args: {
+    children: 'Link',
+    variant: 'link',
+  },
+};
+`;
+	const inputTsx = `import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<'input'>>(
+  ({ className, type, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={cn(
+          'flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+          className,
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  },
+);
+Input.displayName = 'Input';
+
+export { Input };
+`;
+	const cardTsx = `import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const Card = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn(
+      'rounded-xl border bg-card text-card-foreground shadow',
+      className,
+    )}
+    {...props}
+  />
+));
+Card.displayName = 'Card';
+
+const CardHeader = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn('flex flex-col space-y-1.5 p-6', className)}
+    {...props}
+  />
+));
+CardHeader.displayName = 'CardHeader';
+
+const CardTitle = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn('font-semibold leading-none tracking-tight', className)}
+    {...props}
+  />
+));
+CardTitle.displayName = 'CardTitle';
+
+const CardDescription = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn('text-sm text-muted-foreground', className)}
+    {...props}
+  />
+));
+CardDescription.displayName = 'CardDescription';
+
+const CardContent = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+));
+CardContent.displayName = 'CardContent';
+
+const CardFooter = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn('flex items-center p-6 pt-0', className)}
+    {...props}
+  />
+));
+CardFooter.displayName = 'CardFooter';
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
+`;
+	const inputStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Input } from '.';
+
+const meta: Meta<typeof Input> = {
+  title: 'Components/Input',
+  component: Input,
+  tags: ['autodocs'],
+  argTypes: {
+    type: {
+      control: 'select',
+      options: ['text', 'email', 'password', 'number', 'search', 'tel', 'url'],
+    },
+    disabled: {
+      control: 'boolean',
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof Input>;
+
+export const Default: Story = {
+  args: {
+    placeholder: 'Enter text...',
+  },
+};
+
+export const Email: Story = {
+  args: {
+    type: 'email',
+    placeholder: 'Enter email...',
+  },
+};
+
+export const Password: Story = {
+  args: {
+    type: 'password',
+    placeholder: 'Enter password...',
+  },
+};
+
+export const Disabled: Story = {
+  args: {
+    placeholder: 'Disabled input',
+    disabled: true,
+  },
+};
+
+export const WithValue: Story = {
+  args: {
+    defaultValue: 'Hello World',
+  },
+};
+`;
+	const cardStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Button } from '../button';
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from '.';
+import { Input } from '../input';
+
+const meta: Meta<typeof Card> = {
+  title: 'Components/Card',
+  component: Card,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof Card>;
+
+export const Default: Story = {
+  render: () => (
+    <Card className="w-[350px]">
+      <CardHeader>
+        <CardTitle>Card Title</CardTitle>
+        <CardDescription>Card description goes here.</CardDescription>
+      </CardHeader>
+      <CardContent>
+        <p>Card content goes here.</p>
+      </CardContent>
+    </Card>
+  ),
+};
+
+export const WithFooter: Story = {
+  render: () => (
+    <Card className="w-[350px]">
+      <CardHeader>
+        <CardTitle>Create Account</CardTitle>
+        <CardDescription>Enter your details below.</CardDescription>
+      </CardHeader>
+      <CardContent className="space-y-4">
+        <Input placeholder="Email" type="email" />
+        <Input placeholder="Password" type="password" />
+      </CardContent>
+      <CardFooter className="flex justify-between">
+        <Button variant="outline">Cancel</Button>
+        <Button>Create</Button>
+      </CardFooter>
+    </Card>
+  ),
+};
+
+export const Simple: Story = {
+  render: () => (
+    <Card className="w-[350px] p-6">
+      <p>Simple card with just content.</p>
+    </Card>
+  ),
+};
+`;
+	const labelTsx = `import * as LabelPrimitive from '@radix-ui/react-label';
+import { cva, type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const labelVariants = cva(
+  'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
+);
+
+const Label = React.forwardRef<
+  React.ElementRef<typeof LabelPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
+    VariantProps<typeof labelVariants>
+>(({ className, ...props }, ref) => (
+  <LabelPrimitive.Root
+    ref={ref}
+    className={cn(labelVariants(), className)}
+    {...props}
+  />
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+
+export { Label };
+`;
+	const labelStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Input } from '../input';
+import { Label } from '.';
+
+const meta: Meta<typeof Label> = {
+  title: 'Components/Label',
+  component: Label,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof Label>;
+
+export const Default: Story = {
+  args: {
+    children: 'Label',
+  },
+};
+
+export const WithInput: Story = {
+  render: () => (
+    <div className="grid w-full max-w-sm items-center gap-1.5">
+      <Label htmlFor="email">Email</Label>
+      <Input type="email" id="email" placeholder="Email" />
+    </div>
+  ),
+};
+
+export const Disabled: Story = {
+  render: () => (
+    <div className="grid w-full max-w-sm items-center gap-1.5">
+      <Label htmlFor="disabled" className="peer-disabled:cursor-not-allowed peer-disabled:opacity-70">
+        Disabled
+      </Label>
+      <Input type="text" id="disabled" placeholder="Disabled" disabled className="peer" />
+    </div>
+  ),
+};
+`;
+	const badgeTsx = `import { cva, type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const badgeVariants = cva(
+  'inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+  {
+    variants: {
+      variant: {
+        default:
+          'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',
+        secondary:
+          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        destructive:
+          'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80',
+        outline: 'text-foreground',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  },
+);
+
+export interface BadgeProps
+  extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof badgeVariants> {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+  return (
+    <div className={cn(badgeVariants({ variant }), className)} {...props} />
+  );
+}
+
+export { Badge, badgeVariants };
+`;
+	const badgeStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Badge } from '.';
+
+const meta: Meta<typeof Badge> = {
+  title: 'Components/Badge',
+  component: Badge,
+  tags: ['autodocs'],
+  argTypes: {
+    variant: {
+      control: 'select',
+      options: ['default', 'secondary', 'destructive', 'outline'],
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof Badge>;
+
+export const Default: Story = {
+  args: {
+    children: 'Badge',
+    variant: 'default',
+  },
+};
+
+export const Secondary: Story = {
+  args: {
+    children: 'Secondary',
+    variant: 'secondary',
+  },
+};
+
+export const Destructive: Story = {
+  args: {
+    children: 'Destructive',
+    variant: 'destructive',
+  },
+};
+
+export const Outline: Story = {
+  args: {
+    children: 'Outline',
+    variant: 'outline',
+  },
+};
+`;
+	const separatorTsx = `import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const Separator = React.forwardRef<
+  React.ElementRef<typeof SeparatorPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
+>(
+  (
+    { className, orientation = 'horizontal', decorative = true, ...props },
+    ref,
+  ) => (
+    <SeparatorPrimitive.Root
+      ref={ref}
+      decorative={decorative}
+      orientation={orientation}
+      className={cn(
+        'shrink-0 bg-border',
+        orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',
+        className,
+      )}
+      {...props}
+    />
+  ),
+);
+Separator.displayName = SeparatorPrimitive.Root.displayName;
+
+export { Separator };
+`;
+	const separatorStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Separator } from '.';
+
+const meta: Meta<typeof Separator> = {
+  title: 'Components/Separator',
+  component: Separator,
+  tags: ['autodocs'],
+  argTypes: {
+    orientation: {
+      control: 'select',
+      options: ['horizontal', 'vertical'],
+    },
+  },
+};
+
+export default meta;
+type Story = StoryObj<typeof Separator>;
+
+export const Horizontal: Story = {
+  render: () => (
+    <div className="w-[300px]">
+      <div className="space-y-1">
+        <h4 className="text-sm font-medium leading-none">Radix Primitives</h4>
+        <p className="text-sm text-muted-foreground">
+          An open-source UI component library.
+        </p>
+      </div>
+      <Separator className="my-4" />
+      <div className="flex h-5 items-center space-x-4 text-sm">
+        <div>Blog</div>
+        <Separator orientation="vertical" />
+        <div>Docs</div>
+        <Separator orientation="vertical" />
+        <div>Source</div>
+      </div>
+    </div>
+  ),
+};
+
+export const Vertical: Story = {
+  render: () => (
+    <div className="flex h-5 items-center space-x-4 text-sm">
+      <div>Blog</div>
+      <Separator orientation="vertical" />
+      <div>Docs</div>
+      <Separator orientation="vertical" />
+      <div>Source</div>
+    </div>
+  ),
+};
+`;
+	const tabsTsx = `import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const Tabs = TabsPrimitive.Root;
+
+const TabsList = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.List
+    ref={ref}
+    className={cn(
+      'inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1 text-muted-foreground',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+
+const TabsTrigger = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+
+const TabsContent = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Content
+    ref={ref}
+    className={cn(
+      'mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export { Tabs, TabsList, TabsTrigger, TabsContent };
+`;
+	const tabsStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '.';
+import { Button } from '../button';
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '../card';
+import { Input } from '../input';
+import { Label } from '../label';
+
+const meta: Meta<typeof Tabs> = {
+  title: 'Components/Tabs',
+  component: Tabs,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof Tabs>;
+
+export const Default: Story = {
+  render: () => (
+    <Tabs defaultValue="account" className="w-[400px]">
+      <TabsList>
+        <TabsTrigger value="account">Account</TabsTrigger>
+        <TabsTrigger value="password">Password</TabsTrigger>
+      </TabsList>
+      <TabsContent value="account">
+        <Card>
+          <CardHeader>
+            <CardTitle>Account</CardTitle>
+            <CardDescription>
+              Make changes to your account here. Click save when you're done.
+            </CardDescription>
+          </CardHeader>
+          <CardContent className="space-y-2">
+            <div className="space-y-1">
+              <Label htmlFor="name">Name</Label>
+              <Input id="name" defaultValue="Pedro Duarte" />
+            </div>
+            <div className="space-y-1">
+              <Label htmlFor="username">Username</Label>
+              <Input id="username" defaultValue="@peduarte" />
+            </div>
+          </CardContent>
+          <CardFooter>
+            <Button>Save changes</Button>
+          </CardFooter>
+        </Card>
+      </TabsContent>
+      <TabsContent value="password">
+        <Card>
+          <CardHeader>
+            <CardTitle>Password</CardTitle>
+            <CardDescription>
+              Change your password here. After saving, you'll be logged out.
+            </CardDescription>
+          </CardHeader>
+          <CardContent className="space-y-2">
+            <div className="space-y-1">
+              <Label htmlFor="current">Current password</Label>
+              <Input id="current" type="password" />
+            </div>
+            <div className="space-y-1">
+              <Label htmlFor="new">New password</Label>
+              <Input id="new" type="password" />
+            </div>
+          </CardContent>
+          <CardFooter>
+            <Button>Save password</Button>
+          </CardFooter>
+        </Card>
+      </TabsContent>
+    </Tabs>
+  ),
+};
+`;
+	const tooltipTsx = `import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const TooltipProvider = TooltipPrimitive.Provider;
+
+const Tooltip = TooltipPrimitive.Root;
+
+const TooltipTrigger = TooltipPrimitive.Trigger;
+
+const TooltipContent = React.forwardRef<
+  React.ElementRef<typeof TooltipPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
+>(({ className, sideOffset = 4, ...props }, ref) => (
+  <TooltipPrimitive.Portal>
+    <TooltipPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        'z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+        className,
+      )}
+      {...props}
+    />
+  </TooltipPrimitive.Portal>
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
+`;
+	const tooltipStories = `import type { Meta, StoryObj } from '@storybook/react';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '.';
+import { Button } from '../button';
+
+const meta: Meta<typeof Tooltip> = {
+  title: 'Components/Tooltip',
+  component: Tooltip,
+  tags: ['autodocs'],
+  decorators: [
+    (Story) => (
+      <TooltipProvider>
+        <Story />
+      </TooltipProvider>
+    ),
+  ],
+};
+
+export default meta;
+type Story = StoryObj<typeof Tooltip>;
+
+export const Default: Story = {
+  render: () => (
+    <Tooltip>
+      <TooltipTrigger asChild>
+        <Button variant="outline">Hover me</Button>
+      </TooltipTrigger>
+      <TooltipContent>
+        <p>Add to library</p>
+      </TooltipContent>
+    </Tooltip>
+  ),
+};
+
+export const Positions: Story = {
+  render: () => (
+    <div className="flex gap-4">
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button variant="outline">Top</Button>
+        </TooltipTrigger>
+        <TooltipContent side="top">
+          <p>Top tooltip</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button variant="outline">Bottom</Button>
+        </TooltipTrigger>
+        <TooltipContent side="bottom">
+          <p>Bottom tooltip</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button variant="outline">Left</Button>
+        </TooltipTrigger>
+        <TooltipContent side="left">
+          <p>Left tooltip</p>
+        </TooltipContent>
+      </Tooltip>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <Button variant="outline">Right</Button>
+        </TooltipTrigger>
+        <TooltipContent side="right">
+          <p>Right tooltip</p>
+        </TooltipContent>
+      </Tooltip>
+    </div>
+  ),
+};
+`;
+	const dialogTsx = `import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { X } from 'lucide-react';
+import * as React from 'react';
+
+import { cn } from '~/lib/utils';
+
+const Dialog = DialogPrimitive.Root;
+
+const DialogTrigger = DialogPrimitive.Trigger;
+
+const DialogPortal = DialogPrimitive.Portal;
+
+const DialogClose = DialogPrimitive.Close;
+
+const DialogOverlay = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Overlay>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>
+>(({ className, ...props }, ref) => (
+  <DialogPrimitive.Overlay
+    ref={ref}
+    className={cn(
+      'fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',
+      className,
+    )}
+    {...props}
+  />
+));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+
+const DialogContent = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
+>(({ className, children, ...props }, ref) => (
+  <DialogPortal>
+    <DialogOverlay />
+    <DialogPrimitive.Content
+      ref={ref}
+      className={cn(
+        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
+        className,
+      )}
+      {...props}
+    >
+      {children}
+      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
+        <X className="h-4 w-4" />
+        <span className="sr-only">Close</span>
+      </DialogPrimitive.Close>
+    </DialogPrimitive.Content>
+  </DialogPortal>
+));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+
+const DialogHeader = ({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLDivElement>) => (
+  <div
+    className={cn(
+      'flex flex-col space-y-1.5 text-center sm:text-left',
+      className,
+    )}
+    {...props}
+  />
+);
+DialogHeader.displayName = 'DialogHeader';
+
+const DialogFooter = ({
+  className,
+  ...props
+}: React.HTMLAttributes<HTMLDivElement>) => (
+  <div
+    className={cn(
+      'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',
+      className,
+    )}
+    {...props}
+  />
+);
+DialogFooter.displayName = 'DialogFooter';
+
+const DialogTitle = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Title>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
+>(({ className, ...props }, ref) => (
+  <DialogPrimitive.Title
+    ref={ref}
+    className={cn(
+      'text-lg font-semibold leading-none tracking-tight',
+      className,
+    )}
+    {...props}
+  />
+));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+
+const DialogDescription = React.forwardRef<
+  React.ElementRef<typeof DialogPrimitive.Description>,
+  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
+>(({ className, ...props }, ref) => (
+  <DialogPrimitive.Description
+    ref={ref}
+    className={cn('text-sm text-muted-foreground', className)}
+    {...props}
+  />
+));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+
+export {
+  Dialog,
+  DialogPortal,
+  DialogOverlay,
+  DialogTrigger,
+  DialogClose,
+  DialogContent,
+  DialogHeader,
+  DialogFooter,
+  DialogTitle,
+  DialogDescription,
+};
+`;
+	const dialogStories = `import type { Meta, StoryObj } from '@storybook/react';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from '.';
+import { Button } from '../button';
+import { Input } from '../input';
+import { Label } from '../label';
+
+const meta: Meta<typeof Dialog> = {
+  title: 'Components/Dialog',
+  component: Dialog,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<typeof Dialog>;
+
+export const Default: Story = {
+  render: () => (
+    <Dialog>
+      <DialogTrigger asChild>
+        <Button variant="outline">Edit Profile</Button>
+      </DialogTrigger>
+      <DialogContent className="sm:max-w-[425px]">
+        <DialogHeader>
+          <DialogTitle>Edit profile</DialogTitle>
+          <DialogDescription>
+            Make changes to your profile here. Click save when you're done.
+          </DialogDescription>
+        </DialogHeader>
+        <div className="grid gap-4 py-4">
+          <div className="grid grid-cols-4 items-center gap-4">
+            <Label htmlFor="name" className="text-right">
+              Name
+            </Label>
+            <Input id="name" defaultValue="Pedro Duarte" className="col-span-3" />
+          </div>
+          <div className="grid grid-cols-4 items-center gap-4">
+            <Label htmlFor="username" className="text-right">
+              Username
+            </Label>
+            <Input id="username" defaultValue="@peduarte" className="col-span-3" />
+          </div>
+        </div>
+        <DialogFooter>
+          <Button type="submit">Save changes</Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  ),
+};
+
+export const Alert: Story = {
+  render: () => (
+    <Dialog>
+      <DialogTrigger asChild>
+        <Button variant="destructive">Delete Account</Button>
+      </DialogTrigger>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>Are you absolutely sure?</DialogTitle>
+          <DialogDescription>
+            This action cannot be undone. This will permanently delete your
+            account and remove your data from our servers.
+          </DialogDescription>
+        </DialogHeader>
+        <DialogFooter>
+          <Button variant="outline">Cancel</Button>
+          <Button variant="destructive">Delete</Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  ),
+};
+`;
+	const componentsUiIndex = `export { Button, type ButtonProps, buttonVariants } from './button';
+export { Input } from './input';
+export {
+  Card,
+  CardHeader,
+  CardFooter,
+  CardTitle,
+  CardDescription,
+  CardContent,
+} from './card';
+export { Label } from './label';
+export { Badge, type BadgeProps, badgeVariants } from './badge';
+export { Separator } from './separator';
+export { Tabs, TabsList, TabsTrigger, TabsContent } from './tabs';
+export {
+  Tooltip,
+  TooltipTrigger,
+  TooltipContent,
+  TooltipProvider,
+} from './tooltip';
+export {
+  Dialog,
+  DialogPortal,
+  DialogOverlay,
+  DialogTrigger,
+  DialogClose,
+  DialogContent,
+  DialogHeader,
+  DialogFooter,
+  DialogTitle,
+  DialogDescription,
+} from './dialog';
+`;
+	const buttonIndexTsx = buttonTsx;
+	const inputIndexTsx = inputTsx;
+	const cardIndexTsx = cardTsx;
+	const componentsIndex = `export * from './ui';
+`;
+	const indexTs = `// @${options.name}/ui - Shared UI component library
+
+// shadcn/ui components
+export * from './components';
+
+// Utilities
+export { cn } from './lib/utils';
+`;
+	const gitignore = `node_modules/
+dist/
+storybook-static/
+*.log
+`;
+	return [
+		{
+			path: "packages/ui/package.json",
+			content: `${JSON.stringify(packageJson, null, 2)}\n`
+		},
+		{
+			path: "packages/ui/tsconfig.json",
+			content: `${JSON.stringify(tsConfig, null, 2)}\n`
+		},
+		{
+			path: "packages/ui/components.json",
+			content: `${JSON.stringify(componentsJson, null, 2)}\n`
+		},
+		{
+			path: "packages/ui/.storybook/main.ts",
+			content: storybookMain
+		},
+		{
+			path: "packages/ui/.storybook/preview.ts",
+			content: storybookPreview
+		},
+		{
+			path: "packages/ui/src/styles/globals.css",
+			content: globalsCss
+		},
+		{
+			path: "packages/ui/src/lib/utils.ts",
+			content: utilsTs
+		},
+		{
+			path: "packages/ui/src/components/ui/button/index.tsx",
+			content: buttonIndexTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/button/button.stories.tsx",
+			content: buttonStories
+		},
+		{
+			path: "packages/ui/src/components/ui/input/index.tsx",
+			content: inputIndexTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/input/input.stories.tsx",
+			content: inputStories
+		},
+		{
+			path: "packages/ui/src/components/ui/card/index.tsx",
+			content: cardIndexTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/card/card.stories.tsx",
+			content: cardStories
+		},
+		{
+			path: "packages/ui/src/components/ui/label/index.tsx",
+			content: labelTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/label/label.stories.tsx",
+			content: labelStories
+		},
+		{
+			path: "packages/ui/src/components/ui/badge/index.tsx",
+			content: badgeTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/badge/badge.stories.tsx",
+			content: badgeStories
+		},
+		{
+			path: "packages/ui/src/components/ui/separator/index.tsx",
+			content: separatorTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/separator/separator.stories.tsx",
+			content: separatorStories
+		},
+		{
+			path: "packages/ui/src/components/ui/tabs/index.tsx",
+			content: tabsTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/tabs/tabs.stories.tsx",
+			content: tabsStories
+		},
+		{
+			path: "packages/ui/src/components/ui/tooltip/index.tsx",
+			content: tooltipTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/tooltip/tooltip.stories.tsx",
+			content: tooltipStories
+		},
+		{
+			path: "packages/ui/src/components/ui/dialog/index.tsx",
+			content: dialogTsx
+		},
+		{
+			path: "packages/ui/src/components/ui/dialog/dialog.stories.tsx",
+			content: dialogStories
+		},
+		{
+			path: "packages/ui/src/components/ui/index.ts",
+			content: componentsUiIndex
+		},
+		{
+			path: "packages/ui/src/components/index.ts",
+			content: componentsIndex
+		},
+		{
+			path: "packages/ui/src/index.ts",
+			content: indexTs
+		},
+		{
+			path: "packages/ui/.gitignore",
+			content: gitignore
+		}
+	];
+}
+
 //#endregion
 //#region src/init/generators/web.ts
 /**
@@ -8313,29 +9898,35 @@ function generateWebAppFiles(options) {
 	if (!options.monorepo || options.template !== "fullstack") return [];
 	const packageName = `@${options.name}/web`;
 	const modelsPackage = `@${options.name}/models`;
+	const uiPackage = `@${options.name}/ui`;
 	const packageJson = {
 		name: packageName,
 		version: "0.0.1",
 		private: true,
 		type: "module",
 		scripts: {
-			dev: "next dev -p 3001",
-			build: "next build",
+			dev: "gkm exec -- next dev --turbopack",
+			build: "gkm exec -- next build",
 			start: "next start",
 			typecheck: "tsc --noEmit"
 		},
 		dependencies: {
 			[modelsPackage]: "workspace:*",
+			[uiPackage]: "workspace:*",
 			"@geekmidas/client": GEEKMIDAS_VERSIONS["@geekmidas/client"],
 			"@tanstack/react-query": "~5.80.0",
+			"better-auth": "~1.2.0",
 			next: "~16.1.0",
 			react: "~19.2.0",
 			"react-dom": "~19.2.0"
 		},
 		devDependencies: {
+			"@geekmidas/cli": GEEKMIDAS_VERSIONS["@geekmidas/cli"],
+			"@tailwindcss/postcss": "^4.0.0",
 			"@types/node": "~22.0.0",
 			"@types/react": "~19.0.0",
 			"@types/react-dom": "~19.0.0",
+			tailwindcss: "^4.0.0",
 			typescript: "~5.8.2"
 		}
 	};
@@ -8344,10 +9935,16 @@ function generateWebAppFiles(options) {
 const nextConfig: NextConfig = {
   output: 'standalone',
   reactStrictMode: true,
-  transpilePackages: ['${modelsPackage}'],
+  transpilePackages: ['${modelsPackage}', '${uiPackage}'],
 };
 
 export default nextConfig;
+`;
+	const postcssConfig = `export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+  },
+};
 `;
 	const tsConfig = {
 		extends: "../../tsconfig.json",
@@ -8370,9 +9967,11 @@ export default nextConfig;
 			incremental: true,
 			plugins: [{ name: "next" }],
 			paths: {
-				"@/*": ["./src/*"],
+				"~/*": ["./src/*"],
 				[`${modelsPackage}`]: ["../../packages/models/src"],
-				[`${modelsPackage}/*`]: ["../../packages/models/src/*"]
+				[`${modelsPackage}/*`]: ["../../packages/models/src/*"],
+				[`${uiPackage}`]: ["../../packages/ui/src"],
+				[`${uiPackage}/*`]: ["../../packages/ui/src/*"]
 			},
 			baseUrl: "."
 		},
@@ -8384,68 +9983,66 @@ export default nextConfig;
 		],
 		exclude: ["node_modules"]
 	};
+	const queryClientTs = `import { QueryClient } from '@tanstack/react-query';
+
+function makeQueryClient() {
+  return new QueryClient({
+    defaultOptions: {
+      queries: {
+        staleTime: 60 * 1000,
+      },
+    },
+  });
+}
+
+let browserQueryClient: QueryClient | undefined = undefined;
+
+export function getQueryClient() {
+  if (typeof window === 'undefined') {
+    // Server: always make a new query client
+    return makeQueryClient();
+  }
+  // Browser: reuse existing query client
+  if (!browserQueryClient) browserQueryClient = makeQueryClient();
+  return browserQueryClient;
+}
+`;
+	const authClientTs = `import { createAuthClient } from 'better-auth/react';
+import { magicLinkClient } from 'better-auth/client/plugins';
+
+export const authClient = createAuthClient({
+  baseURL: process.env.NEXT_PUBLIC_AUTH_URL || 'http://localhost:3002',
+  plugins: [magicLinkClient()],
+});
+
+export const { signIn, signUp, signOut, useSession, magicLink } = authClient;
+`;
 	const providersTsx = `'use client';
 
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { useState } from 'react';
+import { QueryClientProvider } from '@tanstack/react-query';
+import { getQueryClient } from '~/lib/query-client';
 
 export function Providers({ children }: { children: React.ReactNode }) {
-  const [queryClient] = useState(
-    () =>
-      new QueryClient({
-        defaultOptions: {
-          queries: {
-            staleTime: 60 * 1000,
-          },
-        },
-      }),
-  );
+  const queryClient = getQueryClient();
 
   return (
     <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
   );
 }
 `;
-	const apiIndexTs = `import { TypedFetcher } from '@geekmidas/client/fetcher';
-import { createEndpointHooks } from '@geekmidas/client/endpoint-hooks';
-
-// TODO: Run 'gkm openapi' to generate typed paths from your API
-// This is a placeholder that will be replaced by the generated openapi.ts
-interface paths {
-  '/health': {
-    get: {
-      responses: {
-        200: {
-          content: {
-            'application/json': { status: string; timestamp: string };
-          };
-        };
-      };
-    };
-  };
-  '/users': {
-    get: {
-      responses: {
-        200: {
-          content: {
-            'application/json': { users: Array<{ id: string; name: string }> };
-          };
-        };
-      };
-    };
-  };
-}
-
-const baseURL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000';
+	const apiIndexTs = `import { createApi } from './openapi';
+import { getQueryClient } from '~/lib/query-client';
 
-const fetcher = new TypedFetcher<paths>({ baseURL });
-
-const hooks = createEndpointHooks<paths>(fetcher.request.bind(fetcher));
-
-export const api = Object.assign(fetcher.request.bind(fetcher), hooks);
+export const api = createApi({
+  baseURL: process.env.NEXT_PUBLIC_API_URL || 'http://localhost:3000',
+  queryClient: getQueryClient(),
+});
+`;
+	const globalsCss = `@import '${uiPackage}/styles';
 `;
 	const layoutTsx = `import type { Metadata } from 'next';
 import { Providers } from './providers';
+import './globals.css';
 
 export const metadata: Metadata = {
   title: '${options.name}',
@@ -8466,42 +10063,59 @@ export default function RootLayout({
   );
 }
 `;
-	const pageTsx = `import { api } from '@/api';
+	const pageTsx = `import { api } from '~/api';
+import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle } from '${uiPackage}/components';
 
 export default async function Home() {
   // Type-safe API call using the generated client
   const health = await api('GET /health').catch(() => null);
 
   return (
-    <main style={{ padding: '2rem', fontFamily: 'system-ui' }}>
-      <h1>Welcome to ${options.name}</h1>
-
-      <section style={{ marginTop: '2rem' }}>
-        <h2>API Status</h2>
-        {health ? (
-          <pre style={{ background: '#f0f0f0', padding: '1rem', borderRadius: '8px' }}>
-            {JSON.stringify(health, null, 2)}
-          </pre>
-        ) : (
-          <p>Unable to connect to API</p>
-        )}
-      </section>
-
-      <section style={{ marginTop: '2rem' }}>
-        <h2>Next Steps</h2>
-        <ul>
-          <li>Run <code>gkm openapi</code> to generate typed API client</li>
-          <li>Edit <code>apps/web/src/app/page.tsx</code> to customize this page</li>
-          <li>Add API routes in <code>apps/api/src/endpoints/</code></li>
-          <li>Define shared schemas in <code>packages/models/src/</code></li>
-        </ul>
-      </section>
+    <main className="min-h-screen bg-background p-8">
+      <div className="mx-auto max-w-4xl space-y-8">
+        <div className="space-y-2">
+          <h1 className="text-4xl font-bold tracking-tight">Welcome to ${options.name}</h1>
+          <p className="text-muted-foreground">Your fullstack application is ready.</p>
+        </div>
+
+        <Card>
+          <CardHeader>
+            <CardTitle>API Status</CardTitle>
+            <CardDescription>Connection to your backend API</CardDescription>
+          </CardHeader>
+          <CardContent>
+            {health ? (
+              <pre className="rounded-lg bg-muted p-4 text-sm">
+                {JSON.stringify(health, null, 2)}
+              </pre>
+            ) : (
+              <p className="text-destructive">Unable to connect to API</p>
+            )}
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader>
+            <CardTitle>Next Steps</CardTitle>
+            <CardDescription>Get started with your project</CardDescription>
+          </CardHeader>
+          <CardContent className="space-y-4">
+            <ul className="list-inside list-disc space-y-2 text-muted-foreground">
+              <li>Run <code className="rounded bg-muted px-1">gkm openapi</code> to generate typed API client</li>
+              <li>Edit <code className="rounded bg-muted px-1">apps/web/src/app/page.tsx</code> to customize this page</li>
+              <li>Add API routes in <code className="rounded bg-muted px-1">apps/api/src/endpoints/</code></li>
+              <li>Add UI components with <code className="rounded bg-muted px-1">npx shadcn@latest add</code> in packages/ui</li>
+            </ul>
+            <div className="flex gap-4">
+              <Button>Get Started</Button>
+              <Button variant="outline">Documentation</Button>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
     </main>
   );
 }
-`;
-	const envLocal = `# API URL for client-side requests
-NEXT_PUBLIC_API_URL=http://localhost:3000
 `;
 	const gitignore = `.next/
 node_modules/
@@ -8517,10 +10131,18 @@ node_modules/
 			path: "apps/web/next.config.ts",
 			content: nextConfig
 		},
+		{
+			path: "apps/web/postcss.config.mjs",
+			content: postcssConfig
+		},
 		{
 			path: "apps/web/tsconfig.json",
 			content: `${JSON.stringify(tsConfig, null, 2)}\n`
 		},
+		{
+			path: "apps/web/src/app/globals.css",
+			content: globalsCss
+		},
 		{
 			path: "apps/web/src/app/layout.tsx",
 			content: layoutTsx
@@ -8534,12 +10156,16 @@ node_modules/
 			content: pageTsx
 		},
 		{
-			path: "apps/web/src/api/index.ts",
-			content: apiIndexTs
+			path: "apps/web/src/lib/query-client.ts",
+			content: queryClientTs
 		},
 		{
-			path: "apps/web/.env.local",
-			content: envLocal
+			path: "apps/web/src/lib/auth-client.ts",
+			content: authClientTs
+		},
+		{
+			path: "apps/web/src/api/index.ts",
+			content: apiIndexTs
 		},
 		{
 			path: "apps/web/.gitignore",
@@ -8778,6 +10404,7 @@ async function initCommand(projectName, options = {}) {
 	const rootFiles = baseTemplate ? [...generateMonorepoFiles(templateOptions, baseTemplate), ...generateModelsPackage(templateOptions)] : [];
 	const webAppFiles = isFullstack ? generateWebAppFiles(templateOptions) : [];
 	const authAppFiles = isFullstack ? generateAuthAppFiles(templateOptions) : [];
+	const uiPackageFiles = isFullstack ? generateUiPackageFiles(templateOptions) : [];
 	for (const { path, content } of rootFiles) {
 		const fullPath = join(targetDir, path);
 		await mkdir(dirname(fullPath), { recursive: true });
@@ -8803,6 +10430,11 @@ async function initCommand(projectName, options = {}) {
 		await mkdir(dirname(fullPath), { recursive: true });
 		await writeFile(fullPath, content);
 	}
+	for (const { path, content } of uiPackageFiles) {
+		const fullPath = join(targetDir, path);
+		await mkdir(dirname(fullPath), { recursive: true });
+		await writeFile(fullPath, content);
+	}
 	console.log("🔐 Initializing encrypted secrets...\n");
 	const secretServices = [];
 	if (services.db) secretServices.push("postgres");
@@ -8822,6 +10454,7 @@ async function initCommand(projectName, options = {}) {
 			customSecrets[passwordKey] = app.password;
 		}
 		customSecrets.AUTH_PORT = "3002";
+		customSecrets.AUTH_URL = "http://localhost:3002";
 		customSecrets.BETTER_AUTH_SECRET = `better-auth-${Date.now()}-${Math.random().toString(36).slice(2)}`;
 		customSecrets.BETTER_AUTH_URL = "http://localhost:3002";
 		customSecrets.BETTER_AUTH_TRUSTED_ORIGINS = "http://localhost:3000,http://localhost:3001";
@@ -8898,7 +10531,8 @@ function printNextSteps(projectName, options, pkgManager) {
 			console.log(`  │   └── web/          # Next.js frontend`);
 		}
 		console.log(`  ├── packages/`);
-		console.log(`  │   └── models/       # Shared Zod schemas`);
+		console.log(`  │   ├── models/       # Shared Zod schemas`);
+		if (isFullstackTemplate(options.template)) console.log(`  │   └── ui/           # Shared UI components`);
 		console.log(`  ├── .gkm/secrets/     # Encrypted secrets`);
 		console.log(`  ├── gkm.config.ts     # Workspace config`);
 		console.log(`  └── turbo.json        # Turbo config`);
@@ -8914,7 +10548,7 @@ function printNextSteps(projectName, options, pkgManager) {
 		console.log(`  ${getRunCommand(pkgManager, "deploy")}`);
 		console.log("");
 	}
-	console.log("📚 Documentation: https://docs.geekmidas.dev");
+	console.log("📚 Documentation: https://geekmidas.github.io/toolbox/");
 	console.log("");
 }
 
@@ -9466,6 +11100,46 @@ program.command("whoami").description("Show current authentication status").acti
 		process.exit(1);
 	}
 });
+program.command("state:pull").description("Pull deployment state from remote to local").requiredOption("--stage <stage>", "Deployment stage (e.g., production, staging)").action(async (options) => {
+	try {
+		const globalOptions = program.opts();
+		if (globalOptions.cwd) process.chdir(globalOptions.cwd);
+		await statePullCommand(options);
+	} catch (error) {
+		console.error(error instanceof Error ? error.message : "Command failed");
+		process.exit(1);
+	}
+});
+program.command("state:push").description("Push deployment state from local to remote").requiredOption("--stage <stage>", "Deployment stage (e.g., production, staging)").action(async (options) => {
+	try {
+		const globalOptions = program.opts();
+		if (globalOptions.cwd) process.chdir(globalOptions.cwd);
+		await statePushCommand(options);
+	} catch (error) {
+		console.error(error instanceof Error ? error.message : "Command failed");
+		process.exit(1);
+	}
+});
+program.command("state:show").description("Show deployment state for a stage").requiredOption("--stage <stage>", "Deployment stage (e.g., production, staging)").option("--json", "Output as JSON").action(async (options) => {
+	try {
+		const globalOptions = program.opts();
+		if (globalOptions.cwd) process.chdir(globalOptions.cwd);
+		await stateShowCommand(options);
+	} catch (error) {
+		console.error(error instanceof Error ? error.message : "Command failed");
+		process.exit(1);
+	}
+});
+program.command("state:diff").description("Compare local and remote deployment state").requiredOption("--stage <stage>", "Deployment stage (e.g., production, staging)").action(async (options) => {
+	try {
+		const globalOptions = program.opts();
+		if (globalOptions.cwd) process.chdir(globalOptions.cwd);
+		await stateDiffCommand(options);
+	} catch (error) {
+		console.error(error instanceof Error ? error.message : "Command failed");
+		process.exit(1);
+	}
+});
 program.parse();
 
 //#endregion