@amplifyup/sdk 0.1.77 → 0.1.78

package/dist/react.mjs

@@ -1,5 +1,5 @@
 'use client';
-import React3, { createContext, memo, useState, useEffect, Fragment as Fragment$1, useContext, useRef, Component, useSyncExternalStore, useCallback } from 'react';
+import React3, { createContext, memo, useState, useEffect, Fragment as Fragment$1, useContext, useRef, Component, useCallback, useSyncExternalStore } from 'react';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import { marked } from 'marked';
 
@@ -166,6 +166,7 @@ var AWSAdapter = class {
       return;
     }
     const trackingId = eventData?.trackingId || this.config?.trackingId;
+    const debug = this.config?.debug;
     const query = trackingId ? `?tid=${encodeURIComponent(trackingId)}` : "";
     const url = `${this.apiGatewayUrl}${endpoint}${query}`;
     try {
@@ -180,15 +181,15 @@ var AWSAdapter = class {
         keepalive: true
       });
       if (!response.ok) {
-        if (this.config.debug) {
+        if (debug) {
           console.warn(`AmplifyUp SDK: Event tracking failed: ${response.status} ${response.statusText}`);
         }
-      } else if (this.config.debug) {
+      } else if (debug) {
         const result = await response.json().catch(() => ({}));
         console.log("AmplifyUp SDK: Event tracked", result);
       }
     } catch (error) {
-      if (this.config.debug) {
+      if (debug) {
         console.error("AmplifyUp SDK: Event tracking error:", error);
       }
     }
@@ -3951,6 +3952,14 @@ function getSDK(adapter) {
 var trackContentView = (contentId, contentType, properties) => getSDK().trackContentView(contentId, contentType, properties);
 var refreshEventTracking = () => getSDK().refreshEventTracking();
 getSDK();
+var PageContentRegistryContext = createContext(null);
+function useRegisterPageContent(enabled = true) {
+  const register = useContext(PageContentRegistryContext);
+  useEffect(() => {
+    if (!enabled || !register) return;
+    return register();
+  }, [enabled, register]);
+}
 function useInComposer(force = false) {
   const [detected, setDetected] = useState(false);
   useEffect(() => {
@@ -4189,6 +4198,7 @@ function AmplifyRendererInner({
   composerPreview
 }) {
   const clientHook = useAmplifyUp();
+  useRegisterPageContent(!serverPageConfig);
   const composerPreviewFlag = useComposerPreviewFlag(!!composerPreview);
   const pageConfig = serverPageConfig || clientHook.pageConfig || null;
   const loading = serverPageConfig ? false : clientHook.loading;
@@ -4703,6 +4713,7 @@ function AmplifyPageContent({
   errorComponent
 }) {
   const client = useAmplifyUp();
+  useRegisterPageContent();
   const preview = useComposerPreviewFlag(forceComposerPreview);
   const clientLayout = hasAmplifyLayout(client.pageConfig) ? client.pageConfig : null;
   const serverLayout = hasAmplifyLayout(pageConfigProp) ? pageConfigProp : null;
@@ -5599,11 +5610,24 @@ function AmplifyUpProvider({
     if (!initialized || !pageContext) return;
     getSDK().setPageContext(pageContext);
   }, [initialized, pageContextKey]);
+  const contentMountsRef = useRef(0);
+  const [hasPageContent, setHasPageContent] = useState(false);
+  const registerPageContent = useCallback(() => {
+    contentMountsRef.current += 1;
+    setHasPageContent(true);
+    return () => {
+      contentMountsRef.current -= 1;
+      if (contentMountsRef.current === 0) setHasPageContent(false);
+    };
+  }, []);
+  const [initVersion, setInitVersion] = useState(0);
+  const overlayEnabled = () => isComposerPreview() || config.clientPersonalization !== false;
   useEffect(() => {
     let cancelled = false;
     const sdk = getSDK();
-    const heldRoute = isComposerPreview() || config.clientPersonalization !== false ? getActualRoute() : null;
-    if (heldRoute) sdk.beginPageResolve(heldRoute);
+    if (contentMountsRef.current > 0 && overlayEnabled()) {
+      sdk.beginPageResolve(getActualRoute());
+    }
     const run = async () => {
       try {
         await sdk.init({
@@ -5613,20 +5637,59 @@ function AmplifyUpProvider({
         if (cancelled) return;
         if (pageContext) sdk.setPageContext(pageContext);
         const actualRoute = getActualRoute();
-        if (!actualRoute) {
+        if (actualRoute) sdk.routeChange(actualRoute);
+      } catch (err) {
+        if (cancelled) return;
+        console.error("Error initializing AmplifyUp SDK:", err);
+        setError(err instanceof Error ? err.message : "Unknown error");
+      } finally {
+        if (!cancelled) {
           setInitialized(true);
-          setLoading(false);
-          return;
+          setInitVersion((v) => v + 1);
         }
-        sdk.routeChange(actualRoute);
+      }
+    };
+    void run();
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    pathname,
+    config.trackingId,
+    config.target,
+    config.debug,
+    config.dev,
+    config.siteId,
+    config.clientPersonalization,
+    pageContextKey
+  ]);
+  const resolveRunRef = useRef(null);
+  useEffect(() => {
+    return () => {
+      if (resolveRunRef.current) resolveRunRef.current.cancelled = true;
+    };
+  }, []);
+  useEffect(() => {
+    if (initVersion === 0) return;
+    if (resolveRunRef.current?.version === initVersion) return;
+    const sdk = getSDK();
+    const actualRoute = getActualRoute();
+    if (!actualRoute || contentMountsRef.current === 0 || !overlayEnabled()) {
+      if (actualRoute) sdk.endPageResolve(actualRoute);
+      setPageConfig(null);
+      setLoading(false);
+      return;
+    }
+    if (resolveRunRef.current) resolveRunRef.current.cancelled = true;
+    const runState = { version: initVersion, cancelled: false };
+    resolveRunRef.current = runState;
+    const finish = () => {
+      sdk.endPageResolve(actualRoute);
+      if (!runState.cancelled) setLoading(false);
+    };
+    const run = async () => {
+      try {
         const preview = isComposerPreview();
-        const overlay = preview || config.clientPersonalization !== false;
-        if (!overlay) {
-          setInitialized(true);
-          setPageConfig(null);
-          setLoading(false);
-          return;
-        }
         if (loadedRouteRef.current && loadedRouteRef.current !== actualRoute) {
           setPageConfig(null);
           setError(null);
@@ -5635,9 +5698,7 @@ function AmplifyUpProvider({
         const orchestratorUrl = sdk.getOrchestratorUrl();
         const trackingId = sdk.getTrackingId();
         if (!trackingId || !orchestratorUrl || !edgeUrl) {
-          setInitialized(true);
           setError("SDK not initialized");
-          setLoading(false);
           return;
         }
         let variantKeys;
@@ -5670,7 +5731,7 @@ function AmplifyUpProvider({
           variantKeys,
           fetchOrchestratorPage: (route, isPreview) => sdk.fetchPageConfig(route, isPreview)
         });
-        if (cancelled) return;
+        if (runState.cancelled) return;
         const nextConfig = result.pageConfig || {
           id: "default",
           route: actualRoute,
@@ -5687,7 +5748,6 @@ function AmplifyUpProvider({
             result.pageConfig.pageTaxonomies || null
           );
         }
-        setInitialized(true);
         setSource((prev) => prev === result.source ? prev : result.source);
         setMeta(
           (prev) => prev === result.meta || JSON.stringify(prev) === JSON.stringify(result.meta) ? prev : result.meta
@@ -5701,31 +5761,17 @@ function AmplifyUpProvider({
         });
         loadedRouteRef.current = actualRoute;
       } catch (err) {
-        if (cancelled) return;
+        if (runState.cancelled) return;
         console.error("Error fetching page config:", err);
-        setInitialized(true);
         setError(err instanceof Error ? err.message : "Unknown error");
         setSource(null);
         setMeta(null);
       } finally {
-        if (heldRoute) sdk.endPageResolve(heldRoute);
-        if (!cancelled) setLoading(false);
+        finish();
       }
     };
     void run();
-    return () => {
-      cancelled = true;
-    };
-  }, [
-    pathname,
-    config.trackingId,
-    config.target,
-    config.debug,
-    config.dev,
-    config.siteId,
-    config.clientPersonalization,
-    pageContextKey
-  ]);
+  }, [initVersion, hasPageContent]);
   useEffect(() => {
     const applyLayoutTree = (layoutTree) => {
       if (!Array.isArray(layoutTree)) return;
@@ -5759,13 +5805,13 @@ function AmplifyUpProvider({
       window.removeEventListener("amplifyup:layout-patch", onCustom);
     };
   }, []);
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(PageContentRegistryContext.Provider, { value: registerPageContent, children: /* @__PURE__ */ jsx(
     AmplifyUpContext.Provider,
     {
       value: { pageConfig, loading, error, source, meta },
       children
     }
-  );
+  ) });
 }
 function useAmplifyUp() {
   const context = useContext(AmplifyUpContext);