Skip to content
This repository was archived by the owner on Feb 10, 2020. It is now read-only.

Commit 885d992

Browse files
ekonstantinidisekonstantinidis
authored
Merge pull request #18 from ekonstantinidis/use-thunk
Prepare redux-thunk
2 parents 67b3daa + 111f0d2 commit 885d992

File tree

8 files changed

+192
-91
lines changed

8 files changed

+192
-91
lines changed

‎App/Actions/index.js

Lines changed: 155 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
import {CALL_API, getJSON} from 'redux-api-middleware';
2-
3-
41
// Settings
52

63
export const APP_LOADED = 'APP_LOADED';
@@ -25,25 +22,51 @@ export function updateSetting(setting, value) {
2522
export const FETCH_TOKEN_REQUEST = 'FETCH_TOKEN_REQUEST';
2623
export const FETCH_TOKEN_SUCCESS = 'FETCH_TOKEN_SUCCESS';
2724
export const FETCH_TOKEN_FAILURE = 'FETCH_TOKEN_FAILURE';
28-
export function fetchToken(data) {
25+
26+
export function fetchTokenRequest() {
2927
return {
30-
[CALL_API]: {
31-
endpoint: 'https://github.com/login/oauth/access_token',
28+
type: FETCH_TOKEN_REQUEST
29+
};
30+
};
31+
32+
export function fetchTokenSuccess(payload) {
33+
return {
34+
type: FETCH_TOKEN_SUCCESS,
35+
payload
36+
};
37+
};
38+
39+
export function fetchTokenFailure() {
40+
return {
41+
type: FETCH_TOKEN_FAILURE
42+
};
43+
};
44+
45+
export function fetchToken(data) {
46+
return (dispatch, getState) => {
47+
dispatch(fetchTokenRequest());
48+
49+
return fetch('https://github.com/login/oauth/access_token', {
3250
method: 'POST',
3351
headers: {
3452
'Accept': 'application/json',
3553
'Content-Type': 'application/json',
3654
'Cache-Control': 'no-cache'
3755
},
38-
body: JSON.stringify(data),
39-
types: [FETCH_TOKEN_REQUEST, {
40-
type: FETCH_TOKEN_SUCCESS,
41-
payload: (action, state, res) => getJSON(res)
42-
}, {
43-
type: FETCH_TOKEN_FAILURE,
44-
payload: (action, state, res) => getJSON(res)
45-
}]
46-
}
56+
body: JSON.stringify(data)
57+
})
58+
.then(response => {
59+
if (!response.ok) {
60+
throw Error(response.statusText);
61+
}
62+
return response.json();
63+
})
64+
.then(json => {
65+
dispatch(fetchTokenSuccess(json));
66+
})
67+
.catch(error => {
68+
dispatch(fetchTokenFailure());
69+
});
4770
};
4871
};
4972

@@ -60,32 +83,54 @@ export function logout() {
6083
export const FETCH_NOTIFICATIONS_REQUEST = 'FETCH_NOTIFICATIONS_REQUEST';
6184
export const FETCH_NOTIFICATIONS_SUCCESS = 'FETCH_NOTIFICATIONS_SUCCESS';
6285
export const FETCH_NOTIFICATIONS_FAILURE = 'FETCH_NOTIFICATIONS_FAILURE';
63-
export function fetchNotifications(isReFetching = false) {
86+
87+
export function fetchNotificationsRequest(isReFetching) {
88+
return {
89+
type: FETCH_NOTIFICATIONS_REQUEST,
90+
meta: {
91+
isReFetching
92+
}
93+
};
94+
};
95+
96+
export function fetchNotificationsSuccess(payload) {
6497
return {
65-
[CALL_API]: {
66-
endpoint: 'https://api.github.com/notifications',
98+
type: FETCH_NOTIFICATIONS_SUCCESS,
99+
payload
100+
};
101+
};
102+
103+
export function fetchNotificationsFailure() {
104+
return {
105+
type: FETCH_NOTIFICATIONS_FAILURE
106+
};
107+
};
108+
109+
export function fetchNotifications(isReFetching = false) {
110+
return (dispatch, getState) => {
111+
dispatch(fetchNotificationsRequest(isReFetching));
112+
const token = 'token ' + getState().auth.get('token');
113+
return fetch('https://api.github.com/notifications', {
67114
method: 'GET',
68115
headers: {
69116
'Accept': 'application/json',
117+
'Authorization': token,
70118
'Content-Type': 'application/json',
71119
'Cache-Control': 'no-cache'
72120
},
73-
types: [
74-
{
75-
type: FETCH_NOTIFICATIONS_REQUEST,
76-
meta: { isReFetching }
77-
},
78-
{
79-
type: FETCH_NOTIFICATIONS_SUCCESS,
80-
meta: { isReFetching },
81-
payload: (action, state, res) => getJSON(res)
82-
},
83-
{
84-
type: FETCH_NOTIFICATIONS_FAILURE,
85-
meta: { isReFetching }
86-
}
87-
]
88-
}
121+
})
122+
.then(response => {
123+
if (!response.ok) {
124+
throw Error(response.statusText);
125+
}
126+
return response.json();
127+
})
128+
.then(json => {
129+
dispatch(fetchNotificationsSuccess(json));
130+
})
131+
.catch(error => {
132+
dispatch(fetchNotificationsFailure());
133+
});
89134
};
90135
};
91136

@@ -95,29 +140,51 @@ export function fetchNotifications(isReFetching = false) {
95140
export const MARK_NOTIFICATION_REQUEST = 'MARK_NOTIFICATION_REQUEST';
96141
export const MARK_NOTIFICATION_SUCCESS = 'MARK_NOTIFICATION_SUCCESS';
97142
export const MARK_NOTIFICATION_FAILURE = 'MARK_NOTIFICATION_FAILURE';
98-
export function markNotification(id) {
143+
144+
export function markNotificationRequest() {
99145
return {
100-
[CALL_API]: {
101-
endpoint: `https://api.github.com/notifications/threads/${id}`,
102-
method: 'PATCH',
146+
type: MARK_NOTIFICATION_REQUEST
147+
};
148+
};
149+
150+
export function markNotificationSuccess(id) {
151+
return {
152+
type: MARK_NOTIFICATION_SUCCESS,
153+
id
154+
};
155+
};
156+
157+
export function markNotificationFailure() {
158+
return {
159+
type: MARK_NOTIFICATION_FAILURE
160+
};
161+
};
162+
163+
export function markNotification(id) {
164+
return (dispatch, getState) => {
165+
dispatch(markNotificationRequest());
166+
const token = 'token ' + getState().auth.get('token');
167+
return fetch(`https://api.github.com/notifications/threads/${id}`, {
168+
method: 'GET',
103169
headers: {
104170
'Accept': 'application/json',
171+
'Authorization': token,
105172
'Content-Type': 'application/json',
106173
'Cache-Control': 'no-cache'
107174
},
108-
types: [
109-
{
110-
type: MARK_NOTIFICATION_REQUEST
111-
},
112-
{
113-
type: MARK_NOTIFICATION_SUCCESS,
114-
meta: { id }
115-
},
116-
{
117-
type: MARK_NOTIFICATION_FAILURE
118-
}
119-
]
120-
}
175+
})
176+
.then(response => {
177+
if (!response.ok) {
178+
throw Error(response.statusText);
179+
}
180+
return response.json();
181+
})
182+
.then(json => {
183+
dispatch(markNotificationSuccess(json.id));
184+
})
185+
.catch(error => {
186+
dispatch(markNotificationFailure());
187+
});
121188
};
122189
};
123190

@@ -127,29 +194,49 @@ export function markNotification(id) {
127194
export const MARK_REPO_NOTIFICATION_REQUEST = 'MARK_REPO_NOTIFICATION_REQUEST';
128195
export const MARK_REPO_NOTIFICATION_SUCCESS = 'MARK_REPO_NOTIFICATION_SUCCESS';
129196
export const MARK_REPO_NOTIFICATION_FAILURE = 'MARK_REPO_NOTIFICATION_FAILURE';
130-
export function markRepoNotifications(loginId, repoId, repoFullName) {
197+
198+
199+
export function markRepoNotificationsRequest() {
200+
return {
201+
type: MARK_REPO_NOTIFICATION_REQUEST
202+
};
203+
};
204+
205+
export function markRepoNotificationsSuccess(repoFullName) {
206+
return {
207+
type: MARK_REPO_NOTIFICATION_SUCCESS,
208+
repoFullName
209+
};
210+
};
211+
212+
export function markRepoNotificationsFailure() {
131213
return {
132-
[CALL_API]: {
133-
endpoint: `https://api.github.com/repos/${loginId}/${repoId}/notifications`,
214+
type: MARK_REPO_NOTIFICATION_FAILURE
215+
};
216+
};
217+
218+
export function markRepoNotifications(loginId, repoId, repoFullName) {
219+
return (dispatch, getState) => {
220+
dispatch(markRepoNotificationsRequest());
221+
const token = 'token ' + getState().auth.get('token');
222+
return fetch(`https://api.github.com/repos/${loginId}/${repoId}/notifications`, {
134223
method: 'PUT',
135224
headers: {
136225
'Accept': 'application/json',
226+
'Authorization': token,
137227
'Content-Type': 'application/json'
138228
},
139-
body: JSON.stringify({}),
140-
types: [
141-
{
142-
type: MARK_REPO_NOTIFICATION_REQUEST
143-
},
144-
{
145-
type: MARK_REPO_NOTIFICATION_SUCCESS,
146-
meta: { repoFullName }
147-
},
148-
{
149-
type: MARK_REPO_NOTIFICATION_FAILURE
150-
}
151-
]
152-
}
229+
body: JSON.stringify({})
230+
})
231+
.then(response => {
232+
if (!response.ok) {
233+
throw Error(response.statusText);
234+
}
235+
dispatch(markRepoNotificationsSuccess(repoFullName));
236+
})
237+
.catch(error => {
238+
dispatch(markRepoNotificationsFailure());
239+
});
153240
};
154241
};
155242

‎App/Components/ErrorPage.js

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,8 @@ const styles = StyleSheet.create({
6262

6363
export default class ErrorPage extends Component {
6464
static propTypes = {
65-
onReload: PropTypes.func.isRequired
65+
onReload: PropTypes.func.isRequired,
66+
subheading: PropTypes.string.isRequired
6667
};
6768

6869
constructor(props) {
@@ -79,7 +80,7 @@ export default class ErrorPage extends Component {
7980
contentContainerStyle={styles.container}>
8081
<View style={styles.wrapper}>
8182
<Text style={styles.heading}>Oops something went wrong.</Text>
82-
<Text style={styles.subheading}>Couldn't get your notifications.</Text>
83+
<Text style={styles.subheading}>{this.props.subheading}</Text>
8384
<Text style={styles.emoji}>{emoji}</Text>
8485
<TouchableHighlight
8586
style={styles.button}

‎App/Middleware/Requests.js

Lines changed: 13 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,26 @@
1-
import { CALL_API, isRSAA } from 'redux-api-middleware';
2-
31
import {
42
FETCH_NOTIFICATIONS_REQUEST,
53
MARK_NOTIFICATION_REQUEST,
64
MARK_REPO_NOTIFICATION_REQUEST
75
} from '../Actions';
86

97
export default store => next => action => {
10-
if (!isRSAA(action)) {
11-
return next(action);
12-
}
8+
switch (action.type) {
139

14-
switch (action[CALL_API].types[0].type) {
10+
// case FETCH_NOTIFICATIONS_REQUEST:
11+
// const settings = store.getState().settings;
12+
// const endpoint = action[CALL_API].endpoint + '?participating=';
13+
// action[CALL_API].endpoint = endpoint + (settings.get('participating') ? 'true' : 'false');
1514

16-
case FETCH_NOTIFICATIONS_REQUEST:
17-
const settings = store.getState().settings;
18-
const endpoint = action[CALL_API].endpoint + '?participating=';
19-
action[CALL_API].endpoint = endpoint + (settings.get('participating') ? 'true' : 'false');
15+
// case FETCH_NOTIFICATIONS_REQUEST:
16+
// case MARK_NOTIFICATION_REQUEST:
17+
// case MARK_REPO_NOTIFICATION_REQUEST:
18+
// const token = 'token ' + store.getState().auth.get('token');
19+
// // action[CALL_API].headers['Authorization'] = token;
2020

21-
case FETCH_NOTIFICATIONS_REQUEST:
22-
case MARK_NOTIFICATION_REQUEST:
23-
case MARK_REPO_NOTIFICATION_REQUEST:
24-
const token = 'token ' + store.getState().auth.get('token');
25-
action[CALL_API].headers['Authorization'] = token;
21+
// console.log('-----');
22+
// console.log(action);
23+
// console.log('-----');
2624
}
2725

2826
return next(action);

‎App/Reducers/Notifications.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,11 +34,11 @@ export default function reducer(state = initialState, action) {
3434
.set('isFetching', false)
3535
.set('isReFetching', false);
3636
case actions.MARK_NOTIFICATION_SUCCESS:
37-
const id = action.meta.id;
37+
const id = action.id;
3838
return state
3939
.set('response', _.without(state.get('response'), _.findWhere(state.get('response'), {id})));
4040
case actions.MARK_REPO_NOTIFICATION_SUCCESS:
41-
const repoFullName = action.meta.repoFullName;
41+
const repoFullName = action.repoFullName;
4242
return state
4343
.set('response', _.reject(state.get('response'), (obj) => obj.repository.full_name === repoFullName));
4444
default:

‎App/Routes/Notifications.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -146,7 +146,9 @@ class NotificationsView extends Component {
146146

147147
render() {
148148
if (this.props.errored) {
149-
return <ErrorPage onReload={() => this.props.fetchNotifications()} />;
149+
return <ErrorPage
150+
subheading="Couldn't get your notifications."
151+
onReload={() => this.props.fetchNotifications()} />;
150152
}
151153

152154
if (!this.state.dataSource.getRowCount() && this.props.query) {

0 commit comments

Comments
 (0)