@dynamic-labs/sdk-react-core 4.64.0 → 4.66.0

package/src/lib/widgets/DynamicWidget/views/SetupPasswordView/SetupPasswordView.cjs

@@ -3,12 +3,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _tslib = require('../../../../../../_virtual/_tslib.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
+var reactI18next = require('react-i18next');
 var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 var SetupPasswordConfirmView = require('../SetupPasswordConfirmView/SetupPasswordConfirmView.cjs');
 var SetupPasswordEnterView = require('../SetupPasswordEnterView/SetupPasswordEnterView.cjs');
-require('../../../../../../_virtual/_tslib.cjs');
 require('@dynamic-labs/utils');
 require('@dynamic-labs/iconic');
 require('../../../../context/ViewContext/ViewContext.cjs');
@@ -16,10 +17,13 @@ var SetupPasswordKnowledgeCheckView = require('../SetupPasswordKnowledgeCheckVie
 var SetupPasswordSuccessView = require('../SetupPasswordSuccessView/SetupPasswordSuccessView.cjs');
 var SetupPasswordTermsView = require('../SetupPasswordTermsView/SetupPasswordTermsView.cjs');
 
-const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }) => {
+const SetupPasswordView = ({ onComplete, onCancel, onDone, skipKnowledgeCheck = false, }) => {
+    const { t } = reactI18next.useTranslation();
     const { setDynamicWidgetView, setIsOpen } = DynamicWidgetContext.useWidgetContext();
     const [currentStep, setCurrentStep] = React.useState('terms');
     const [password, setPassword] = React.useState('');
+    const [isSubmitting, setIsSubmitting] = React.useState(false);
+    const [submitError, setSubmitError] = React.useState(null);
     const goToAccountAndSecurity = React.useCallback(() => {
         setDynamicWidgetView('account-and-security-settings');
     }, [setDynamicWidgetView]);
@@ -41,20 +45,34 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
     const handleEnterBack = React.useCallback(() => {
         setCurrentStep('terms');
     }, []);
-    const handleConfirmContinue = React.useCallback(() => {
-        if (skipKnowledgeCheck) {
+    const runOnComplete = React.useCallback((pwd) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        setIsSubmitting(true);
+        setSubmitError(null);
+        try {
+            yield onComplete(pwd);
             setCurrentStep('success');
         }
+        catch (_a) {
+            setSubmitError(t('dyn_setup_password.confirm.error.failed'));
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }), [onComplete, t]);
+    const handleConfirmContinue = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        if (skipKnowledgeCheck) {
+            yield runOnComplete(password);
+        }
         else {
             setCurrentStep('knowledge-check');
         }
-    }, [skipKnowledgeCheck]);
+    }), [skipKnowledgeCheck, runOnComplete, password]);
     const handleConfirmBack = React.useCallback(() => {
         setCurrentStep('enter');
     }, []);
-    const handleKnowledgeCheckContinue = React.useCallback(() => {
-        setCurrentStep('success');
-    }, []);
+    const handleKnowledgeCheckContinue = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+        yield runOnComplete(password);
+    }), [runOnComplete, password]);
     const handleKnowledgeCheckBack = React.useCallback(() => {
         setCurrentStep('confirm');
     }, []);
