chore: onboarding workspace name valdiation error indicator added (#3808)

This commit is contained in:
Anmol Singh Bhatia 2024-02-27 16:56:40 +05:30 committed by GitHub
parent aba170dbde
commit c858b76054
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -62,6 +62,7 @@ export const UserDetails: React.FC<Props> = observer((props) => {
formState: { errors, isSubmitting, isValid }, formState: { errors, isSubmitting, isValid },
} = useForm<IUser>({ } = useForm<IUser>({
defaultValues, defaultValues,
mode: "onChange",
}); });
const onSubmit = async (formData: IUser) => { const onSubmit = async (formData: IUser) => {
@ -164,15 +165,16 @@ export const UserDetails: React.FC<Props> = observer((props) => {
)} )}
</button> </button>
<div className="flex flex-col gap-1">
<div className="my-2 mr-10 flex w-full rounded-md bg-onboarding-background-200 text-sm"> <div className="my-2 mr-10 flex w-full rounded-md bg-onboarding-background-200 text-sm">
<Controller <Controller
control={control} control={control}
name="first_name" name="first_name"
rules={{ rules={{
required: "First name is required", required: "Name is required",
maxLength: { maxLength: {
value: 24, value: 24,
message: "First name cannot exceed the limit of 24 characters", message: "Name must be within 24 characters.",
}, },
}} }}
render={({ field: { value, onChange, ref } }) => ( render={({ field: { value, onChange, ref } }) => (
@ -190,11 +192,12 @@ export const UserDetails: React.FC<Props> = observer((props) => {
hasError={Boolean(errors.first_name)} hasError={Boolean(errors.first_name)}
placeholder="Enter your full name..." placeholder="Enter your full name..."
className="w-full border-onboarding-border-100 focus:border-custom-primary-100" className="w-full border-onboarding-border-100 focus:border-custom-primary-100"
maxLength={24}
/> />
)} )}
/> />
</div> </div>
{errors.first_name && <span className="text-sm text-red-500">{errors.first_name.message}</span>}
</div>
</div> </div>
<div className="mb-10 mt-14"> <div className="mb-10 mt-14">
<Controller <Controller