datastake-daf 0.6.565 → 0.6.566

package/dist/components/index.js

@@ -40514,6 +40514,9 @@ function AuthForm(_ref) {
   const [currentStep, setCurrentStep] = React.useState(0);
   const [allFormValues, setAllFormValues] = React.useState(initialValues);
   const [formErrors, setFormErrors] = React.useState(null);
+  console.log({
+    errors
+  });
   const isMultiStep = !!steps;
   const currentFields = isMultiStep ? steps === null || steps === void 0 || (_steps$currentStep = steps[currentStep]) === null || _steps$currentStep === void 0 ? void 0 : _steps$currentStep.fields : fields || [];
   React.useEffect(() => {
@@ -40542,16 +40545,21 @@ function AuthForm(_ref) {
   };
   const prev = () => setCurrentStep(prev => prev - 1);
   const handleSubmit = async values => {
-    const token = await handleReCaptchaVerify();
-    if (!token) {
-      console.error('reCAPTCHA verification failed');
-      return;
+    try {
+      await formInstance.validateFields();
+      const token = await handleReCaptchaVerify();
+      if (!token) {
+        console.error('reCAPTCHA verification failed');
+        return;
+      }
+      setFormErrors(null);
+      if (!isMultiStep) return onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(values);
+      if (currentStep < (steps === null || steps === void 0 ? void 0 : steps.length) - 1) return next();
+      const finalValues = _objectSpread2(_objectSpread2({}, allFormValues), values);
+      onSubmit === null || onSubmit === void 0 || onSubmit(finalValues);
+    } catch (err) {
+      console.error("Validation failed:", err);
     }
-    setFormErrors(null);
-    if (!isMultiStep) return onSubmit === null || onSubmit === void 0 ? void 0 : onSubmit(values);
-    if (currentStep < (steps === null || steps === void 0 ? void 0 : steps.length) - 1) return next();
-    const finalValues = _objectSpread2(_objectSpread2({}, allFormValues), values);
-    onSubmit === null || onSubmit === void 0 || onSubmit(finalValues);
   };
   const checkRequiredFieldsFilled = (changedValues, allValues) => {
     const requiredFields = currentFields.filter(f => f.required).map(f => f.name);
@@ -40563,27 +40571,6 @@ function AuthForm(_ref) {
   React.useEffect(() => {
     setFormErrors(errors);
   }, [errors]);
-  const renderErrors = (err, t) => {
-    const generalErrors = [];
-    Object.keys(err).forEach(key => {
-      const isFieldError = currentFields.some(field => field.name === key);
-      if (isFieldError) {
-        formInstance.setFields([{
-          name: key,
-          errors: err[key]
-        }]);
-      } else {
-        generalErrors.push(...err[key].map(error => /*#__PURE__*/jsxRuntime.jsx("div", {
-          className: "ant-form-item-explain errors-cont",
-          style: {
-            color: '#ff4d4f'
-          },
-          children: t(error)
-        }, "".concat(key, "-").concat(error))));
-      }
-    });
-    return generalErrors;
-  };
   const renderField = field => {
     var _field$options;
     const rules = [...(field.required ? [{
@@ -40644,7 +40631,7 @@ function AuthForm(_ref) {
       layout: "vertical",
       initialValues: initialValues,
       onFinish: handleSubmit,
-      children: [currentFields.map(renderField), formErrors ? renderErrors(formErrors, t) : null, isMultiStep && currentStep > 0 ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+      children: [currentFields.map(renderField), isMultiStep && currentStep > 0 ? /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "flex flex-column gap-2",
         style: {
           width: '100%'

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.565",
+	"version": "0.6.566",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/AuthForm/index.jsx

@@ -18,6 +18,8 @@ function AuthForm ({
   const [allFormValues, setAllFormValues] = useState(initialValues);
   const [formErrors, setFormErrors] = useState(null);
 
+  console.log({errors})
+
   const isMultiStep = !!steps;
   const currentFields = isMultiStep ? steps?.[currentStep]?.fields : fields || [];
 
@@ -54,18 +56,26 @@ function AuthForm ({
   const prev = () => setCurrentStep((prev) => prev - 1);
 
   const handleSubmit = async (values) => {
-    const token = await handleReCaptchaVerify();
-    if (!token) {
-      console.error('reCAPTCHA verification failed');
-      return;
-    }
-    setFormErrors(null);
-    if (!isMultiStep) return onSubmit?.(values);
+    try {
+      await formInstance.validateFields();
 
-    if (currentStep < steps?.length - 1) return next();
-    
-    const finalValues = { ...allFormValues, ...values };
-    onSubmit?.(finalValues);
+      const token = await handleReCaptchaVerify();
+      if (!token) {
+        console.error('reCAPTCHA verification failed');
+        return;
+      }
+      
+      setFormErrors(null);
+      
+      if (!isMultiStep) return onSubmit?.(values);
+
+      if (currentStep < steps?.length - 1) return next();
+      
+      const finalValues = { ...allFormValues, ...values };
+      onSubmit?.(finalValues);
+    } catch (err) {
+      console.error("Validation failed:", err);
+    }
   };
 
   const checkRequiredFieldsFilled = (changedValues, allValues) => {
@@ -81,29 +91,18 @@ function AuthForm ({
   }, [errors]);
 
   const renderErrors = (err, t) => {
-    const generalErrors = [];
-    
-    Object.keys(err).forEach(key => {
-      const isFieldError = currentFields.some(field => field.name === key);
-      
-      if (isFieldError) {
-        formInstance.setFields([{
-          name: key,
-          errors: err[key]
-        }]);
-      } else {
-        generalErrors.push(...err[key].map(error =>
-          <div
-            key={`${key}-${error}`}
-            className="ant-form-item-explain errors-cont"
-            style={{ color: '#ff4d4f' }}>
-            {t(error)}
-          </div>
-        ));
-      }
+    document.querySelectorAll('.ant-form-item')
+      .forEach(input => input.classList.add('ant-form-item-has-error'))
+    return Object.keys(err).map(key => {
+      return err[key].map(error =>
+        <div
+          key={error}
+          className="ant-form-item-explain errors-cont"
+          style={{ color: '#ff4d4f' }}>
+          {t(error)}
+        </div>
+      )
     });
-    
-    return generalErrors;
   }
 
   const renderField = (field) => {
@@ -163,9 +162,9 @@ function AuthForm ({
             {currentFields.map(renderField)}
 
 
-        {formErrors ? (
+        {/* {formErrors ? (
             renderErrors(formErrors, t)
-        ) : null}
+        ) : null} */}
 
         {isMultiStep && currentStep > 0 ? (
             <div className="flex flex-column gap-2" style={{ width: '100%' }}>