cyclejs-community / one-fits-all

The one-fits-all flavor for create-cycle-app
MIT License
34 stars 8 forks source link

[Suggestion] Add a page to demonstrate HTTP #27

Open SteveALee opened 7 years ago

SteveALee commented 7 years ago

Another FAQ is using HTTP to fetch data so it would be good to add a 'Fetcher' component as a 3rd page.

Some code suggestions (assuming JSON payload)

    const request$ = action$.map(accessToken => ({
        url: <API_CALL>,
        method: 'get',
        category: 'request'
    }))

    const response$$ = HTTP.select('request-photos')
    const photos$ = response$$
        .map(response$ =>
            response$.replaceError((error: any) => {
                return xs.of(
                    error.response ? error.reponse : { error, body: {} }
                )
            })
        )
        .flatten()
        .map<Reducer>(({ error, body }) => state => ({
            ...state,
            error: error.message,
            body
        }))

function view(state$: Stream<State>): Stream<VNode> {
    return state$
        .map(state => (state.error ? state.error : state.body))
        .map(result =>
            <div>
               <div className="result">
                    {result}
                </div>
            </div>
        )
}