use-reactor.js

const initialState = {
    search: '',
};

function reducer(state, action) {
    switch (action.type) {
        case 'CHANGE':
            return {
                ...state,
                [action.name]: action.value
            };
    }
}

function useReactor(reaction, dispatch, inputs = []) {
    const { current: subject } = useRef(() => reaction(new Subject()));

    useEffect(() => {
        const sub = subject.subscribe(dispatch);

        return () => sub.unsubscribe();
    }, []);

    useEffect(() => {
        inputs.map(input => subject.next(input));
    }, inputs);

    return subject;
}

function Awesome() {
    const [state, dispatch] = useReducer(reducer, initialState);

    const handleChange = ({ name, value}) => {
        dispatch({ action: 'CHANGE', name, value, });
    };

    useReactor(value$ => (
        value$.pipe(
            // Whatever you want to do, but the end result will be passed to the dispatch callback.
        )
    ), dispatch, [state.search]);

    return (
        <input type="text" name="search" value={state.search} onChange={handleChange} />
    );
}