@merit-systems/echo-react-sdk 1.0.9 → 1.0.10

package/dist/index.js

@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 var _a;
 import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import React2, { useState, useCallback, useEffect, createContext, useContext, useRef } from "react";
+import React2, { useState, useCallback, useEffect, createContext, useMemo, useContext, useRef } from "react";
 class InvalidTokenError extends Error {
 }
 InvalidTokenError.prototype.name = "InvalidTokenError";
@@ -9067,19 +9067,18 @@ function useEchoBalance(echoClient, appId) {
   };
 }
 function useEchoClient({ apiUrl }) {
-  var _a2;
+  var _a2, _b;
   const auth = useAuth();
   const [client, setClient] = useState(null);
   useEffect(() => {
-    var _a3;
-    if (!((_a3 = auth.user) == null ? void 0 : _a3.access_token)) {
+    if (!auth.isAuthenticated || !auth.user) {
       setClient(null);
       return;
     }
     const tokenProvider = new OAuthTokenProvider({
       getTokenFn: () => {
-        var _a4;
-        return Promise.resolve(((_a4 = auth.user) == null ? void 0 : _a4.access_token) || null);
+        var _a3;
+        return Promise.resolve(((_a3 = auth.user) == null ? void 0 : _a3.access_token) || null);
       },
       refreshTokenFn: async () => {
         await auth.signinSilent();
@@ -9097,7 +9096,14 @@ function useEchoClient({ apiUrl }) {
     return () => {
       setClient(null);
     };
-  }, [apiUrl, (_a2 = auth.user) == null ? void 0 : _a2.access_token, auth.signinSilent, auth.signoutSilent]);
+  }, [
+    apiUrl,
+    auth.isAuthenticated,
+    (_b = (_a2 = auth.user) == null ? void 0 : _a2.profile) == null ? void 0 : _b.sub,
+    // Only recreate if user ID changes
+    auth.signinSilent,
+    auth.signoutSilent
+  ]);
   return client;
 }
 function useEchoPayments(echoClient) {
@@ -9135,6 +9141,9 @@ function useEchoPayments(echoClient) {
   };
 }
 const EchoContext = createContext(null);
+const EchoRefreshContext = createContext(
+  null
+);
 function EchoProviderInternal({ config, children }) {
   var _a2, _b, _c;
   const auth = useAuth();
@@ -9167,25 +9176,51 @@ function EchoProviderInternal({ config, children }) {
     return ((_a3 = auth.user) == null ? void 0 : _a3.access_token) || null;
   }, [(_b = auth.user) == null ? void 0 : _b.access_token]);
   const combinedError = ((_c = auth.error) == null ? void 0 : _c.message) || balanceError || paymentError || null;
-  const combinedLoading = auth.isLoading || balanceLoading || paymentLoading;
-  const contextValue = {
-    user: echoUser || null,
-    rawUser: user,
-    balance,
-    freeTierBalance,
-    isAuthenticated: auth.isAuthenticated,
-    isLoading: combinedLoading,
-    error: combinedError,
-    token,
-    echoClient,
-    signIn: auth.signinRedirect,
-    signOut: clearAuth,
-    refreshBalance,
-    createPaymentLink,
-    getToken,
-    clearAuth
-  };
-  return /* @__PURE__ */ jsx(EchoContext.Provider, { value: contextValue, children });
+  const isInitialAuthLoading = auth.isLoading && !auth.isAuthenticated;
+  const isTokenRefreshing = auth.isLoading && auth.isAuthenticated;
+  const combinedLoading = isInitialAuthLoading || balanceLoading || paymentLoading;
+  const contextValue = useMemo(
+    () => ({
+      user: echoUser || null,
+      rawUser: user,
+      balance,
+      freeTierBalance,
+      isAuthenticated: auth.isAuthenticated,
+      isLoading: combinedLoading,
+      error: combinedError,
+      token,
+      echoClient,
+      signIn: auth.signinRedirect,
+      signOut: clearAuth,
+      refreshBalance,
+      createPaymentLink,
+      getToken,
+      clearAuth
+    }),
+    [
+      echoUser,
+      user,
+      balance,
+      freeTierBalance,
+      auth.isAuthenticated,
+      combinedLoading,
+      combinedError,
+      token,
+      echoClient,
+      auth.signinRedirect,
+      clearAuth,
+      refreshBalance,
+      createPaymentLink,
+      getToken
+    ]
+  );
+  const refreshContextValue = useMemo(
+    () => ({
+      isRefreshing: isTokenRefreshing
+    }),
+    [isTokenRefreshing]
+  );
+  return /* @__PURE__ */ jsx(EchoContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(EchoRefreshContext.Provider, { value: refreshContextValue, children }) });
 }
 function EchoProvider({ config, children }) {
   const [isClient, setIsClient] = useState(false);