@@ -62,10 +80,7 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
         setDynamicWidgetView('wallets');
     }, [setDynamicWidgetView]);
     const handleSuccess = React.useCallback(() => {
-        onComplete(password);
-        // Navigate to appropriate view based on where we came from:
-        // - If onCancel was provided (auto-create flow), go to wallets then close widget
-        // - If onCancel wasn't provided (settings flow), go to account settings
+        onDone === null || onDone === void 0 ? void 0 : onDone();
         if (onCancel) {
             goToWallets();
             setIsOpen(false);
@@ -73,23 +88,16 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
         else {
             goToAccountAndSecurity();
         }
-    }, [
-        onComplete,
-        password,
-        onCancel,
-        goToAccountAndSecurity,
-        goToWallets,
-        setIsOpen,
-    ]);
+    }, [onDone, onCancel, goToAccountAndSecurity, goToWallets, setIsOpen]);
     switch (currentStep) {
         case 'terms':
             return (jsxRuntime.jsx(SetupPasswordTermsView.SetupPasswordTermsView, { onContinue: handleTermsContinue, onBack: onCancel ? undefined : handleCancel }));
         case 'enter':
             return (jsxRuntime.jsx(SetupPasswordEnterView.SetupPasswordEnterView, { onContinue: handleEnterContinue, onBack: handleEnterBack }));
         case 'confirm':
-            return (jsxRuntime.jsx(SetupPasswordConfirmView.SetupPasswordConfirmView, { password: password, onContinue: handleConfirmContinue, onBack: handleConfirmBack }));
+            return (jsxRuntime.jsx(SetupPasswordConfirmView.SetupPasswordConfirmView, { password: password, onContinue: handleConfirmContinue, onBack: handleConfirmBack, isLoading: isSubmitting && skipKnowledgeCheck, error: skipKnowledgeCheck ? submitError : null }));
         case 'knowledge-check':
-            return (jsxRuntime.jsx(SetupPasswordKnowledgeCheckView.SetupPasswordKnowledgeCheckView, { onContinue: handleKnowledgeCheckContinue, onBack: handleKnowledgeCheckBack }));
+            return (jsxRuntime.jsx(SetupPasswordKnowledgeCheckView.SetupPasswordKnowledgeCheckView, { onContinue: handleKnowledgeCheckContinue, onBack: handleKnowledgeCheckBack, isLoading: isSubmitting, error: submitError }));
         case 'success':
             return jsxRuntime.jsx(SetupPasswordSuccessView.SetupPasswordSuccessView, { onDone: handleSuccess });
         default:

package/src/lib/widgets/DynamicWidget/views/SetupPasswordView/SetupPasswordView.d.ts

@@ -1,7 +1,8 @@
 import { FC } from 'react';
 export type SetupPasswordViewProps = {
-    onComplete: (password: string) => void;
+    onComplete: (password: string) => Promise<void> | void;
     onCancel?: () => void;
+    onDone?: () => void;
     skipKnowledgeCheck?: boolean;
 };
 export declare const SetupPasswordView: FC<SetupPasswordViewProps>;

package/src/lib/widgets/DynamicWidget/views/SetupPasswordView/SetupPasswordView.js

@@ -1,10 +1,11 @@
 'use client'
+import { __awaiter } from '../../../../../../_virtual/_tslib.js';
 import { jsx } from 'react/jsx-runtime';
 import { useState, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useWidgetContext } from '../../context/DynamicWidgetContext.js';
 import { SetupPasswordConfirmView } from '../SetupPasswordConfirmView/SetupPasswordConfirmView.js';
 import { SetupPasswordEnterView } from '../SetupPasswordEnterView/SetupPasswordEnterView.js';
-import '../../../../../../_virtual/_tslib.js';
 import '@dynamic-labs/utils';
 import '@dynamic-labs/iconic';
 import '../../../../context/ViewContext/ViewContext.js';
@@ -12,10 +13,13 @@ import { SetupPasswordKnowledgeCheckView } from '../SetupPasswordKnowledgeCheckV
 import { SetupPasswordSuccessView } from '../SetupPasswordSuccessView/SetupPasswordSuccessView.js';
 import { SetupPasswordTermsView } from '../SetupPasswordTermsView/SetupPasswordTermsView.js';
 
-const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }) => {
+const SetupPasswordView = ({ onComplete, onCancel, onDone, skipKnowledgeCheck = false, }) => {
+    const { t } = useTranslation();
     const { setDynamicWidgetView, setIsOpen } = useWidgetContext();
     const [currentStep, setCurrentStep] = useState('terms');
     const [password, setPassword] = useState('');
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    const [submitError, setSubmitError] = useState(null);
     const goToAccountAndSecurity = useCallback(() => {
         setDynamicWidgetView('account-and-security-settings');
     }, [setDynamicWidgetView]);
@@ -37,20 +41,34 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
     const handleEnterBack = useCallback(() => {
         setCurrentStep('terms');
     }, []);
-    const handleConfirmContinue = useCallback(() => {
-        if (skipKnowledgeCheck) {
+    const runOnComplete = useCallback((pwd) => __awaiter(void 0, void 0, void 0, function* () {
+        setIsSubmitting(true);
+        setSubmitError(null);
+        try {
+            yield onComplete(pwd);
             setCurrentStep('success');
         }
+        catch (_a) {
+            setSubmitError(t('dyn_setup_password.confirm.error.failed'));
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }), [onComplete, t]);
+    const handleConfirmContinue = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        if (skipKnowledgeCheck) {
+            yield runOnComplete(password);
+        }
         else {
             setCurrentStep('knowledge-check');
         }
-    }, [skipKnowledgeCheck]);
+    }), [skipKnowledgeCheck, runOnComplete, password]);
     const handleConfirmBack = useCallback(() => {
         setCurrentStep('enter');
     }, []);
-    const handleKnowledgeCheckContinue = useCallback(() => {
-        setCurrentStep('success');
-    }, []);
+    const handleKnowledgeCheckContinue = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        yield runOnComplete(password);
+    }), [runOnComplete, password]);
     const handleKnowledgeCheckBack = useCallback(() => {
         setCurrentStep('confirm');
     }, []);
