react-deepstream-rp-hoc

A deepstream React wrapper that exports Classes supporting Render Props and HOCs.

Usage

HOCs are actually implemented with Render Props so it is possible to use either depeneding on your preference.

$3

Application Component which logs into deepstream.
`` javascript
import {withDeepstream} from 'react-deepstream-rp-hoc';
class AppBase extends React.Component {
render () {
if (this.props.connected) {
return
} else {
return

Loading

}
}
}
let App = withDeepstream(AppBase)
`
Returns Base App Class wrapped with deepstream client. `this.props.connected` indicates client connection status. E.g.
`javascript

`

List Component loads Deepstream List of given 'ListName'.
` javascript
import {withDeepstreamList} from 'react-deepstream-rp-hoc';
class ListBase extends React.Component {
render() {
const entries = this.props.entries;
const records = entries.map( (record) =>

);
return

{records}


}
}
let List = withDeepstreamList(ListBase);
`
Returns Base List Class wrapped with deepstream list. E.g.
` javascript

`


Record Component loads Deepstream JSON document of given 'recordName'.
` javascript
import {withDeepstreamAnonRecord} from 'react-deepstream-rp-hoc';
class RecordBase extends React.Component {
render() {
return

{JSON.stringify(this.props.data)}


}
}
let Record = withDeepstreamAnonRecord(RecordBase);
`
Returns Base Document Class wrapped with deepstream anonymous record. E.g.
` javascript

`

$3

The same as above but using render props.

` javascript
import {
Deepstream,
DeepstreamList,
DeepstreamAnonRecord
} from 'react-deepstream-rp-hoc';
import React from 'react';

let config = {
"appUrl": "",
"authParams": {},
"listName": ""
}

class Record extends React.Component {
render() {
return render = { (record) =>


{JSON.stringify(record.data)}

}
/>
}
}

class List extends React.Component {
render() {
return render = { (list) =>

{
list.entries.map( (record) =>
)}

}
/>
}
}

class App extends React.Component {
render () {
return render = { (ds) =>
ds.connected
?
:

Loading ...

}
/>
}
}

export default App;
``