Function IsValid

app/src/isValid.tsx:17–105

()

  .required();

const IsValid: React.FC = () => {
  const { mode, defaultValues } = useParams();
  const isBuildInValidation = mode === 'build-in';
  const [show, setShow] = React.useState(true);
  const {
    register,
    handleSubmit,
    unregister,
    formState: { isValid },
  } = useForm<{
    firstName: string;
    lastName: string;
    hidden: string;
    age: string;
    location: string;
    select: string;
    radio: string;
    checkbox: string;
  }>({
    mode: 'onChange',
    ...(isBuildInValidation ? {} : { resolver: yupResolver(validationSchema) }),
    ...(defaultValues === 'defaultValues'
      ? {
          defaultValues: {
            firstName: 'test',
            lastName: 'test1',
          },
        }
      : {}),
  });

  React.useEffect(() => {
    if (isBuildInValidation) {
      if (show) {
        unregister('hidden');
      }
    } else {
      if (!show) {
        unregister('firstName');
      }
    }
  }, [show, isBuildInValidation, unregister]);

  renderCounter++;

  return (
    <form onSubmit={handleSubmit(() => {})}>
      {isBuildInValidation ? (
        <>
          <input {...register('location')} placeholder="location" />
          <input
            {...register('firstName', { required: true })}
            placeholder="firstName"
          />
          <input
            {...register('lastName', { required: true })}
            placeholder="lastName"
          />