Ship account-aware v0-style Studio flow

.env.example

@@ -6,6 +6,15 @@ DROPS_GUEST_COOKIE_SECRET=
 # May equal DROPS_GUEST_COOKIE_SECRET during an MVP, but should be independently rotated in production.
 DROPS_ACCOUNT_COOKIE_SECRET=
 
+# Google OIDC profile sign-in. Register the exact callback
+# https://<studio-origin>/api/auth/google/callback in Google Cloud Console.
+GOOGLE_CLIENT_ID=
+GOOGLE_CLIENT_SECRET=
+
+# Independent 32+ byte AES-GCM key for encrypted account-scoped connection envelopes.
+# Never reuse a public capability secret and never expose this value to the browser.
+DROPS_CONNECTION_VAULT_KEY=
+
 # Stable 32+ byte HMAC secret for browser-held publish management capabilities.
 # Rotating it makes existing managed public links read-only in their original browsers.
 DROPS_PUBLISH_CAPABILITY_SECRET=

README.md

@@ -19,6 +19,8 @@ must not be used to restore an older editor layout.
 - 12 distinct standalone crypto product runtimes
 - platform-funded guest and signed-in member AI planning with explicit daily quotas and a deterministic no-key fallback compiler
 - OpenRouter PKCE sign-in with an HttpOnly Studio identity while the provider key remains session-only
+- Google OIDC profile sign-in with private project sync and opt-in encrypted,
+  account-scoped connection restoration; guests remain session-only
 - bounded design enhancement through OpenAI, Anthropic, OpenRouter Free, Kimi or a custom OpenAI-compatible model
 - universal Experience Director for every recipe: archetype, layout, data view,
   engagement loop, audience, primary loop and editable product modules

app/api/account/connections/route.ts

