@nebulr-group/bridge-svelte 0.9.1-beta.1 → 0.9.1-beta.2

package/dist/client/BridgeBootstrap.js

@@ -7,6 +7,7 @@ import { dropFlagCache, guardCacheGeneration } from '../auth/guard-cache.js';
 import { getBridgeAuth, bridgeReadyStore, markReady, waitForBridge as _waitForBridge, } from '../core/bridge-instance.js';
 import { installBridgeAuthFetch } from '../core/bridge-runtime.js';
 import { refreshBilling, tokenStaleHandlerOf } from '../core/billing-store.js';
+import { prefetchFlagDefinitions } from '../core/flag-definitions.js';
 import { useBridge, sanitizeReturnTo, stashReturnTo, takeReturnTo, withReturnTo, } from '@nebulr-group/bridge-auth-core';
 import { logger } from '../shared/logger.js';
 import { bridgeConfig, getConfig, getRouteGuardConfig } from './stores/config.store.js';
@@ -199,8 +200,21 @@ async function waitForConfigured() {
             clearTimeout(timer);
     }
 }
-/** Longest the first render waits for the plan's features before showing anyway. */
-const ENTITLEMENTS_FIRST_RENDER_WAIT_MS = 1500;
+/** Longest the first render waits for a startup read before showing anyway. */
+const FIRST_RENDER_WAIT_MS = 1500;
+/** Wait for `work`, but never longer than the first-render cap. Never rejects. */
+async function withinFirstRenderWait(work) {
+    let timer;
+    const timeout = new Promise((resolve) => {
+        timer = setTimeout(resolve, FIRST_RENDER_WAIT_MS);
+    });
+    try {
+        await Promise.race([work.catch(() => undefined), timeout]);
+    }
+    finally {
+        clearTimeout(timer);
+    }
+}
 // TBP-810 — flag rules on `bridge:billing.entitlement.*` read auth-core's
 // entitlements store. Nothing ever configured it, so it could not load itself
 // and only filled from `/session/init` on the first realtime connect, about a
@@ -217,29 +231,41 @@ async function loadEntitlementsBeforeFirstRender(bridge) {
         }, logger);
         if (store.isHydrated())
             return;
-        let timer;
-        const timeout = new Promise((resolve) => {
-            timer = setTimeout(resolve, ENTITLEMENTS_FIRST_RENDER_WAIT_MS);
-        });
-        try {
-            await Promise.race([store.hydrate(), timeout]);
-        }
-        finally {
-            clearTimeout(timer);
-        }
+        await withinFirstRenderWait(store.hydrate());
     }
     catch (err) {
         logger.debug('[bridgeBootstrap] entitlements not loaded before first render:', err);
     }
 }
+// TBP-810 — `<FeatureFlag>` / `useFlag()` evaluate the flag definitions, which
+// the flags bundle used to fetch only once the page was showing: every gated
+// tile rendered its fallback first. Start the read now (it needs no sign-in);
+// `createBridgeFlags()` takes the result instead of fetching again.
+function startFlagDefinitions() {
+    try {
+        const cfg = getConfig();
+        if (!cfg.appId)
+            return Promise.resolve();
+        return prefetchFlagDefinitions(cfg.apiBaseUrl ?? 'https://api.thebridge.dev', cfg.appId);
+    }
+    catch {
+        return Promise.resolve();
+    }
+}
 // Once per page load. Concurrent callers share the same promise, so a first
 // navigation that redirects mid-bootstrap does not start a second refresh or
 // flag load. Never rejects: every step is best-effort by design — none of them
 // decides authorization, which is enforceRouteGuard's job alone.
+//
+// TBP-810 — every startup read runs at the same time, and the first render
+// waits for the ones the page's gates read (billing state, the plan's
+// features, the flag definitions), each capped. One slow read no longer holds
+// up the others.
 function ensureInitialised() {
     if (_initialisation)
         return _initialisation;
     _initialisation = (async () => {
+        const definitions = startFlagDefinitions();
         // Ensure tokens are fresh if needed
         try {
             const bridge = getBridgeAuth();
@@ -250,29 +276,6 @@ function ensureInitialised() {
         catch {
             // Non-fatal — stale tokens will be caught by route guard
         }
-        // Auto-manage billing state so the notice/gate render without the
-        // integrator wiring a mount, and `hard` billing route rules can decide.
-        // The plan's features load alongside it (same round-trip time, so the
-        // page waits no longer).
-        try {
-            const bridge = getBridgeAuth();
-            const ctx = bridge.getApiContext();
-            if (ctx.accessToken) {
-                await Promise.all([
-                    useBridge().subscription.mount({
-                        apiBaseUrl: ctx.apiBaseUrl,
-                        accessToken: ctx.accessToken,
-                        appId: ctx.appId,
-                        // TBP-762 — renew an out-of-date sign-in and retry instead of failing.
-                        onTokenStale: tokenStaleHandlerOf(bridge),
-                    }),
-                    loadEntitlementsBeforeFirstRender(bridge),
-                ]);
-            }
-        }
-        catch {
-            // Non-fatal — the notice hydrates lazily on first render.
-        }
         // Warm the route-guard's flag cache without awaiting so GQL queries can
         // start in parallel. `loadFeatureFlags()` populates the same auth-core
         // FeatureFlagService the route guard evaluates `featureFlag` rules
@@ -291,6 +294,31 @@ function ensureInitialised() {
             .catch((err) => {
             logger.warn('[bridgeBootstrap] Feature flags failed to load:', err);
         });
+        // Auto-manage billing state so the notice/gate render without the
+        // integrator wiring a mount, and `hard` billing route rules can decide.
+        // The plan's features and the flag definitions load alongside it.
+        const reads = [withinFirstRenderWait(definitions)];
+        try {
+            const bridge = getBridgeAuth();
+            const ctx = bridge.getApiContext();
+            if (ctx.accessToken) {
+                reads.push(useBridge()
+                    .subscription.mount({
+                    apiBaseUrl: ctx.apiBaseUrl,
+                    accessToken: ctx.accessToken,
+                    appId: ctx.appId,
+                    // TBP-762 — renew an out-of-date sign-in and retry instead of failing.
+                    onTokenStale: tokenStaleHandlerOf(bridge),
+                })
+                    .catch(() => {
+                    // Non-fatal — the notice hydrates lazily on first render.
+                }), loadEntitlementsBeforeFirstRender(bridge));
+            }
+        }
+        catch {
+            // Non-fatal — the notice hydrates lazily on first render.
+        }
+        await Promise.all(reads);
         return { flagsReady };
     })();
     return _initialisation;

package/dist/core/flag-definitions.d.ts

@@ -0,0 +1,15 @@
+/** Where the definitions for an app live. */
+export declare function flagDefinitionsUrl(apiBaseUrl: string, appKey: string): string;
+/**
+ * Start reading the definitions. Concurrent callers share one request.
+ * Resolves to the list, or `null` when the read failed. Never rejects.
+ */
+export declare function prefetchFlagDefinitions(apiBaseUrl: string, appKey: string): Promise<unknown[] | null>;
+/**
+ * The prefetched definitions for this app, if they have arrived. One-shot: a
+ * later caller (a remount, a reconnect) fetches fresh ones instead of reusing
+ * what may be stale by then.
+ */
+export declare function takePrefetchedFlagDefinitions(apiBaseUrl: string, appKey: string): unknown[] | null;
+/** Test-only. */
+export declare function __resetFlagDefinitionsForTests(): void;

package/dist/core/flag-definitions.js

@@ -0,0 +1,66 @@
+// TBP-810 — the flag definitions `<FeatureFlag>` / `useFlag()` evaluate.
+//
+// The flags bundle used to fetch them only once the page was already showing,
+// so every `<FeatureFlag>` rendered its fallback (a padlock) for a moment on
+// each full page load. The root `load` now starts this read at the same time
+// as the sign-in and billing reads and waits for it before the first render;
+// `createBridgeFlags()` then takes the result instead of fetching again.
+//
+// Plain TS with no flags imports, so the core bootstrap can use it without
+// pulling the flags bundle into auth-only apps.
+let _url = null;
+let _promise = null;
+let _result = null;
+/** Where the definitions for an app live. */
+export function flagDefinitionsUrl(apiBaseUrl, appKey) {
+    return `${apiBaseUrl.replace(/\/+$/, '')}/admin/flags-internal/flags-cache/${encodeURIComponent(appKey)}`;
+}
+/**
+ * Start reading the definitions. Concurrent callers share one request.
+ * Resolves to the list, or `null` when the read failed. Never rejects.
+ */
+export function prefetchFlagDefinitions(apiBaseUrl, appKey) {
+    const url = flagDefinitionsUrl(apiBaseUrl, appKey);
+    if (_promise && _url === url)
+        return _promise;
+    _url = url;
+    _result = null;
+    const promise = (async () => {
+        try {
+            const res = await fetch(url);
+            if (!res.ok)
+                return null;
+            const body = (await res.json());
+            return Array.isArray(body) ? body : null;
+        }
+        catch {
+            return null;
+        }
+    })().then((list) => {
+        if (_promise === promise)
+            _result = list;
+        return list;
+    });
+    _promise = promise;
+    return promise;
+}
+/**
+ * The prefetched definitions for this app, if they have arrived. One-shot: a
+ * later caller (a remount, a reconnect) fetches fresh ones instead of reusing
+ * what may be stale by then.
+ */
+export function takePrefetchedFlagDefinitions(apiBaseUrl, appKey) {
+    if (_url !== flagDefinitionsUrl(apiBaseUrl, appKey) || !_result)
+        return null;
+    const list = _result;
+    _url = null;
+    _promise = null;
+    _result = null;
+    return list;
+}
+/** Test-only. */
+export function __resetFlagDefinitionsForTests() {
+    _url = null;
+    _promise = null;
+    _result = null;
+}

package/dist/flags/bootstrap.js

@@ -20,6 +20,7 @@ import { _getDevAttributeProvider } from '../core/bridge.js';
 import { tokenStaleHandlerOf } from '../core/billing-store.js';
 import { getBridgeRealtime, onBridgeRealtimeOpen, } from '../core/bridge-runtime.js';
 import { getConfig } from '../client/stores/config.store.js';
+import { takePrefetchedFlagDefinitions } from '../core/flag-definitions.js';
 /** A storage implementation that uses `localStorage` (persistent) or `sessionStorage` (per-tab). */
 export class BrowserIdentityStorage {
     mode;
@@ -220,8 +221,17 @@ export function createBridgeFlags(config = {}) {
         void hydrateFlagsCache();
     });
     // Initial hydrate fires here too — covers the case where realtime is
-    // disabled and onOpen never fires.
-    void hydrateFlagsCache();
+    // disabled and onOpen never fires. TBP-810 — the root `load` already read
+    // the definitions before the first render; use them so the first
+    // `<FeatureFlag>` evaluates against real rules instead of rendering its
+    // fallback until this fetch lands.
+    const prefetched = takePrefetchedFlagDefinitions(resolvedApiBaseUrl, resolvedApiKey);
+    if (prefetched && prefetched.length > 0) {
+        bridge.hydrate(prefetched);
+    }
+    else {
+        void hydrateFlagsCache();
+    }
     if (config.registerGlobal !== false) {
         setBridgeFlagsInstance(bridge);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nebulr-group/bridge-svelte",
-  "version": "0.9.1-beta.1",
+  "version": "0.9.1-beta.2",
   "description": "The Bridge for SvelteKit: sign-in, workspaces and roles, feature flags, Stripe subscriptions and plan limits in one .env line and three files.",
   "author": "Iman Pouya",
   "license": "MIT",