Skip to content

Commit 8df41d6

Browse files
lorensrlorensr
committed
Update apollo; add unsubscribe feature
1 parent 7d0720e commit 8df41d6

14 files changed

+590
-339
lines changed

‎.nvmrc

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
8

‎package-lock.json

+370-153
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+15-11
Original file line numberDiff line numberDiff line change
@@ -3,20 +3,24 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6+
"@apollo/react-components": "^3.1.5",
7+
"@apollo/react-hoc": "^3.1.5",
8+
"@apollo/react-hooks": "^3.1.5",
69
"@fortawesome/fontawesome": "^1.1.8",
710
"@fortawesome/fontawesome-free-brands": "^5.0.13",
811
"@fortawesome/fontawesome-free-solid": "^5.0.13",
912
"@fortawesome/react-fontawesome": "0.0.20",
13+
"@types/react": "^16.9.35",
1014
"ajv": "^6.5.0",
11-
"apollo-cache-inmemory": "^1.0.0",
12-
"apollo-client": "^2.2.7",
13-
"apollo-link": "^1.0.7",
15+
"apollo-cache-inmemory": "^1.6.6",
16+
"apollo-client": "^2.6.10",
17+
"apollo-link": "^1.2.14",
1418
"apollo-link-context": "^1.0.3",
1519
"apollo-link-error": "^1.0.5",
16-
"apollo-link-http": "^1.0.0",
20+
"apollo-link-http": "^1.5.17",
1721
"apollo-link-state": "^0.4.0",
1822
"apollo-link-ws": "^1.0.1",
19-
"apollo-utilities": "^1.0.3",
23+
"apollo-utilities": "^1.3.4",
2024
"auth0-helpers": "^0.4.2",
2125
"auth0-js": "^9.13.2",
2226
"canvas-confetti": "0.0.3",
@@ -25,17 +29,17 @@
2529
"cloudinary-react": "^1.0.6",
2630
"date-fns": "^1.29.0",
2731
"formik": "^0.11.11",
28-
"graphql": "^0.13.2",
32+
"graphql": "^14.6.0",
2933
"graphql-anywhere": "^4.1.1",
30-
"graphql-tag": "^2.5.0",
34+
"graphql-tag": "^2.10.3",
3135
"history": "^4.7.2",
3236
"lodash": "^4.17.4",
3337
"logrocket": "^0.6.12",
3438
"material-ui": "1.0.0-beta.34",
3539
"material-ui-icons": "1.0.0-beta.17",
36-
"react": "^16.4.1",
37-
"react-apollo": "^2.1.6",
38-
"react-dom": "^16.4.1",
40+
"react": "^16.13.1",
41+
"react-apollo": "^3.1.5",
42+
"react-dom": "^16.13.1",
3943
"react-ga": "^2.5.3",
4044
"react-loading-skeleton": "^0.3.2",
4145
"react-markdown": "^3.3.0",
@@ -50,7 +54,7 @@
5054
"revalidate": "^1.2.0",
5155
"scroll-into-view-if-needed": "^2.2.0",
5256
"serve": "^9.1.0",
53-
"subscriptions-transport-ws": "^0.9.7",
57+
"subscriptions-transport-ws": "^0.9.16",
5458
"typed.js": "^2.0.6"
5559
},
5660
"scripts": {

‎src/components/App.js

+5-3
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import PropTypes from 'prop-types'
55

66
import Landing from './landing/Landing'
77
import Paypal from './landing/Paypal'
8+
import Unsubscribe from './Unsubscribe'
89
import Terms from './landing/Terms'
910
import Privacy from './landing/Privacy'
1011
import Tshirt from './landing/Tshirt'
@@ -41,6 +42,7 @@ class App extends Component {
4142
path="/paypal/:package?"
4243
render={() => <Paypal {...authProps} />}
4344
/>
45+
<Route path="/unsubscribe/:token" render={() => <Unsubscribe />} />
4446
<Route
4547
exact
4648
path="/welcome"
@@ -71,8 +73,8 @@ class App extends Component {
7173
path="/team/:token"
7274
render={({
7375
match: {
74-
params: { token }
75-
}
76+
params: { token },
77+
},
7678
}) => <Team {...authProps} urlToken={token} />}
7779
/>
7880
<Route
@@ -95,7 +97,7 @@ App.propTypes = {
9597
user: PropTypes.object,
9698
login: PropTypes.func.isRequired,
9799
logout: PropTypes.func.isRequired,
98-
loading: PropTypes.bool.isRequired
100+
loading: PropTypes.bool.isRequired,
99101
}
100102

101103
export default withAuth(App)

‎src/components/Review.js

+29-24
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,14 @@ import times from 'lodash/times'
1515
import remove from 'lodash/remove'
1616
import find from 'lodash/find'
1717
import gql from 'graphql-tag'
18-
import { graphql, compose } from 'react-apollo'
18+
import { graphql } from 'react-apollo'
19+
import compose from 'recompose/compose'
1920
import { propType } from 'graphql-anywhere'
2021
import Dialog, {
2122
DialogActions,
2223
DialogContent,
2324
DialogContentText,
24-
DialogTitle
25+
DialogTitle,
2526
} from 'material-ui/Dialog'
2627
import Button from 'material-ui/Button'
2728
import Modal from 'material-ui/Modal'
@@ -32,19 +33,23 @@ import { REVIEW_ENTRY, REVIEWS_QUERY } from '../graphql/Review'
3233

3334
const StarRating = ({ rating }) => (
3435
<div>
35-
{times(rating, i => <StarIcon key={i} />)}
36-
{times(5 - rating, i => <StarBorderIcon key={i} />)}
36+
{times(rating, (i) => (
37+
<StarIcon key={i} />
38+
))}
39+
{times(5 - rating, (i) => (
40+
<StarBorderIcon key={i} />
41+
))}
3742
</div>
3843
)
3944

4045
class Review extends Component {
4146
state = {
4247
anchorEl: null,
4348
deleteConfirmationOpen: false,
44-
editing: false
49+
editing: false,
4550
}
4651

47-
openMenu = event => {
52+
openMenu = (event) => {
4853
this.setState({ anchorEl: event.currentTarget })
4954
}
5055

@@ -72,7 +77,7 @@ class Review extends Component {
7277

7378
delete = () => {
7479
this.closeDeleteConfirmation()
75-
this.props.delete(this.props.review.id).catch(e => {
80+
this.props.delete(this.props.review.id).catch((e) => {
7681
if (find(e.graphQLErrors, { message: 'unauthorized' })) {
7782
alert('👮‍♀️✋ You can only delete your own reviews!')
7883
}
@@ -81,18 +86,18 @@ class Review extends Component {
8186

8287
toggleFavorite = () => {
8388
const {
84-
review: { id, favorited }
89+
review: { id, favorited },
8590
} = this.props
8691
this.props.favorite(id, !favorited)
8792
}
8893

8994
render() {
9095
const {
9196
review: { text, stars, createdAt, favorited, author },
92-
user
97+
user,
9398
} = this.props
9499

95-
const linkToProfile = child => (
100+
const linkToProfile = (child) => (
96101
<a
97102
href={`https://github.com/${author.username}`}
98103
target="_blank"
@@ -181,7 +186,7 @@ class Review extends Component {
181186
Review.propTypes = {
182187
review: propType(REVIEW_ENTRY).isRequired,
183188
favorite: PropTypes.func.isRequired,
184-
user: PropTypes.object
189+
user: PropTypes.object,
185190
}
186191

187192
const FAVORITE_REVIEW_MUTATION = gql`
@@ -213,10 +218,10 @@ const withFavoriteMutation = graphql(FAVORITE_REVIEW_MUTATION, {
213218
favoriteReview: {
214219
__typename: 'Review',
215220
id,
216-
favorited: favorite
217-
}
221+
favorited: favorite,
222+
},
218223
},
219-
update: store => {
224+
update: (store) => {
220225
const data = store.readQuery({ query: READ_USER_FAVORITES })
221226

222227
if (favorite) {
@@ -226,9 +231,9 @@ const withFavoriteMutation = graphql(FAVORITE_REVIEW_MUTATION, {
226231
}
227232

228233
store.writeQuery({ query: READ_USER_FAVORITES, data })
229-
}
230-
})
231-
})
234+
},
235+
}),
236+
}),
232237
})
233238

234239
const DELETE_REVIEW_MUTATION = gql`
@@ -239,16 +244,16 @@ const DELETE_REVIEW_MUTATION = gql`
239244

240245
const withDeleteMutation = graphql(DELETE_REVIEW_MUTATION, {
241246
props: ({ mutate }) => ({
242-
delete: id =>
247+
delete: (id) =>
243248
mutate({
244249
variables: { id },
245250
optimisticResponse: {
246-
removeReview: true
251+
removeReview: true,
247252
},
248-
update: store => {
253+
update: (store) => {
249254
const query = {
250255
query: REVIEWS_QUERY,
251-
variables: { limit: 10, orderBy: 'createdAt_DESC' }
256+
variables: { limit: 10, orderBy: 'createdAt_DESC' },
252257
}
253258

254259
let data = store.readQuery(query)
@@ -266,9 +271,9 @@ const withDeleteMutation = graphql(DELETE_REVIEW_MUTATION, {
266271
data = store.readQuery({ query: READ_USER_FAVORITES })
267272
remove(data.currentUser.favoriteReviews, { id })
268273
store.writeQuery({ query: READ_USER_FAVORITES, data })
269-
}
270-
})
271-
})
274+
},
275+
}),
276+
}),
272277
})
273278

274279
export default compose(withFavoriteMutation, withDeleteMutation)(Review)

‎src/components/ReviewForm.js

+24-26
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,8 @@ import TextField from 'material-ui/TextField'
66
import StarIcon from 'material-ui-icons/Star'
77
import StarBorderIcon from 'material-ui-icons/StarBorder'
88
import gql from 'graphql-tag'
9-
import { graphql, compose } from 'react-apollo'
9+
import { graphql } from 'react-apollo'
10+
import compose from 'recompose/compose'
1011
import classNames from 'classnames'
1112
import pick from 'lodash/pick'
1213

@@ -26,19 +27,19 @@ class ReviewForm extends Component {
2627
this.state = {
2728
text: review ? review.text : '',
2829
stars: review ? review.stars : null,
29-
errorText: null
30+
errorText: null,
3031
}
3132
}
3233

33-
updateText = event => {
34+
updateText = (event) => {
3435
this.setState({ text: event.target.value })
3536
}
3637

37-
updateStars = stars => {
38+
updateStars = (stars) => {
3839
this.setState({ stars })
3940
}
4041

41-
handleSubmit = event => {
42+
handleSubmit = (event) => {
4243
event.preventDefault()
4344
const { text, stars } = this.state
4445

@@ -112,15 +113,15 @@ ReviewForm.propTypes = {
112113
user: PropTypes.shape({
113114
name: PropTypes.string.isRequired,
114115
photo: PropTypes.string.isRequired,
115-
username: PropTypes.string.isRequired
116+
username: PropTypes.string.isRequired,
116117
}),
117118
addReview: PropTypes.func.isRequired,
118119
editReview: PropTypes.func.isRequired,
119120
review: PropTypes.shape({
120121
id: PropTypes.string.isRequired,
121122
text: PropTypes.string,
122-
stars: PropTypes.number
123-
})
123+
stars: PropTypes.number,
124+
}),
124125
}
125126

126127
const ADD_REVIEW_MUTATION = gql`
@@ -137,7 +138,7 @@ const withAddReview = graphql(ADD_REVIEW_MUTATION, {
137138
addReview: (text, stars) => {
138139
mutate({
139140
variables: {
140-
input: { text, stars }
141+
input: { text, stars },
141142
},
142143
optimisticResponse: {
143144
createReview: {
@@ -152,23 +153,23 @@ const withAddReview = graphql(ADD_REVIEW_MUTATION, {
152153
'id',
153154
'name',
154155
'photo',
155-
'username'
156-
])
157-
}
156+
'username',
157+
]),
158+
},
158159
},
159160
update: (store, { data: { createReview: newReview } }) => {
160161
const query = {
161162
query: REVIEWS_QUERY,
162-
variables: { limit: 10, orderBy: 'createdAt_DESC' }
163+
variables: { limit: 10, orderBy: 'createdAt_DESC' },
163164
}
164165

165166
const data = store.readQuery(query)
166167
data.reviews.unshift(newReview)
167168
store.writeQuery({ ...query, data })
168-
}
169+
},
169170
})
170-
}
171-
})
171+
},
172+
}),
172173
})
173174

174175
const EDIT_REVIEW_MUTATION = gql`
@@ -187,23 +188,20 @@ const withEditReview = graphql(EDIT_REVIEW_MUTATION, {
187188
mutate({
188189
variables: {
189190
id,
190-
input: { text, stars }
191+
input: { text, stars },
191192
},
192193
optimisticResponse: {
193194
updateReview: {
194195
__typename: 'Review',
195196
id,
196197
text,
197198
stars,
198-
favorite: true
199-
}
200-
}
199+
favorite: true,
200+
},
201+
},
201202
})
202-
}
203-
})
203+
},
204+
}),
204205
})
205206

206-
export default compose(
207-
withAddReview,
208-
withEditReview
209-
)(ReviewForm)
207+
export default compose(withAddReview, withEditReview)(ReviewForm)

0 commit comments

Comments
 (0)