@nocios/crudify-ui 1.0.63 → 1.0.65

package/dist/index.js

@@ -722,78 +722,66 @@ var ResetPasswordForm = ({ onNavigate, onError, searchParams, onResetSuccess, cr
       crudifyKeys: crudify3 ? Object.keys(crudify3) : null
     });
     if (crudify3 && pendingValidation) {
-      const timer = setTimeout(() => {
-        console.log("\u{1F680} Crudify ready! Executing pending validation after delay:", pendingValidation);
-        console.log("\u{1F50D} Crudify object details:", {
-          hasTransaction: typeof crudify3.transaction === "function",
-          hasLogin: typeof crudify3.login === "function",
-          crudifyInstance: crudify3
+      console.log("\u{1F680} Crudify verified ready! Executing pending validation:", pendingValidation);
+      console.log("\u{1F50D} Crudify object details:", {
+        hasTransaction: typeof crudify3.transaction === "function",
+        hasLogin: typeof crudify3.login === "function",
+        crudifyInstance: crudify3
+      });
+      const validateCode = async (emailToValidate, codeToValidate) => {
+        console.log("\u{1F50D} Validating reset code:", { emailToValidate, codeToValidate });
+        console.log("\u{1F4CB} Pre-validation crudify check:", {
+          crudify: !!crudify3,
+          transaction: typeof crudify3?.transaction,
+          crudifyString: crudify3?.toString?.()
         });
         try {
-          if (!crudify3.transaction) {
-            console.log("\u274C Crudify transaction method not available, deferring validation");
-            return;
-          }
-        } catch (error) {
-          console.log("\u274C Error checking crudify state, deferring validation:", error);
-          return;
-        }
-        const validateCode = async (emailToValidate, codeToValidate) => {
-          console.log("\u{1F50D} Validating reset code:", { emailToValidate, codeToValidate });
-          console.log("\u{1F4CB} Pre-validation crudify check:", {
-            crudify: !!crudify3,
-            transaction: typeof crudify3?.transaction,
-            crudifyString: crudify3?.toString?.()
-          });
-          try {
-            const data = [
-              {
-                operation: "validatePasswordResetCode",
-                data: { email: emailToValidate, codePassword: codeToValidate }
-              }
-            ];
-            console.log("\u{1F4E4} Sending validation request:", data);
-            console.log("\u{1F3AF} About to call crudify.transaction...");
-            const response = await crudify3.transaction(data);
-            console.log("\u{1F4E5} Validation response:", response);
-            if (response.success) {
-              console.log("\u2705 Code validation successful");
-              setCodeValidated(true);
+          const data = [
+            {
+              operation: "validatePasswordResetCode",
+              data: { email: emailToValidate, codePassword: codeToValidate }
+            }
+          ];
+          console.log("\u{1F4E4} Sending validation request:", data);
+          console.log("\u{1F3AF} About to call crudify.transaction...");
+          const response = await crudify3.transaction(data);
+          console.log("\u{1F4E5} Validation response:", response);
+          if (response.success) {
+            console.log("\u2705 Code validation successful");
+            setCodeValidated(true);
+          } else {
+            console.log("\u274C Code validation failed:", response);
+            if (response.data?.response?.status === "TOO_MANY_REQUESTS") {
+              setErrors([t("errors.auth.TOO_MANY_REQUESTS")]);
             } else {
-              console.log("\u274C Code validation failed:", response);
-              if (response.data?.response?.status === "TOO_MANY_REQUESTS") {
-                setErrors([t("errors.auth.TOO_MANY_REQUESTS")]);
-              } else {
-                let errorMessage = t("resetPassword.invalidCode");
-                if (response.errors?._error) {
-                  const error = response.errors._error[0];
-                  if (error === "TOO_MANY_REQUESTS") {
-                    errorMessage = t("errors.auth.TOO_MANY_REQUESTS");
-                  } else {
-                    const errorMsg = error?.toLowerCase() || "";
-                    if (errorMsg.includes("expired")) {
-                      errorMessage = t("resetPassword.codeExpiredOrInvalid");
-                    } else if (errorMsg.includes("invalid")) {
-                      errorMessage = t("resetPassword.invalidCode");
-                    }
+              let errorMessage = t("resetPassword.invalidCode");
+              if (response.errors?._error) {
+                const error = response.errors._error[0];
+                if (error === "TOO_MANY_REQUESTS") {
+                  errorMessage = t("errors.auth.TOO_MANY_REQUESTS");
+                } else {
+                  const errorMsg = error?.toLowerCase() || "";
+                  if (errorMsg.includes("expired")) {
+                    errorMessage = t("resetPassword.codeExpiredOrInvalid");
+                  } else if (errorMsg.includes("invalid")) {
+                    errorMessage = t("resetPassword.invalidCode");
                   }
                 }
-                setErrors([errorMessage]);
               }
-              setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
+              setErrors([errorMessage]);
             }
-          } catch (error) {
-            console.error("Code validation error:", error);
-            setErrors([t("resetPassword.invalidCode")]);
             setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
-          } finally {
-            setValidatingCode(false);
-            setPendingValidation(null);
           }
-        };
-        validateCode(pendingValidation.email, pendingValidation.code);
-      }, 100);
-      return () => clearTimeout(timer);
+        } catch (error) {
+          console.error("Code validation error:", error);
+          setErrors([t("resetPassword.invalidCode")]);
+          setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
+        } finally {
+          setValidatingCode(false);
+          setPendingValidation(null);
+        }
+      };
+      validateCode(pendingValidation.email, pendingValidation.code);
     }
   }, [crudify3, pendingValidation, t, onNavigate]);
   const validatePassword = (password) => {
@@ -1130,6 +1118,7 @@ var getCookie = (name) => {
 
 // src/components/CrudifyLogin/hooks/useCrudifyLogin.ts
 var useCrudifyLogin = (config, _options = {}) => {
+  const [isInitialized, setIsInitialized] = (0, import_react7.useState)(false);
   const finalConfig = (0, import_react7.useMemo)(() => {
     const publicApiKey = config.publicApiKey || getCookie("publicApiKey") || null;
     const rawEnv = config.env || getCookie("environment") || "prod";
@@ -1158,44 +1147,63 @@ var useCrudifyLogin = (config, _options = {}) => {
     });
     if (!finalConfig.publicApiKey) {
       console.log("\u274C No publicApiKey, skipping crudify initialization");
+      setIsInitialized(false);
       return;
     }
-    try {
-      console.log("\u2699\uFE0F Configuring crudify with env:", finalConfig.env);
-      import_crudify_browser.default.config(finalConfig.env);
-      console.log("\u{1F680} Initializing crudify with publicApiKey:", finalConfig.publicApiKey.substring(0, 10) + "...");
-      import_crudify_browser.default.init(finalConfig.publicApiKey, "none");
-      console.log("\u2705 Crudify initialization completed");
-      console.log("\u{1F50D} Crudify state after init:", {
-        hasTransaction: typeof import_crudify_browser.default.transaction === "function",
-        hasLogin: typeof import_crudify_browser.default.login === "function",
-        crudifyObject: import_crudify_browser.default
-      });
-    } catch (error) {
-      console.error("\u274C Error initializing crudify:", error);
-    }
+    const initializeCrudify = async () => {
+      try {
+        console.log("\u2699\uFE0F Configuring crudify with env:", finalConfig.env);
+        import_crudify_browser.default.config(finalConfig.env);
+        console.log("\u{1F680} Initializing crudify with publicApiKey:", finalConfig.publicApiKey.substring(0, 10) + "...");
+        import_crudify_browser.default.init(finalConfig.publicApiKey, "none");
+        console.log("\u{1F9EA} Testing crudify initialization...");
+        await new Promise((resolve) => setTimeout(resolve, 50));
+        if (typeof import_crudify_browser.default.transaction === "function" && typeof import_crudify_browser.default.login === "function") {
+          console.log("\u2705 Crudify initialization verified and ready");
+          setIsInitialized(true);
+        } else {
+          console.log("\u274C Crudify methods not properly initialized");
+          setIsInitialized(false);
+        }
+        console.log("\u{1F50D} Crudify state after init:", {
+          hasTransaction: typeof import_crudify_browser.default.transaction === "function",
+          hasLogin: typeof import_crudify_browser.default.login === "function",
+          isInitialized: true,
+          crudifyObject: import_crudify_browser.default
+        });
+      } catch (error) {
+        console.error("\u274C Error initializing crudify:", error);
+        setIsInitialized(false);
+      }
+    };
+    initializeCrudify();
   }, [finalConfig.publicApiKey, finalConfig.env]);
   const crudifyMethods = (0, import_react7.useMemo)(() => {
     console.log("\u{1F504} crudifyMethods useMemo triggered:", {
       publicApiKey: !!finalConfig.publicApiKey,
+      isInitialized,
       crudifyLogin: typeof import_crudify_browser.default.login,
       crudifyTransaction: typeof import_crudify_browser.default.transaction
     });
-    if (!finalConfig.publicApiKey) {
-      console.log("\u274C No publicApiKey, returning null crudifyMethods");
+    if (!finalConfig.publicApiKey || !isInitialized) {
+      console.log("\u274C Crudify not ready:", {
+        publicApiKey: !!finalConfig.publicApiKey,
+        isInitialized
+      });
       return null;
     }
     const methods = {
       login: import_crudify_browser.default.login,
       transaction: import_crudify_browser.default.transaction
     };
-    console.log("\u2705 Returning crudifyMethods:", {
+    console.log("\u2705 Returning ready crudifyMethods:", {
       hasLogin: typeof methods.login === "function",
       hasTransaction: typeof methods.transaction === "function",
+      isInitialized,
       methods
     });
     return methods;
-  }, [finalConfig.publicApiKey]);
+  }, [finalConfig.publicApiKey, isInitialized]);
   return { crudify: crudifyMethods };
 };
 

package/dist/index.mjs

@@ -3,7 +3,7 @@ import { default as default2 } from "@nocios/crudify-browser";
 export * from "@nocios/crudify-browser";
 
 // src/components/CrudifyLogin/index.tsx
-import React2, { useState as useState6, useMemo as useMemo3 } from "react";
+import React2, { useState as useState7, useMemo as useMemo3 } from "react";
 import { Box as Box5, Typography as Typography5 } from "@mui/material";
 
 // src/components/CrudifyLogin/context/I18nProvider.tsx
@@ -678,78 +678,66 @@ var ResetPasswordForm = ({ onNavigate, onError, searchParams, onResetSuccess, cr
       crudifyKeys: crudify3 ? Object.keys(crudify3) : null
     });
     if (crudify3 && pendingValidation) {
-      const timer = setTimeout(() => {
-        console.log("\u{1F680} Crudify ready! Executing pending validation after delay:", pendingValidation);
-        console.log("\u{1F50D} Crudify object details:", {
-          hasTransaction: typeof crudify3.transaction === "function",
-          hasLogin: typeof crudify3.login === "function",
-          crudifyInstance: crudify3
+      console.log("\u{1F680} Crudify verified ready! Executing pending validation:", pendingValidation);
+      console.log("\u{1F50D} Crudify object details:", {
+        hasTransaction: typeof crudify3.transaction === "function",
+        hasLogin: typeof crudify3.login === "function",
+        crudifyInstance: crudify3
+      });
+      const validateCode = async (emailToValidate, codeToValidate) => {
+        console.log("\u{1F50D} Validating reset code:", { emailToValidate, codeToValidate });
+        console.log("\u{1F4CB} Pre-validation crudify check:", {
+          crudify: !!crudify3,
+          transaction: typeof crudify3?.transaction,
+          crudifyString: crudify3?.toString?.()
         });
         try {
-          if (!crudify3.transaction) {
-            console.log("\u274C Crudify transaction method not available, deferring validation");
-            return;
-          }
-        } catch (error) {
-          console.log("\u274C Error checking crudify state, deferring validation:", error);
-          return;
-        }
-        const validateCode = async (emailToValidate, codeToValidate) => {
-          console.log("\u{1F50D} Validating reset code:", { emailToValidate, codeToValidate });
-          console.log("\u{1F4CB} Pre-validation crudify check:", {
-            crudify: !!crudify3,
-            transaction: typeof crudify3?.transaction,
-            crudifyString: crudify3?.toString?.()
-          });
-          try {
-            const data = [
-              {
-                operation: "validatePasswordResetCode",
-                data: { email: emailToValidate, codePassword: codeToValidate }
-              }
-            ];
-            console.log("\u{1F4E4} Sending validation request:", data);
-            console.log("\u{1F3AF} About to call crudify.transaction...");
-            const response = await crudify3.transaction(data);
-            console.log("\u{1F4E5} Validation response:", response);
-            if (response.success) {
-              console.log("\u2705 Code validation successful");
-              setCodeValidated(true);
+          const data = [
+            {
+              operation: "validatePasswordResetCode",
+              data: { email: emailToValidate, codePassword: codeToValidate }
+            }
+          ];
+          console.log("\u{1F4E4} Sending validation request:", data);
+          console.log("\u{1F3AF} About to call crudify.transaction...");
+          const response = await crudify3.transaction(data);
+          console.log("\u{1F4E5} Validation response:", response);
+          if (response.success) {
+            console.log("\u2705 Code validation successful");
+            setCodeValidated(true);
+          } else {
+            console.log("\u274C Code validation failed:", response);
+            if (response.data?.response?.status === "TOO_MANY_REQUESTS") {
+              setErrors([t("errors.auth.TOO_MANY_REQUESTS")]);
             } else {
-              console.log("\u274C Code validation failed:", response);
-              if (response.data?.response?.status === "TOO_MANY_REQUESTS") {
-                setErrors([t("errors.auth.TOO_MANY_REQUESTS")]);
-              } else {
-                let errorMessage = t("resetPassword.invalidCode");
-                if (response.errors?._error) {
-                  const error = response.errors._error[0];
-                  if (error === "TOO_MANY_REQUESTS") {
-                    errorMessage = t("errors.auth.TOO_MANY_REQUESTS");
-                  } else {
-                    const errorMsg = error?.toLowerCase() || "";
-                    if (errorMsg.includes("expired")) {
-                      errorMessage = t("resetPassword.codeExpiredOrInvalid");
-                    } else if (errorMsg.includes("invalid")) {
-                      errorMessage = t("resetPassword.invalidCode");
-                    }
+              let errorMessage = t("resetPassword.invalidCode");
+              if (response.errors?._error) {
+                const error = response.errors._error[0];
+                if (error === "TOO_MANY_REQUESTS") {
+                  errorMessage = t("errors.auth.TOO_MANY_REQUESTS");
+                } else {
+                  const errorMsg = error?.toLowerCase() || "";
+                  if (errorMsg.includes("expired")) {
+                    errorMessage = t("resetPassword.codeExpiredOrInvalid");
+                  } else if (errorMsg.includes("invalid")) {
+                    errorMessage = t("resetPassword.invalidCode");
                   }
                 }
-                setErrors([errorMessage]);
               }
-              setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
+              setErrors([errorMessage]);
             }
-          } catch (error) {
-            console.error("Code validation error:", error);
-            setErrors([t("resetPassword.invalidCode")]);
             setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
-          } finally {
-            setValidatingCode(false);
-            setPendingValidation(null);
           }
-        };
-        validateCode(pendingValidation.email, pendingValidation.code);
-      }, 100);
-      return () => clearTimeout(timer);
+        } catch (error) {
+          console.error("Code validation error:", error);
+          setErrors([t("resetPassword.invalidCode")]);
+          setTimeout(() => onNavigate?.("/login/forgotPassword"), 3e3);
+        } finally {
+          setValidatingCode(false);
+          setPendingValidation(null);
+        }
+      };
+      validateCode(pendingValidation.email, pendingValidation.code);
     }
   }, [crudify3, pendingValidation, t, onNavigate]);
   const validatePassword = (password) => {
@@ -1075,7 +1063,7 @@ var CheckCodeForm = ({ onNavigate, onError, searchParams, crudify: crudify3 }) =
 var CheckCodeForm_default = CheckCodeForm;
 
 // src/components/CrudifyLogin/hooks/useCrudifyLogin.ts
-import { useMemo as useMemo2, useEffect as useEffect5 } from "react";
+import { useMemo as useMemo2, useEffect as useEffect5, useState as useState6 } from "react";
 import crudify from "@nocios/crudify-browser";
 
 // src/components/CrudifyLogin/utils/cookies.ts
@@ -1086,6 +1074,7 @@ var getCookie = (name) => {
 
 // src/components/CrudifyLogin/hooks/useCrudifyLogin.ts
 var useCrudifyLogin = (config, _options = {}) => {
+  const [isInitialized, setIsInitialized] = useState6(false);
   const finalConfig = useMemo2(() => {
     const publicApiKey = config.publicApiKey || getCookie("publicApiKey") || null;
     const rawEnv = config.env || getCookie("environment") || "prod";
@@ -1114,44 +1103,63 @@ var useCrudifyLogin = (config, _options = {}) => {
     });
     if (!finalConfig.publicApiKey) {
       console.log("\u274C No publicApiKey, skipping crudify initialization");
+      setIsInitialized(false);
       return;
     }
-    try {
-      console.log("\u2699\uFE0F Configuring crudify with env:", finalConfig.env);
-      crudify.config(finalConfig.env);
-      console.log("\u{1F680} Initializing crudify with publicApiKey:", finalConfig.publicApiKey.substring(0, 10) + "...");
-      crudify.init(finalConfig.publicApiKey, "none");
-      console.log("\u2705 Crudify initialization completed");
-      console.log("\u{1F50D} Crudify state after init:", {
-        hasTransaction: typeof crudify.transaction === "function",
-        hasLogin: typeof crudify.login === "function",
-        crudifyObject: crudify
-      });
-    } catch (error) {
-      console.error("\u274C Error initializing crudify:", error);
-    }
+    const initializeCrudify = async () => {
+      try {
+        console.log("\u2699\uFE0F Configuring crudify with env:", finalConfig.env);
+        crudify.config(finalConfig.env);
+        console.log("\u{1F680} Initializing crudify with publicApiKey:", finalConfig.publicApiKey.substring(0, 10) + "...");
+        crudify.init(finalConfig.publicApiKey, "none");
+        console.log("\u{1F9EA} Testing crudify initialization...");
+        await new Promise((resolve) => setTimeout(resolve, 50));
+        if (typeof crudify.transaction === "function" && typeof crudify.login === "function") {
+          console.log("\u2705 Crudify initialization verified and ready");
+          setIsInitialized(true);
+        } else {
+          console.log("\u274C Crudify methods not properly initialized");
+          setIsInitialized(false);
+        }
+        console.log("\u{1F50D} Crudify state after init:", {
+          hasTransaction: typeof crudify.transaction === "function",
+          hasLogin: typeof crudify.login === "function",
+          isInitialized: true,
+          crudifyObject: crudify
+        });
+      } catch (error) {
+        console.error("\u274C Error initializing crudify:", error);
+        setIsInitialized(false);
+      }
+    };
+    initializeCrudify();
   }, [finalConfig.publicApiKey, finalConfig.env]);
   const crudifyMethods = useMemo2(() => {
     console.log("\u{1F504} crudifyMethods useMemo triggered:", {
       publicApiKey: !!finalConfig.publicApiKey,
+      isInitialized,
       crudifyLogin: typeof crudify.login,
       crudifyTransaction: typeof crudify.transaction
     });
-    if (!finalConfig.publicApiKey) {
-      console.log("\u274C No publicApiKey, returning null crudifyMethods");
+    if (!finalConfig.publicApiKey || !isInitialized) {
+      console.log("\u274C Crudify not ready:", {
+        publicApiKey: !!finalConfig.publicApiKey,
+        isInitialized
+      });
       return null;
     }
     const methods = {
       login: crudify.login,
       transaction: crudify.transaction
     };
-    console.log("\u2705 Returning crudifyMethods:", {
+    console.log("\u2705 Returning ready crudifyMethods:", {
       hasLogin: typeof methods.login === "function",
       hasTransaction: typeof methods.transaction === "function",
+      isInitialized,
       methods
     });
     return methods;
-  }, [finalConfig.publicApiKey]);
+  }, [finalConfig.publicApiKey, isInitialized]);
   return { crudify: crudifyMethods };
 };
 
@@ -1167,8 +1175,8 @@ var CrudifyLoginInternal = ({
   autoReadFromCookies = true
 }) => {
   const { t } = useTranslation();
-  const [currentScreen, setCurrentScreen] = useState6(initialScreen);
-  const [searchParams, setSearchParams] = useState6();
+  const [currentScreen, setCurrentScreen] = useState7(initialScreen);
+  const [searchParams, setSearchParams] = useState7();
   console.log("\u{1F504} CrudifyLoginInternal RENDER:", { currentScreen, initialScreen });
   React2.useEffect(() => {
     const urlParams = new URLSearchParams(window.location.search);
@@ -1356,7 +1364,7 @@ var CrudifyLogin = ({
 var CrudifyLogin_default = CrudifyLogin;
 
 // src/hooks/useUserProfile.ts
-import { useState as useState7, useEffect as useEffect6, useCallback, useRef as useRef2 } from "react";
+import { useState as useState8, useEffect as useEffect6, useCallback, useRef as useRef2 } from "react";
 import crudify2 from "@nocios/crudify-browser";
 
 // src/utils/jwtUtils.ts
@@ -1402,9 +1410,9 @@ var isTokenExpired = (token) => {
 // src/hooks/useUserProfile.ts
 var useUserProfile = (options = {}) => {
   const { autoFetch = true, retryOnError = false, maxRetries = 3 } = options;
-  const [userProfile, setUserProfile] = useState7(null);
-  const [loading, setLoading] = useState7(false);
-  const [error, setError] = useState7(null);
+  const [userProfile, setUserProfile] = useState8(null);
+  const [loading, setLoading] = useState8(false);
+  const [error, setError] = useState8(null);
   const abortControllerRef = useRef2(null);
   const mountedRef = useRef2(true);
   const requestIdRef = useRef2(0);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocios/crudify-ui",
-  "version": "1.0.63",
+  "version": "1.0.65",
   "description": "Biblioteca de componentes UI para Crudify",
   "author": "Nocios",
   "license": "MIT",