How to reset other values when one is introduced in React with react-hook-form

register returns an object with below structure:

{ 
  onChange: function(){},
  onBlur: function(){},
  ref: function(){}
}

At the moment you are just passing the object which has returned from register function, but you can add some other functionality to your inputs’ onChange like below example (here we reset one another field in the form by calling resetField):

const Input = React.forwardRef(({ inputId, ...otherProps }, ref) => {
  return <input id={inputId} ref={ref} {...otherProps} />;
});

const schema = yup.object().shape(
  {
    second: yup
      .number()
      .nullable()
      .transform((value, originalValue) =>
        String(originalValue).trim() === '' ? null : value
      ),
    minute: yup
      .number()
      .nullable()
      .transform((value, originalValue) =>
        String(originalValue).trim() === '' ? null : value
      ),
    triggerName: yup.string().required(),
  }
);

function TestForm() {
  const {
    handleSubmit,
    register,
    formState: { errors },
    resetField,
  } = useForm({
    resolver: yupResolver(schema),
  });

  console.log(errors);

  const onSubmit = (data) => {
    if (!data.minute && !data.second) {
      alert('on of minute or second field must has value');
      return false;
    }
    alert('success');
    console.log(data);
  };

  const { onChange: onSecondChange, ...secodField } = register('second');
  const { onChange: onMinuteChange, ...minuteField } = register('minute');

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <Input
          inputId="second"
          type="number"
          {...secodField}
          onChange={(e) => {
            onSecondChange(e);
            resetField('minute');
          }}
        />
      <Input
        inputId="minute"
        type="number"
        {...minuteField}
        onChange={(e) => {
          onMinuteChange(e);
          resetField('second');
        }}
      />
      <Input
        inputId="trigger-name"
        label="triggerName"
        {...register('triggerName')}
      />
      <input type="submit" value="submit" />
    </form>
  );
}

I’ve validated to minute or second has value in the onSubmit function because I don’t know exactly your business about filling both or one of them, but if you want you can handle this validation by yup by using of when method or by defining some custom rule on your schema.