Skip to content

Commit

Permalink
Fix issue in OTP field adapter
Browse files Browse the repository at this point in the history
  • Loading branch information
NipuniBhagya committed Dec 11, 2024
1 parent 8abc0c8 commit e7687ea
Showing 1 changed file with 2 additions and 9 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -21,20 +21,16 @@ import PropTypes from "prop-types";
import React, { useEffect, useState } from "react";
import { useTranslations } from "../../hooks/use-translations";
import { getTranslationByKey } from "../../utils/i18n-utils";
import ValidationCriteria from "../field-validation";

const OTPFieldAdapter = ({ component, formState, formStateHandler, otpLength = 6 }) => {
const OTPFieldAdapter = ({ component, formStateHandler, otpLength = 6 }) => {

const { label, required, styles, validation } = component.properties;
const { errors } = formState;
const fieldErrors = errors && errors.filter(error => error.field === component.properties.name);
const { label, required, styles } = component.properties;

const { translations } = useTranslations();

const [ otpValues, setOtpValues ] = useState(Array(otpLength).fill(""));

useEffect(() => {
// Join all OTP fields to form the complete OTP value
formStateHandler(component.properties.name, otpValues.join(""));
}, [ otpValues ]);

Expand Down Expand Up @@ -125,9 +121,6 @@ const OTPFieldAdapter = ({ component, formState, formStateHandler, otpLength = 6
/>
</div>
) }
{ validation && (
<ValidationCriteria validationConfig={ validation } errors={ fieldErrors } value={ otpValues } />
) }
</div>
);
};
Expand Down

0 comments on commit e7687ea

Please sign in to comment.