@viibestack/ui 0.6.3 → 0.6.5

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@viibestack/ui",
-  "version": "0.6.3",
-  "description": "Dependency-free React UI kit -- icons, core components (Button, Card, Input, Modal, etc.), a real per-app data client (listRows/upsertRow/deleteRow/captureClientError), and a real per-app end-user auth client (signUp/logIn/logOut/getCurrentUser/reportError) backed by ViibeStack's own platform-managed data store.",
+  "version": "0.6.5",
+  "description": "Dependency-free React UI kit -- icons, core components (Button, Card, Input, Modal, etc.), a real per-app data client (listRows/upsertRow/deleteRow/captureClientError), a real per-app end-user auth client (signUp/logIn/logOut/getCurrentUser/reportError), and a self-gating PoweredByBadge component -- backed by ViibeStack's own platform-managed data store.",
   "type": "module",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/auth.ts

@@ -171,6 +171,39 @@ export async function logOut(): Promise<void> {
   await callAppAuth("/logout", { method: "POST", body: JSON.stringify({ session_id: stored.sessionId }) });
 }
 
+// Single-flight guard for the refresh call below -- without this, calling
+// getCurrentUser() from more than one place on the same page load (a nav
+// component AND a page component each checking auth in their own
+// useEffect, a completely normal shape for a generated app) fires two
+// concurrent /session/refresh calls with the SAME still-stored session_id.
+// The auth service rotates that id on every refresh (see services/auth's
+// own comment on that route), so only the first of the two UPDATEs
+// actually matches a row -- the second gets back "session expired" even
+// though the first one just succeeded, and its `saveStoredSession(null)`
+// then wipes out the perfectly valid session the first call just saved,
+// logging a real signed-in user out. Confirmed as the root cause of a
+// real_accounts logout report (2026-07-19) -- funneling every concurrent
+// caller through the SAME in-flight promise means only one refresh request
+// is ever sent for a given expiring token, regardless of how many
+// components independently call getCurrentUser() at once. Does not cover
+// two separate browser TABS refreshing at once (each has its own module
+// state) -- that's a rarer trigger and would need cross-tab coordination
+// this fix doesn't attempt.
+let refreshInFlight: Promise<AppUser | null> | null = null;
+
+async function refreshCurrentSession(sessionId: string): Promise<AppUser | null> {
+  const result = await callAppAuth<SessionResponse>("/session/refresh", {
+    method: "POST",
+    body: JSON.stringify({ session_id: sessionId }),
+  });
+  if (!result.ok) {
+    saveStoredSession(null);
+    return null;
+  }
+  saveStoredSession(result.body);
+  return result.body.user;
+}
+
 // The one function generated app code is expected to call on every page
 // load to find out "is anyone logged in" -- returns null if there's no
 // session, or if the session has expired/been revoked server-side (in
@@ -183,16 +216,12 @@ export async function getCurrentUser(): Promise<AppUser | null> {
   const needsRefresh = exp == null || exp - Math.floor(Date.now() / 1000) < 120;
   if (!needsRefresh) return stored.user;
 
-  const result = await callAppAuth<SessionResponse>("/session/refresh", {
-    method: "POST",
-    body: JSON.stringify({ session_id: stored.sessionId }),
-  });
-  if (!result.ok) {
-    saveStoredSession(null);
-    return null;
+  if (!refreshInFlight) {
+    refreshInFlight = refreshCurrentSession(stored.sessionId).finally(() => {
+      refreshInFlight = null;
+    });
   }
-  saveStoredSession(result.body);
-  return result.body.user;
+  return refreshInFlight;
 }
 
 export async function requestPasswordReset(email: string): Promise<ActionResult> {

package/src/badge.tsx

@@ -0,0 +1,74 @@
+"use client";
+
+// Small fixed "Powered by ViibeStack" badge every generated app is required
+// to render once near its root layout (see integrationRequirements() item
+// 11 in services/deploy/src/mcp-agent.ts, and scratch-scaffold.ts's
+// layout.tsx template, which injects this automatically for from-scratch
+// builds). Self-gating: resolves this app's own tenant plan at runtime via
+// GET /api/apps/:id/badge-status and renders nothing once that tenant is
+// actively paying for a plan that waives the badge (Growing Business and
+// above) -- no build-time branching needed, so the same shipped code keeps
+// working correctly if a tenant upgrades/downgrades after the app was
+// already deployed.
+import { useEffect, useState } from "react";
+
+let showBadgePromise: Promise<boolean> | null = null;
+
+function resolveShowBadge(): Promise<boolean> {
+  if (!showBadgePromise) {
+    showBadgePromise = fetch(`${window.location.origin}/api/apps/resolve?hostname=${window.location.hostname}`)
+      .then((res) => (res.ok ? res.json() : null))
+      .then((data: { app_id?: string } | null) => {
+        if (!data?.app_id) return true;
+        return fetch(`${window.location.origin}/api/apps/${data.app_id}/badge-status`)
+          .then((res) => (res.ok ? res.json() : null))
+          .then((status: { show_badge?: boolean } | null) => status?.show_badge ?? true);
+      })
+      .catch(() => true);
+  }
+  return showBadgePromise;
+}
+
+export function PoweredByBadge() {
+  const [show, setShow] = useState(false);
+
+  useEffect(() => {
+    let cancelled = false;
+    resolveShowBadge().then((result) => {
+      if (!cancelled) setShow(result);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, []);
+
+  if (!show) return null;
+
+  return (
+    <a
+      href="https://viibestack.ai?utm_source=powered_by_badge"
+      target="_blank"
+      rel="noopener noreferrer"
+      style={{
+        position: "fixed",
+        bottom: "1rem",
+        right: "1rem",
+        zIndex: 9999,
+        display: "flex",
+        alignItems: "center",
+        gap: "0.375rem",
+        padding: "0.375rem 0.75rem",
+        borderRadius: "9999px",
+        backgroundColor: "rgba(17, 17, 17, 0.85)",
+        color: "#fff",
+        fontSize: "0.75rem",
+        fontFamily: "system-ui, -apple-system, sans-serif",
+        fontWeight: 500,
+        textDecoration: "none",
+        boxShadow: "0 2px 8px rgba(0, 0, 0, 0.2)",
+      }}
+    >
+      Powered by ViibeStack
+    </a>
+  );
+}

package/src/index.ts

@@ -3,3 +3,4 @@ export * from "./components";
 export * from "./nav";
 export * from "./data";
 export * from "./auth";
+export * from "./badge";