@omg-dev/sdk 0.4.25 → 0.4.27

package/dist/{OmgBadge-LAcimQp0.mjs → OmgBadge-CDnTIlnn.mjs}

@@ -1,5 +1,5 @@
 import { t as VibesFeedback } from "./VibesFeedback-BF2Vf6FK.mjs";
-import { useId, useState } from "react";
+import { useEffect, useId, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/brand/OmgBadge.tsx
 const BRAND = "#FF5530";
@@ -15,6 +15,7 @@ function feedbackBundled() {
 }
 const DISMISS_KEY = "vibes-remix:dismissed";
 const REMIX_ORIGIN = typeof import.meta !== "undefined" && import.meta.env?.VITE_REMIX_ORIGIN || "https://omg.dev";
+const CONTROLPLANE_URL = (typeof import.meta !== "undefined" && import.meta.env?.VITE_CONTROLPLANE_URL || "https://backend.omg.dev").replace(/\/$/, "");
 function appSlug() {
 	if (typeof import.meta === "undefined") return null;
 	const slug = import.meta.env?.VITE_APP_SLUG?.trim();
@@ -33,13 +34,38 @@ function setDismissedFlag() {
 		localStorage.setItem(DISMISS_KEY, "1");
 	} catch {}
 }
+/** Live check: only Explore-listed public apps may show "Make it mine". Fail closed. */
+async function fetchRemixable(slug) {
+	try {
+		const res = await fetch(`${CONTROLPLANE_URL}/api/projects/isRemixable`, {
+			method: "POST",
+			headers: { "content-type": "application/json" },
+			body: JSON.stringify({ slug }),
+			cache: "no-store"
+		});
+		if (!res.ok) return false;
+		return (await res.json())?.remixable === true;
+	} catch {
+		return false;
+	}
+}
 function OmgBadge({ href = "https://omg.dev", label = "What is omg?" }) {
 	const [open, setOpen] = useState(false);
 	const slug = appSlug();
-	const [remix, setRemix] = useState(() => slug !== null && !isDismissed());
+	const [remix, setRemix] = useState(false);
 	const titleId = useId();
 	const descriptionId = useId();
 	const markId = useId().replace(/[^a-zA-Z0-9_-]/g, "");
+	useEffect(() => {
+		if (!slug || isDismissed()) return;
+		let cancelled = false;
+		fetchRemixable(slug).then((ok) => {
+			if (!cancelled && ok && !isDismissed()) setRemix(true);
+		});
+		return () => {
+			cancelled = true;
+		};
+	}, [slug]);
 	function dismissRemix() {
 		setDismissedFlag();
 		setRemix(false);

package/dist/brand/auto.mjs

@@ -1,4 +1,4 @@
-import { t as OmgBadge } from "../OmgBadge-LAcimQp0.mjs";
+import { t as OmgBadge } from "../OmgBadge-CDnTIlnn.mjs";
 import { jsx } from "react/jsx-runtime";
 import { createRoot } from "react-dom/client";
 //#region src/brand/auto.tsx

package/dist/index.mjs

@@ -1,5 +1,5 @@
 import { a as installTrace, c as requestMotionPermission, d as getAuthContext, f as notifyAuthRequired, h as subscribeAuthRequired, i as getTrace, l as useFeedbackGesture, m as subscribeAuthChange, n as captureScreenshot, o as attachGestureListeners, p as setAuthContext, r as clearTrace, s as motionPermissionState, t as VibesFeedback, u as useUpload } from "./VibesFeedback-BF2Vf6FK.mjs";
-import { t as OmgBadge } from "./OmgBadge-LAcimQp0.mjs";
+import { t as OmgBadge } from "./OmgBadge-CDnTIlnn.mjs";
 import { createContext, useCallback, useContext, useEffect, useId, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { fetchEventSource } from "@microsoft/fetch-event-source";
 import { createAuthClient } from "better-auth/react";
@@ -7,6 +7,37 @@ import { passkeyClient } from "@better-auth/passkey/client";
 import { emailOTPClient, magicLinkClient } from "better-auth/client/plugins";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/auth/client.ts
+/**
+* Recover the user carried by a slug-scoped JWT.
+*
+* Gated `*.omgs.app` deploys receive their identity through the edge's
+* `omg_access` token exchange, not through an app-local Better Auth session.
+* The exchanged JWT is signed and verified by the server before it can be
+* used for data access; decoding it here only lets the React provider expose
+* that already-authenticated identity to `useUser()` and auth guards.
+*/
+function userFromToken(token) {
+	if (!token) return null;
+	try {
+		const payload = token.split(".")[1];
+		if (!payload) return null;
+		const base64 = payload.replace(/-/g, "+").replace(/_/g, "/");
+		const padded = base64 + "=".repeat((4 - base64.length % 4) % 4);
+		const claims = JSON.parse(atob(padded));
+		if (typeof claims.sub !== "string" || typeof claims.email !== "string") return null;
+		return {
+			id: claims.sub,
+			email: claims.email,
+			...typeof claims.name === "string" && claims.name ? { name: claims.name } : {}
+		};
+	} catch {
+		return null;
+	}
+}
+/** Prefer an explicit app session, then fall back to the edge-owned identity. */
+function resolveAuthUser(sessionUser, tokenUser) {
+	return sessionUser ?? tokenUser;
+}
 const DEFAULT_AUTH_URL = "https://auth.omg.dev";
 const AUTH_BRIDGE_PREFIX = "/__vibes/auth";
 /**
@@ -454,19 +485,21 @@ function VibesAuthProvider({ client: providedClient, appId, authUrl, autoPrompt
 	]);
 	const { data: session, isPending } = client.authClient.useSession();
 	const [token, setToken] = useState(null);
+	const [tokenUser, setTokenUser] = useState(null);
 	const [authReady, setAuthReady] = useState(false);
+	const user = resolveAuthUser(session?.user ? {
+		id: session.user.id,
+		email: session.user.email,
+		name: session.user.name ?? void 0
+	} : null, tokenUser);
 	useEffect(() => {
 		if (isPending) return;
-		if (!session?.user) {
-			setToken(null);
-			client.clearToken();
-			setAuthReady(true);
-			return;
-		}
+		setAuthReady(false);
 		let cancelled = false;
 		client.getToken().then((t) => {
 			if (cancelled) return;
 			setToken(t);
+			setTokenUser(userFromToken(t));
 			setAuthReady(true);
 		});
 		return () => {
@@ -479,18 +512,14 @@ function VibesAuthProvider({ client: providedClient, appId, authUrl, autoPrompt
 	]);
 	useEffect(() => {
 		setAuthContext({
-			user: session?.user ? {
-				id: session.user.id,
-				email: session.user.email,
-				name: session.user.name ?? void 0
-			} : null,
+			user,
 			token,
 			authReady
 		});
 	}, [
-		session?.user?.id,
-		session?.user?.email,
-		session?.user?.name,
+		user?.id,
+		user?.email,
+		user?.name,
 		token,
 		authReady
 	]);
@@ -498,27 +527,27 @@ function VibesAuthProvider({ client: providedClient, appId, authUrl, autoPrompt
 		await client.authClient.signOut();
 		client.clearToken();
 		setToken(null);
+		setTokenUser(null);
 	}, [client]);
 	const refreshToken = useCallback(async () => {
 		const t = await client.getToken();
 		setToken(t);
+		setTokenUser(userFromToken(t));
 		return t;
 	}, [client]);
-	const user = session?.user ? {
-		id: session.user.id,
-		email: session.user.email,
-		name: session.user.name ?? void 0
-	} : null;
+	const loading = isPending || !authReady;
 	const value = useMemo(() => ({
 		user,
-		loading: isPending,
+		loading,
 		token,
 		signOut,
 		refreshToken,
 		client
 	}), [
 		user?.id,
-		isPending,
+		user?.email,
+		user?.name,
+		loading,
 		token,
 		signOut,
 		refreshToken,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@omg-dev/sdk",
-  "version": "0.4.25",
+  "version": "0.4.27",
   "type": "module",
   "exports": {
     ".": {

package/src/auth/client.ts

@@ -10,6 +10,48 @@ export interface VibesUser {
   name?: string
 }
 
+/**
+ * Recover the user carried by a slug-scoped JWT.
+ *
+ * Gated `*.omgs.app` deploys receive their identity through the edge's
+ * `omg_access` token exchange, not through an app-local Better Auth session.
+ * The exchanged JWT is signed and verified by the server before it can be
+ * used for data access; decoding it here only lets the React provider expose
+ * that already-authenticated identity to `useUser()` and auth guards.
+ */
+export function userFromToken(token: string | null): VibesUser | null {
+  if (!token) return null
+  try {
+    const payload = token.split(".")[1]
+    if (!payload) return null
+    const base64 = payload.replace(/-/g, "+").replace(/_/g, "/")
+    const padded = base64 + "=".repeat((4 - (base64.length % 4)) % 4)
+    const claims = JSON.parse(atob(padded)) as {
+      sub?: unknown
+      email?: unknown
+      name?: unknown
+    }
+    if (typeof claims.sub !== "string" || typeof claims.email !== "string") {
+      return null
+    }
+    return {
+      id: claims.sub,
+      email: claims.email,
+      ...(typeof claims.name === "string" && claims.name ? { name: claims.name } : {}),
+    }
+  } catch {
+    return null
+  }
+}
+
+/** Prefer an explicit app session, then fall back to the edge-owned identity. */
+export function resolveAuthUser(
+  sessionUser: VibesUser | null,
+  tokenUser: VibesUser | null,
+): VibesUser | null {
+  return sessionUser ?? tokenUser
+}
+
 export interface VibesAuthConfig {
   /** App ID registered with the auth service */
   appId: string

package/src/auth/react.tsx

@@ -2,7 +2,7 @@
 
 import { createContext, useContext, useEffect, useState, useCallback, useMemo, type ReactNode } from "react"
 import type { VibesAuthClient, VibesUser } from "./client"
-import { createVibesAuth, deriveAppId } from "./client"
+import { createVibesAuth, deriveAppId, resolveAuthUser, userFromToken } from "./client"
 import { setAuthContext } from "./bridge"
 import { VibesAuthAutoPrompt } from "./auto-prompt"
 
@@ -53,27 +53,34 @@ export function VibesAuthProvider({
 
   const { data: session, isPending } = client.authClient.useSession()
   const [token, setToken] = useState<string | null>(null)
+  const [tokenUser, setTokenUser] = useState<VibesUser | null>(null)
   // True once the session check + first getToken() attempt have settled. Data
   // hooks read this (via the bridge) to tell a transient startup
   // `auth_required` apart from a genuinely signed-out user.
   const [authReady, setAuthReady] = useState(false)
-
-  // Fetch JWT when session becomes available. Gate on isPending so we don't
-  // mark auth "ready" (or clear the token) while the session is still
-  // resolving — that window is exactly when the token race surfaced a scary
-  // error before.
+  const sessionUser: VibesUser | null = session?.user
+    ? {
+        id: session.user.id,
+        email: session.user.email,
+        name: session.user.name ?? undefined,
+      }
+    : null
+  // One identity owner: a local Better Auth session when the app explicitly
+  // signed the visitor in, otherwise the edge-exchanged OMG identity.
+  const user = resolveAuthUser(sessionUser, tokenUser)
+
+  // Resolve the slug JWT after the local session check settles. This request
+  // is intentionally unconditional: gated omgs.app deploys authenticate at
+  // the edge and exchange their first-party `omg_access` cookie for this JWT,
+  // so they do not (and should not) need a second app-local auth session.
   useEffect(() => {
     if (isPending) return
-    if (!session?.user) {
-      setToken(null)
-      client.clearToken()
-      setAuthReady(true)
-      return
-    }
+    setAuthReady(false)
     let cancelled = false
     client.getToken().then((t) => {
       if (cancelled) return
       setToken(t)
+      setTokenUser(userFromToken(t))
       setAuthReady(true)
     })
     return () => {
@@ -85,41 +92,31 @@ export function VibesAuthProvider({
   // doesn't take a client prop) can attach Authorization on every fetch.
   useEffect(() => {
     setAuthContext({
-      user: session?.user
-        ? {
-            id: session.user.id,
-            email: session.user.email,
-            name: session.user.name ?? undefined,
-          }
-        : null,
+      user,
       token,
       authReady,
     })
-  }, [session?.user?.id, session?.user?.email, session?.user?.name, token, authReady])
+  }, [user?.id, user?.email, user?.name, token, authReady])
 
   const signOut = useCallback(async () => {
     await client.authClient.signOut()
     client.clearToken()
     setToken(null)
+    setTokenUser(null)
   }, [client])
 
   const refreshToken = useCallback(async () => {
     const t = await client.getToken()
     setToken(t)
+    setTokenUser(userFromToken(t))
     return t
   }, [client])
 
-  const user: VibesUser | null = session?.user
-    ? {
-        id: session.user.id,
-        email: session.user.email,
-        name: session.user.name ?? undefined,
-      }
-    : null
+  const loading = isPending || !authReady
 
   const value = useMemo<VibesAuthContextValue>(
-    () => ({ user, loading: isPending, token, signOut, refreshToken, client }),
-    [user?.id, isPending, token, signOut, refreshToken, client]
+    () => ({ user, loading, token, signOut, refreshToken, client }),
+    [user?.id, user?.email, user?.name, loading, token, signOut, refreshToken, client]
   )
 
   return (

package/src/brand/OmgBadge.tsx

@@ -1,4 +1,4 @@
-import { useId, useState, type CSSProperties } from "react"
+import { useEffect, useId, useState, type CSSProperties } from "react"
 import { VibesFeedback } from "../feedback/VibesFeedback"
 
 export interface OmgBadgeProps {
@@ -32,15 +32,23 @@ function feedbackBundled(): boolean {
 }
 
 // ── Remix ("Make it mine") gating ────────────────────────────────────────────
-// The badge's first job on a PUBLISHED app is the recipient→creator hinge: a
-// visitor who only has the shared link can fork the app back on omg.dev. Once
-// they dismiss that, the SAME badge collapses to plain branding — the omg mark
-// never leaves, only the call-to-action does.
+// The badge's first job on a PUBLIC Explore-listed app is the recipient→creator
+// hinge: a visitor who only has the shared link can fork the app back on
+// omg.dev. Private (not listed) apps keep the plain branding badge only —
+// remixBySlug rejects them, so the CTA must never appear. Once dismissed, the
+// SAME badge collapses to branding — the omg mark never leaves, only the CTA.
 const DISMISS_KEY = "vibes-remix:dismissed"
 const REMIX_ORIGIN =
   (typeof import.meta !== "undefined" &&
     (import.meta as { env?: Record<string, string | undefined> }).env?.VITE_REMIX_ORIGIN) ||
   "https://omg.dev"
+// Control-plane host for the unauthenticated isRemixable probe. Overridable for
+// self-host; defaults to production. CORS is open for this path only (Caddy).
+const CONTROLPLANE_URL = (
+  (typeof import.meta !== "undefined" &&
+    (import.meta as { env?: Record<string, string | undefined> }).env?.VITE_CONTROLPLANE_URL) ||
+  "https://backend.omg.dev"
+).replace(/\/$/, "")
 
 function appSlug(): string | null {
   if (typeof import.meta === "undefined") return null
@@ -66,20 +74,49 @@ function setDismissedFlag() {
   }
 }
 
+/** Live check: only Explore-listed public apps may show "Make it mine". Fail closed. */
+async function fetchRemixable(slug: string): Promise<boolean> {
+  try {
+    const res = await fetch(`${CONTROLPLANE_URL}/api/projects/isRemixable`, {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify({ slug }),
+      // Public boolean; no credentials. Avoid caching a stale private→public flip.
+      cache: "no-store",
+    })
+    if (!res.ok) return false
+    const data = (await res.json()) as { remixable?: unknown }
+    return data?.remixable === true
+  } catch {
+    return false
+  }
+}
+
 export function OmgBadge({
   href = "https://omg.dev",
   label = "What is omg?",
 }: OmgBadgeProps) {
   const [open, setOpen] = useState(false)
-  // "Make it mine" shows only on a published app (slug baked in) that the
-  // visitor hasn't dismissed yet. Dismissing keeps the badge — it just drops to
-  // the branding state — so the omg mark stays put.
+  // Fail closed: start as branding. Promote to remix only after the public
+  // catalog confirms this slug is listed — never flash "Make it mine" on a
+  // private published app while the probe is in flight.
   const slug = appSlug()
-  const [remix, setRemix] = useState(() => slug !== null && !isDismissed())
+  const [remix, setRemix] = useState(false)
   const titleId = useId()
   const descriptionId = useId()
   const markId = useId().replace(/[^a-zA-Z0-9_-]/g, "")
 
+  useEffect(() => {
+    if (!slug || isDismissed()) return
+    let cancelled = false
+    void fetchRemixable(slug).then((ok) => {
+      if (!cancelled && ok && !isDismissed()) setRemix(true)
+    })
+    return () => {
+      cancelled = true
+    }
+  }, [slug])
+
   function dismissRemix() {
     setDismissedFlag()
     setRemix(false)

package/src/brand/auto.tsx

@@ -5,10 +5,11 @@
 // generated app to carry attribution code in its source.
 //
 // One control, not three: this badge is the "Make it mine" remix CTA on a fresh
-// visit (same omg mark), collapses to the plain branding badge on dismiss, and
-// bundles the (button-less) feedback sheet, summoned from its dialog. The
-// vite-plugin therefore skips the standalone feedback/auto + remix-cta imports
-// whenever this badge is enabled (the default).
+// visit to a PUBLIC (Explore-listed) app (same omg mark), collapses to the plain
+// branding badge on dismiss or when the app is private, and bundles the
+// (button-less) feedback sheet, summoned from its dialog. The vite-plugin
+// therefore skips the standalone feedback/auto + remix-cta imports whenever
+// this badge is enabled (the default).
 
 import { createRoot } from "react-dom/client"
 import { OmgBadge } from "./OmgBadge"