How to handle async response when using useFormik() hook?

Question

I have a formik form with a hidden field (memberId).

The hidden field value will be coming from a store (searchStore). This is using mobx state manager.

Store value changes after receiving an API response. In this case, after searching a keyword.

Once API server returns a response, I need to pass a certain value ('memberId') to the hidden field.

My code below, I've used useEffect() to track the changes in the searchStore. The problem with it is the formik.onChange doesn't work or not triggered when the state changes.

formik.values updates ONLY after submitting the form.

How do I trigger formik.onChange when the store value changes? or how do i make reactive? Thanks in advance!

import React, { useEffect } from 'react';
import { useFormik } from 'formik';
import * as Yup from 'yup';

const NewForm = () => {
    const {searchStore} = useStore();
    const {searchResult} = searchStore;

    const formik = useFormik({
        initialValues: {
            memberId: undefined
        },
        validationSchema: Yup.object().shape({
            memberId: Yup.string().required('Please select a member.'),
        }),
        onSubmit: values => {
            alert(JSON.stringify(values, null, 2));
        }        
    });

    const {setFieldValue, setFieldTouched} = formik;

    useEffect(() => {
        setFieldValue('memberId', searchResult?.id)
        setFieldTouched('memberId',true)       
    }, [searchResult, setFieldTouched, setFieldValue])

  return (
        <>
            <SearchBarComponent />
            <form onSubmit={formik.handleSubmit}>
                <input type={'hidden'} 
                    name='memberId' 
                    id='memberId' 
                    value={formik.values.memberId || ''} 
                    onChange={formik.handleChange}
                    />

                { formik.initialTouched && formik.errors.memberId && (
                <div className="input-feedback">{formik.errors.memberId}</div>
                )}
            </form>
        </>
    
    );
};

export default NewForm