@@ -0,0 +1,117 @@
+import { NextRequest, NextResponse } from "next/server.js";
+
+import {
+  deleteStudioConnection,
+  saveStudioConnection,
+  StudioAccountStateUnavailableError,
+} from "@/db/studio-account-state";
+import {
+  resolveStudioAccount,
+  STUDIO_ACCOUNT_COOKIE,
+} from "@/lib/access-tier";
+import { consumeRequestLimit, requestIdentity } from "@/lib/request-rate-limit";
+import {
+  connectionVaultConfigured,
+  isStudioConnectionProvider,
+  publicConnectionStatuses,
+} from "@/lib/studio-account-state";
+
+export const dynamic = "force-dynamic";
+export const runtime = "nodejs";
+
+const MAX_BODY_BYTES = 40 * 1_024;
+
+function response(payload: unknown, status = 200) {
+  return NextResponse.json(payload, { status, headers: { "cache-control": "no-store" } });
+}
+
+function sameOrigin(request: NextRequest): boolean {
+  if (request.headers.get("sec-fetch-site")?.toLowerCase() === "cross-site") {
+    return false;
+  }
+  const origin = request.headers.get("origin");
+  if (!origin) return false;
+  try {
+    const host = request.headers.get("host")?.split(",")[0]?.trim();
+    const protocol =
+      request.headers.get("x-forwarded-proto")?.split(",")[0]?.trim().replace(/:$/, "")
+      || request.nextUrl.protocol.replace(/:$/, "");
+    const visibleOrigin = host ? `${protocol}://${host}` : request.nextUrl.origin;
+    const parsedOrigin = new URL(origin).origin;
+    return parsedOrigin === request.nextUrl.origin || parsedOrigin === visibleOrigin;
+  } catch {
+    return false;
+  }
+}
+
+async function body(request: NextRequest): Promise<Record<string, unknown> | null> {
+  const declared = Number(request.headers.get("content-length") ?? 0);
+  if (Number.isFinite(declared) && declared > MAX_BODY_BYTES) return null;
+  const raw = await request.text().catch(() => "");
+  if (new TextEncoder().encode(raw).byteLength > MAX_BODY_BYTES) return null;
+  try {
+    const parsed = JSON.parse(raw) as unknown;
+    return parsed && typeof parsed === "object" && !Array.isArray(parsed)
+      ? parsed as Record<string, unknown>
+      : null;
+  } catch {
+    return null;
+  }
+}
+
+function account(request: NextRequest) {
+  return resolveStudioAccount(request.cookies.get(STUDIO_ACCOUNT_COOKIE)?.value);
+}
+
+export async function PUT(request: NextRequest) {
+  const actor = account(request);
+  if (!actor) return response({ error: "Sign in to remember this connection." }, 401);
+  if (!sameOrigin(request)) return response({ error: "Cross-origin connection storage rejected." }, 403);
+  if (!connectionVaultConfigured()) return response({ error: "Encrypted connection vault is not configured." }, 503);
+  const limit = await consumeRequestLimit({
+    identity: requestIdentity(request),
+    namespace: "account-connection-write",
+    max: 20,
+    windowMs: 10 * 60 * 1_000,
+  }).catch(() => "unavailable" as const);
+  if (limit === "limited") return response({ error: "Too many connection changes. Try again later." }, 429);
+  if (limit === "unavailable" && process.env.NODE_ENV === "production") {
+    return response({ error: "Connection write protection is temporarily unavailable." }, 503);
+  }
+  const input = await body(request);
+  if (!input || !isStudioConnectionProvider(input.provider) || typeof input.credential !== "string") {
+    return response({ error: "Connection payload is invalid." }, 400);
+  }
+  try {
+    const state = await saveStudioConnection(actor.identity, {
+      provider: input.provider,
+      credential: input.credential,
+      ...(typeof input.model === "string" ? { model: input.model } : {}),
+      ...(typeof input.endpoint === "string" ? { endpoint: input.endpoint } : {}),
+      ...(typeof input.label === "string" ? { label: input.label } : {}),
+    });
+    return response({ saved: true, connections: publicConnectionStatuses(state) });
+  } catch (error) {
+    return response(
+      { error: error instanceof Error ? error.message : "Connection could not be stored." },
+      error instanceof StudioAccountStateUnavailableError ? 503 : 400,
+    );
+  }
+}
+
+export async function DELETE(request: NextRequest) {
+  const actor = account(request);
+  if (!actor) return response({ error: "Sign in to change remembered connections." }, 401);
+  if (!sameOrigin(request)) return response({ error: "Cross-origin connection storage rejected." }, 403);
+  const provider = request.nextUrl.searchParams.get("provider");
+  if (!isStudioConnectionProvider(provider)) return response({ error: "Connection provider is invalid." }, 400);
+  try {
+    const state = await deleteStudioConnection(actor.identity, provider);
+    return response({ deleted: true, connections: publicConnectionStatuses(state) });
+  } catch (error) {
+    return response(
+      { error: error instanceof Error ? error.message : "Connection could not be removed." },
+      error instanceof StudioAccountStateUnavailableError ? 503 : 400,
+    );
+  }
+}

app/api/account/route.ts

@@ -0,0 +1,56 @@
+import { NextRequest, NextResponse } from "next/server.js";
+
+import {
+  readStudioAccountState,
+  StudioAccountStateUnavailableError,
+} from "@/db/studio-account-state";
+import {
+  resolveStudioAccount,
+  STUDIO_ACCOUNT_COOKIE,
+} from "@/lib/access-tier";
+import {
+  connectionVaultConfigured,
+  publicConnectionStatuses,
+} from "@/lib/studio-account-state";
+
+export const dynamic = "force-dynamic";
+export const runtime = "nodejs";
+
+export async function GET(request: NextRequest) {
+  const account = resolveStudioAccount(request.cookies.get(STUDIO_ACCOUNT_COOKIE)?.value);
+  if (!account) {
+    return NextResponse.json(
+      { authenticated: false, profile: null, connections: [] },
+      { headers: { "cache-control": "no-store" } },
+    );
+  }
+  try {
+    const state = await readStudioAccountState(account.identity);
+    return NextResponse.json(
+      {
+        authenticated: true,
+        account: { provider: account.provider },
+        profile: state.profile ?? {
+          provider: account.provider,
+          name: account.provider === "google" ? "Google member" : "OpenRouter member",
+        },
+        connections: publicConnectionStatuses(state),
+        vault: { available: connectionVaultConfigured() },
+      },
+      { headers: { "cache-control": "no-store" } },
+    );
+  } catch (error) {
+    const unavailable = error instanceof StudioAccountStateUnavailableError;
+    return NextResponse.json(
+      {
+        authenticated: true,
+        account: { provider: account.provider },
+        profile: null,
+        connections: [],
+        vault: { available: false },
+        error: unavailable ? error.message : "Studio account state could not be read.",
+      },
+      { status: 503, headers: { "cache-control": "no-store" } },
+    );
+  }
+}

app/api/agent/plan/route.ts

@@ -26,6 +26,7 @@ import {
   RequestBodyBoundaryError,
 } from "../../../../lib/http-request-boundary.ts";
 import { secretFreeRuntimeMessage } from "../../../../lib/project-runtime-adapter.ts";
+import { readStudioConnectionSecret } from "../../../../db/studio-account-state.ts";
 
 export const runtime = "nodejs";
 
@@ -481,7 +482,11 @@ export async function POST(request: NextRequest) {
 
   const account = resolveStudioAccount(request.cookies.get(STUDIO_ACCOUNT_COOKIE)?.value);
 
-  const openRouterKey = requestCredential(request, "x-openrouter-key");
+  const rememberedProvider = body?.provider === "openrouter" && account
+    ? await readStudioConnectionSecret(account.identity, "openrouter").catch(() => null)
+    : null;
+  const openRouterKey = requestCredential(request, "x-openrouter-key")
+    || rememberedProvider?.credential;
   if (openRouterKey) {
     try {
       const model = body?.model?.trim() || "openrouter/free";
@@ -500,7 +505,11 @@ export async function POST(request: NextRequest) {
   }
 
   const directProvider = ["openai", "anthropic", "kimi"].includes(body?.provider ?? "") ? body?.provider as DirectProvider : null;
-  const directKey = requestCredential(request, "x-provider-key");
+  const rememberedDirect = directProvider && account
+    ? await readStudioConnectionSecret(account.identity, directProvider).catch(() => null)
+    : null;
+  const directKey = requestCredential(request, "x-provider-key")
+    || rememberedDirect?.credential;
   if (directProvider && !directKey) {
     return NextResponse.json({ error: `Connect ${directProvider} with an API key before using it.` }, { status: 400 });
   }

app/api/auth/google/callback/route.ts

@@ -0,0 +1,88 @@
+import { NextRequest, NextResponse } from "next/server.js";
+
+import { saveStudioAccountProfile } from "@/db/studio-account-state";
+import {
+  createStudioAccountCookie,
+  resolveAccountCookieSecret,
+  STUDIO_ACCOUNT_COOKIE,
+} from "@/lib/access-tier";
+import {
+  exchangeGoogleAuthorizationCode,
+  GOOGLE_OIDC_TRANSACTION_COOKIE,
+  readGoogleOidcTransaction,
+} from "@/lib/google-oidc";
+
+export const dynamic = "force-dynamic";
+export const runtime = "nodejs";
+
+function clearTransaction(response: NextResponse) {
+  response.cookies.set(GOOGLE_OIDC_TRANSACTION_COOKIE, "", {
+    httpOnly: true,
+    sameSite: "lax",
+    secure: process.env.NODE_ENV === "production",
+    expires: new Date(0),
+    path: "/api/auth/google",
+  });
+}
+
+function redirectError(request: NextRequest, code: string) {
+  const response = NextResponse.redirect(new URL(`/?auth=${encodeURIComponent(code)}`, request.nextUrl.origin));
+  clearTransaction(response);
+  return response;
+}
+
+export async function GET(request: NextRequest) {
+  const clientId = process.env.GOOGLE_CLIENT_ID?.trim() ?? "";
+  const clientSecret = process.env.GOOGLE_CLIENT_SECRET?.trim() ?? "";
+  const signingSecret = resolveAccountCookieSecret();
+  if (!clientId || !clientSecret || !signingSecret) return redirectError(request, "google-unavailable");
+  const transaction = readGoogleOidcTransaction(
+    request.cookies.get(GOOGLE_OIDC_TRANSACTION_COOKIE)?.value,
+    signingSecret,
+  );
+  const state = request.nextUrl.searchParams.get("state") ?? "";
+  const code = request.nextUrl.searchParams.get("code") ?? "";
+  if (!transaction || state !== transaction.state || !code || code.length > 4_096) {
+    return redirectError(request, "google-state-invalid");
+  }
+  try {
+    const identity = await exchangeGoogleAuthorizationCode({
+      code,
+      clientId,
+      clientSecret,
+      redirectUri: `${request.nextUrl.origin}/api/auth/google/callback`,
+      transaction,
+    });
+    const accountCookie = createStudioAccountCookie(
+      { provider: "google", subject: identity.subject },
+      signingSecret,
+    );
+    const account = await import("@/lib/access-tier").then(({ readStudioAccountCookie }) =>
+      readStudioAccountCookie(accountCookie, signingSecret),
+    );
+    if (!account) throw new Error("The signed Studio account could not be created.");
+    await saveStudioAccountProfile(account.identity, {
+      provider: "google",
+      subject: identity.subject,
+      name: identity.name,
+      ...(identity.email ? { email: identity.email } : {}),
+      ...(identity.picture ? { picture: identity.picture } : {}),
+    });
+    const returnTo = new URL(transaction.returnTo, request.nextUrl.origin);
+    returnTo.searchParams.set("auth", "google-connected");
+    const response = NextResponse.redirect(returnTo);
+    response.cookies.set(STUDIO_ACCOUNT_COOKIE, accountCookie, {
+      httpOnly: true,
+      sameSite: "lax",
+      secure: process.env.NODE_ENV === "production",
+      maxAge: 60 * 60 * 24 * 90,
+      path: "/",
+    });
+    clearTransaction(response);
+    response.headers.set("cache-control", "no-store");
+    return response;
+  } catch (error) {
+    console.error("[google-auth] callback failed", error instanceof Error ? error.message : "unknown");
+    return redirectError(request, "google-failed");
+  }
+}

app/api/auth/google/start/route.ts

@@ -0,0 +1,43 @@
+import { NextRequest, NextResponse } from "next/server.js";
+
+import { resolveAccountCookieSecret } from "@/lib/access-tier";
+import {
+  createGoogleOidcTransaction,
+  GOOGLE_OIDC_TRANSACTION_COOKIE,
+  GOOGLE_OIDC_TRANSACTION_TTL_SECONDS,
+  googleAuthorizationUrl,
+  serializeGoogleOidcTransaction,
+} from "@/lib/google-oidc";
+import { safeSameOriginReturnPath } from "@/lib/safe-return-to";
+
+export const dynamic = "force-dynamic";
+export const runtime = "nodejs";
+
+export async function GET(request: NextRequest) {
+  const clientId = process.env.GOOGLE_CLIENT_ID?.trim() ?? "";
+  const secret = resolveAccountCookieSecret();
+  if (!clientId || !secret) {
+    return NextResponse.redirect(new URL("/?auth=google-unavailable", request.nextUrl.origin));
+  }
+  const returnTo = safeSameOriginReturnPath(
+    request.nextUrl.searchParams.get("returnTo"),
+    request.nextUrl.origin,
+  );
+  const transaction = createGoogleOidcTransaction(returnTo, request.nextUrl.origin);
+  const redirectUri = `${request.nextUrl.origin}/api/auth/google/callback`;
+  const response = NextResponse.redirect(googleAuthorizationUrl({ clientId, redirectUri, transaction }));
+  response.cookies.set(
+    GOOGLE_OIDC_TRANSACTION_COOKIE,
+    serializeGoogleOidcTransaction(transaction, secret),
+    {
+      httpOnly: true,
+      sameSite: "lax",
+      secure: process.env.NODE_ENV === "production",
+      maxAge: GOOGLE_OIDC_TRANSACTION_TTL_SECONDS,
+      path: "/api/auth/google",
+    },
+  );
+  response.headers.set("cache-control", "no-store");
+  response.headers.set("referrer-policy", "no-referrer");
+  return response;
+}