@@ -58,10 +76,7 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
         setDynamicWidgetView('wallets');
     }, [setDynamicWidgetView]);
     const handleSuccess = useCallback(() => {
-        onComplete(password);
-        // Navigate to appropriate view based on where we came from:
-        // - If onCancel was provided (auto-create flow), go to wallets then close widget
-        // - If onCancel wasn't provided (settings flow), go to account settings
+        onDone === null || onDone === void 0 ? void 0 : onDone();
         if (onCancel) {
             goToWallets();
             setIsOpen(false);
@@ -69,23 +84,16 @@ const SetupPasswordView = ({ onComplete, onCancel, skipKnowledgeCheck = false, }
         else {
             goToAccountAndSecurity();
         }
-    }, [
-        onComplete,
-        password,
-        onCancel,
-        goToAccountAndSecurity,
-        goToWallets,
-        setIsOpen,
-    ]);
+    }, [onDone, onCancel, goToAccountAndSecurity, goToWallets, setIsOpen]);
     switch (currentStep) {
         case 'terms':
             return (jsx(SetupPasswordTermsView, { onContinue: handleTermsContinue, onBack: onCancel ? undefined : handleCancel }));
         case 'enter':
             return (jsx(SetupPasswordEnterView, { onContinue: handleEnterContinue, onBack: handleEnterBack }));
         case 'confirm':
-            return (jsx(SetupPasswordConfirmView, { password: password, onContinue: handleConfirmContinue, onBack: handleConfirmBack }));
+            return (jsx(SetupPasswordConfirmView, { password: password, onContinue: handleConfirmContinue, onBack: handleConfirmBack, isLoading: isSubmitting && skipKnowledgeCheck, error: skipKnowledgeCheck ? submitError : null }));
         case 'knowledge-check':
-            return (jsx(SetupPasswordKnowledgeCheckView, { onContinue: handleKnowledgeCheckContinue, onBack: handleKnowledgeCheckBack }));
+            return (jsx(SetupPasswordKnowledgeCheckView, { onContinue: handleKnowledgeCheckContinue, onBack: handleKnowledgeCheckBack, isLoading: isSubmitting, error: submitError }));
         case 'success':
             return jsx(SetupPasswordSuccessView, { onDone: handleSuccess });
         default: