|
1
|
|
|
import { compose, branch, renderComponent, renderNothing } from 'recompose'; |
|
2
|
|
|
import { graphql } from 'react-apollo'; |
|
3
|
|
|
import { connect } from 'react-redux'; |
|
4
|
|
|
import { merge, head } from 'ramda'; |
|
5
|
|
|
import { getGithubActivity } from 'services/graphQLQuery'; |
|
6
|
|
|
import MainFeedComponent from 'components/MainFeedComponent'; |
|
7
|
|
|
import SpinnerComponent from 'components/SpinnerComponent'; |
|
8
|
|
|
import ErrorComponent from 'components/ErrorComponent'; |
|
9
|
|
|
|
|
10
|
|
|
const isLoading = ({ activity }) => activity.loading; |
|
11
|
|
|
const hasError = ({ activity }) => activity.error; |
|
12
|
|
|
const hasNoData = ({ activity }) => !activity; |
|
13
|
|
|
|
|
14
|
|
|
const nonOptimalStates = states => |
|
15
|
|
|
compose(...states.map(state => branch(state.when, renderComponent(state.render)))); |
|
16
|
|
|
|
|
17
|
|
|
export default compose( |
|
18
|
|
|
connect(), |
|
19
|
|
|
graphql(getGithubActivity, { |
|
20
|
|
|
name: `activity`, |
|
21
|
|
|
options: { |
|
22
|
|
|
variables: { |
|
23
|
|
|
cursor: null, |
|
24
|
|
|
}, |
|
25
|
|
|
}, |
|
26
|
|
|
props: ({ activity }) => ({ |
|
27
|
|
|
activity, |
|
28
|
|
|
loadOlderMessages: () => |
|
29
|
|
|
activity.fetchMore({ |
|
30
|
|
|
variables: { |
|
31
|
|
|
cursor: head(activity.user.following.edges).cursor, |
|
32
|
|
|
}, |
|
33
|
|
|
updateQuery(previousResult, { fetchMoreResult }) { |
|
34
|
|
|
if (fetchMoreResult.user.following.nodes.length) { |
|
35
|
|
|
return merge(previousResult, fetchMoreResult); |
|
36
|
|
|
} |
|
37
|
|
|
return previousResult; |
|
38
|
|
|
}, |
|
39
|
|
|
}), |
|
40
|
|
|
}), |
|
41
|
|
|
}), |
|
42
|
|
|
nonOptimalStates([ |
|
43
|
|
|
{ when: hasNoData, render: renderNothing() }, |
|
44
|
|
|
{ when: hasError, render: ErrorComponent }, |
|
45
|
|
|
{ when: isLoading, render: SpinnerComponent }, |
|
46
|
|
|
]), |
|
47
|
|
|
)(MainFeedComponent); |
|
48
|
|
|
|