lml-main/packages/cosmo-redux-pusher/README.md

This is now a mono repository published into many standalone packages.

# cosmo-redux-pusher
Redux integration for pusher

Please note this repos is designed to be used in conjunction with [@lml/cosmo-redux api](https://github.com/lastmilelink/cosmo-redux-api).


### Healthchecks

A system of healthchecks has been agreed with the backend team. This involves 2 distinct systems

Firstly explicit errors:

1. Every minute a metadata event is submitted on each channel
2. If the metadata event has an error count then a 'healthcheck error' action is diaptched
3. Inidivdual resources listen for these healthcheck errors and then manually reload their data

Secondly timeouts:

4. An interval periodically checks the timestamp of all the metadata objects in the state
5. If any channels have not received a metadata event recently then a 'healthcheck timeout' action is dispatched
6. Individual resources can also listen out for healthcheck timeouts and decide whether to reload or not

Using this system if a resource stops receiving push events then healthcheck timeouts will be periodically dispatched for this resource. In effect this amounts to polling for the resource.

### Usage

```tsx
import { combineEpics } from'redux-observable'
import {
    pusherConnect,
    cosmoPusherEpics,
    PUSHER_REDUCER_KEY,
    pusherReducers,
} from '@lml/cosmo-redux-pusher'
// yada yada, import other stuff...

const PUSHER_KEY = 'foo'
const PUSHER_CLUSTER = 'eu'

interface AppProps {
    pusherConnect: (key: string, cluster: string, options?: any) => void
}

class AppComponent extends React.Component<AppProps> {

    render() {
        return (
            <button onClick={this.startPusher}>start pusher</button>
        )
    }

    // dispatch an action to initiate the pusher connection
    private startPusher = () =>
        this.props.pusherConnect(
            PUSHER_KEY,
            PUSHER_CLUSTER
        )
}

const mapStateToProps = () => ({})
const mapDispatchToProps = { pusherConnect }

const AppContainer = connect(mapStateToProps, mapDispatchToProps)(AppComponent)

// most of the functionality is here inside cosmoPusherEpics
// add it into your rootEpic and then sit back and chill
const rootEpic = combineEpics(cosmoPusherEpics)

const rootReducer = combineReducers({
    [PUSHER_REDUCER_KEY]: pusherReducers
    // yada ydad, add reducers
})

const store = createStore(
    rootReducer,
    createEpicMiddleWare(rootEpic)
)

const App = () => (
    <Provider store={store}>
        <AppContainer />
    </Provider>
)

ReactDOM.render(<App />, document.getElementById('foo'))

```