@stytch/react 20.0.2 → 20.0.4

package/dist/cjs-dev/b2b/index.cjs

@@ -4,7 +4,7 @@ var b2b_index_headless = require('./index.headless.cjs');
 var React = require('react');
 var StytchB2BContext = require('../StytchB2BContext-CD6mLKq3.js');
 var StytchSSRProxy = require('../StytchSSRProxy-D0nfqCWX.js');
-var shadcn = require('../shadcn-_aqkqkH3.js');
+var shadcn = require('../shadcn-BDx_oy_4.js');
 var uniqueId = require('../uniqueId-CrAScvCS.js');
 var dev = require('../dev-DaCGDI6V.js');
 var logger = require('../logger-CvOATP4R.js');
@@ -3220,7 +3220,9 @@ const SSOButtons = ({ availableConnections })=>{
             connection: provider,
             onStart: (connection)=>setLastUsedMethod(getSsoMethodKey(connection))
         });
-        return foundLastUsed && index === 0 ? /*#__PURE__*/ React__namespace.createElement(shadcn.LastUsed, null, button) : button;
+        return foundLastUsed && index === 0 ? /*#__PURE__*/ React__namespace.createElement(shadcn.LastUsed, {
+            key: provider.display_name
+        }, button) : button;
     }));
 };
 const SSODiscoveryMenu = ()=>{
@@ -3600,6 +3602,7 @@ const Discovery = ()=>{
             message: "Accept Invite"
         });
         return /*#__PURE__*/ React__namespace.default.createElement(OrganizationRow, {
+            key: organization.organization_id,
             organization: organization,
             action: action,
             onClick: ()=>handleDiscoveryOrganizationStart(discoveredOrganization)
@@ -4504,21 +4507,29 @@ var modules_b00e876f = {"qr":"TOTPEnrollQRScreen_module_qr__ae8d607c"};
 const TOTPEnrollQRScreen = ()=>{
     const stytchClient = shadcn.useStytch();
     const [state, dispatch] = shadcn.useGlobalReducer();
+    const onEvent = shadcn.useEventCallback();
+    const onError = shadcn.useErrorCallback();
     const { i18n: $__i18n, _: $__ } = uniqueId.useLingui();
-    const { mfa: { totp: { createError, enrollment, isCreating } } } = state;
     // This screen should only be shown if primary info and TOTP enrollment are
     // available
     const { memberId, organizationId } = state.mfa.primaryInfo;
-    const { trigger: createTotp } = useMutate('stytch.totp.create', (_, { arg: { memberId, organizationId } })=>{
-        dispatch({
-            type: 'totp/create'
-        });
-        return stytchClient.totp.create({
+    const { data } = StytchB2BContext.useSWR([
+        'stytch.totp.create',
+        memberId,
+        organizationId
+    ], ()=>stytchClient.totp.create({
             member_id: memberId,
             organization_id: organizationId
-        });
-    }, {
+        }), {
+        revalidateOnFocus: false,
+        revalidateOnReconnect: false,
+        revalidateIfStale: false,
         onSuccess: (response)=>{
+            onEvent({
+                type: StytchSSRProxy.StytchEventType.B2BTOTPCreate,
+                data: response
+            });
+            // Store the enrollment object so we can show recovery code after authenticating
             dispatch({
                 type: 'totp/create_success',
                 response,
@@ -4533,26 +4544,9 @@ const TOTPEnrollQRScreen = ()=>{
                     message
                 });
             }
-            dispatch({
-                type: 'totp/create_error',
-                error
-            });
+            onError(error);
         }
     });
-    const shouldCreate = !enrollment && !isCreating && !createError;
-    React.useEffect(()=>{
-        if (shouldCreate) {
-            createTotp({
-                memberId,
-                organizationId
-            });
-        }
-    }, [
-        createTotp,
-        memberId,
-        organizationId,
-        shouldCreate
-    ]);
     const handleShowManualCode = ()=>{
         dispatch({
             type: 'totp/show_code',
@@ -4578,12 +4572,12 @@ const TOTPEnrollQRScreen = ()=>{
     }, $__i18n._({
         id: "totp.setupQr.content",
         message: "Your organization requires an additional form of verification to make your account more secure. If you don’t have an authenticator app, you’ll need to install one first."
-    })), enrollment ? /*#__PURE__*/ React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/ React__namespace.default.createElement("img", {
+    })), data ? /*#__PURE__*/ React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/ React__namespace.default.createElement("img", {
         alt: $__i18n._({
             id: "mfaTotpEnrollment.qrAltText",
             message: "QR code for TOTP enrollment"
         }),
-        src: enrollment.qrCode,
+        src: data.qr_code,
         className: modules_b00e876f.qr
     }), /*#__PURE__*/ React__namespace.default.createElement(shadcn.ButtonColumn, null, /*#__PURE__*/ React__namespace.default.createElement(shadcn.Button, {
         variant: "primary",