RxJS with React Hook

rxjs-hooks.js

function createSearchSubject() {
    return (new Subject()).pipe(
        // Whatever you want to do, but the end result should be an action object.
    )
}

const initialState = {
    search: '',
};

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

function Awesome() {
    const { current: subject } = useRef(() => createSearchSubject());
    const [state, dispatch] = useReducer(reducer, initialState);

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

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

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

    useEffect(() => {
        subject.next(state.search);
    }, [state.search]);

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