feat(web): serve the SvelteKit app on cryptly.dev via Vercel

.gitignore

@@ -12,4 +12,6 @@ build/
 .env
 .env.*
 !.env.example
+!apps/web/.env.production
+.vercel/
 .dev.vars

AGENTS.md

@@ -57,6 +57,8 @@ pnpm build             # vite build using the Cloudflare adapter
 
 - `pnpm check` is the typecheck for the SvelteKit app.
 - `pnpm build` verifies the Cloudflare Workers output.
+- Production (cryptly.dev) is served by Vercel: `frontend/vercel.json` builds `apps/web` with `adapter-vercel` (selected when `VERCEL=1`).
+- Public env is inlined at build time; production values live in `apps/web/.env.production`.
 
 ### Backend SDK (`packages/backend-sdk/`)
 

CLAUDE.md

@@ -57,6 +57,8 @@ pnpm build             # vite build using the Cloudflare adapter
 
 - `pnpm check` is the typecheck for the SvelteKit app.
 - `pnpm build` verifies the Cloudflare Workers output.
+- Production (cryptly.dev) is served by Vercel: `frontend/vercel.json` builds `apps/web` with `adapter-vercel` (selected when `VERCEL=1`).
+- Public env is inlined at build time; production values live in `apps/web/.env.production`.
 
 ### Backend SDK (`packages/backend-sdk/`)
 

README.md

@@ -30,7 +30,7 @@
 - **👥 Team collaboration** - Share encrypted secrets with team members via secure invitations
 - **📝 Version history** - Track all changes to your secrets with full version control
 - **🔄 GitHub integration** - Sync secrets directly to your GitHub repositories
-- **🎨 Modern UI** - Responsive SvelteKit app in `apps/web` (Cloudflare Workers); legacy React UI remains in `frontend/` until post-cutover retirement
+- **🎨 Modern UI** - Responsive SvelteKit app in `apps/web`, served on cryptly.dev by Vercel via `frontend/vercel.json`; legacy React UI source remains in `frontend/` until post-cutover retirement
 - **🚀 Real-time updates** - See changes instantly with SSE support
 - **🔑 Multiple auth ooptions** - Login with Google, GitHub, or local development mode
 - **📦 Project organization** - Organize secrets by projects for better management

apps/web/.env.production

@@ -0,0 +1,7 @@
+# Production values, inlined into the build. Public values only: everything here ships to the browser.
+PUBLIC_APP_URL=https://cryptly.dev
+PUBLIC_API_URL=https://api.cryptly.dev
+PUBLIC_GOOGLE_CLIENT_ID=456428460773-39vislc8t7omv2h9klmelsklg0497afm.apps.googleusercontent.com
+PUBLIC_GITHUB_CLIENT_ID=Ov23li1XSEkV94LTAO3N
+PUBLIC_ALLOW_LOCAL_LOGIN=false
+PUBLIC_GITHUB_LOCAL_MOCK=false

apps/web/package.json

@@ -40,6 +40,7 @@
     "@eslint/js": "^9.33.0",
     "@playwright/test": "^1.59.1",
     "@sveltejs/adapter-cloudflare": "^7.0.3",
+    "@sveltejs/adapter-vercel": "^6.3.4",
     "@sveltejs/kit": "^2.39.1",
     "@sveltejs/vite-plugin-svelte": "^6.1.3",
     "@tailwindcss/vite": "^4.1.13",

apps/web/src/lib/shared/env/public-env.ts

@@ -1,6 +1,10 @@
-import { env } from "$env/dynamic/public";
+import * as staticEnv from "$env/static/public";
 import { dev } from "$app/environment";
 
+// Inlined at build time (prod builds read apps/web/.env.production), so it works on any host
+// without runtime env vars. Namespace import: unset vars stay undefined and fall back below.
+const env: Partial<Record<string, string>> = staticEnv;
+
 export interface PublicEnv {
   appUrl: string;
   apiUrl: string;

apps/web/svelte.config.js

@@ -1,10 +1,12 @@
-import adapter from "@sveltejs/adapter-cloudflare";
+import adapterCloudflare from "@sveltejs/adapter-cloudflare";
+import adapterVercel from "@sveltejs/adapter-vercel";
 import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
 
 const config = {
   preprocess: vitePreprocess(),
   kit: {
-    adapter: adapter(),
+    // Production (cryptly.dev) is built by Vercel via frontend/vercel.json; Vercel sets VERCEL=1.
+    adapter: process.env.VERCEL ? adapterVercel() : adapterCloudflare(),
     env: {
       publicPrefix: "PUBLIC_",
     },

apps/web/wrangler.jsonc

@@ -17,12 +17,4 @@
     "pattern": "cryptly.dev/*",
     "zone_name": "cryptly.dev",
   },
-  "vars": {
-    "PUBLIC_APP_URL": "https://cryptly.dev",
-    "PUBLIC_API_URL": "https://api.cryptly.dev",
-    "PUBLIC_GOOGLE_CLIENT_ID": "456428460773-39vislc8t7omv2h9klmelsklg0497afm.apps.googleusercontent.com",
-    "PUBLIC_GITHUB_CLIENT_ID": "Ov23li1XSEkV94LTAO3N",
-    "PUBLIC_ALLOW_LOCAL_LOGIN": "false",
-    "PUBLIC_GITHUB_LOCAL_MOCK": "false",
-  },
 }

docs/web-app-cutover-runbook.md

@@ -1,6 +1,6 @@
 # Web app cutover and rollback (SvelteKit vs legacy React)
 
-Production **`WEB_APP_URL`** (backend `EnvConfigs`) is used when the API builds links such as the CLI browser approval URL (`/app/cli-authorize?session=…`). The browser app itself is deployed separately (e.g. Cloudflare Workers for `apps/web`).
+Production **`WEB_APP_URL`** (backend `EnvConfigs`) is used when the API builds links such as the CLI browser approval URL (`/app/cli-authorize?session=…`). The browser app itself is deployed separately: Vercel serves `cryptly.dev` from the Vercel project rooted at `frontend/`, and `frontend/vercel.json` overrides its build to ship `apps/web` (`adapter-vercel`, picked when `VERCEL=1`). Production public env comes from `apps/web/.env.production`, inlined at build time.
 
 ## Flip order (big-bang)
 
@@ -11,7 +11,7 @@ Production **`WEB_APP_URL`** (backend `EnvConfigs`) is used when the API builds
 
 ## Rollback
 
-- **Web:** redeploy or repoint DNS/hosting to the **last known good** static Worker or asset bundle. Keep a **tag or artifact** for the legacy React app until `frontend/` is removed from the repo.
+- **Web:** revert `frontend/vercel.json` to the SPA rewrite (no `buildCommand`) so Vercel builds the React app again. Keep a **tag or artifact** for the legacy React app until `frontend/` is removed from the repo.
 - **Backend:** if `WEB_APP_URL` was changed for the cutover, revert it so CLI approval links and any server-built URLs match the app users actually open.
 - **CLI:** users mid-approval may need a fresh `cryptly login` if sessions expire during the switch.
 

frontend/vercel.json

@@ -1,8 +1,4 @@
 {
-  "rewrites": [
-    {
-      "source": "/(.*)",
-      "destination": "/index.html"
-    }
-  ]
+  "$schema": "https://openapi.vercel.sh/vercel.json",
+  "buildCommand": "pnpm --filter web build && rm -rf .vercel/output && mkdir -p .vercel && mv ../apps/web/.vercel/output .vercel/output"
 }