-
-
Notifications
You must be signed in to change notification settings - Fork 51
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Promise middleware force you to catch and then all requests #128
Comments
@mowbell Good point. Could you please show me an example of dispatching an action which you dont Adjusting What we can do is to add possibility to configure both request and response actions in middleware, or we could adjust promise middleware to look at action's What do you think? |
Regarding |
Hi @klis87 Responding to your question, for me works my previous suggested implementation ...
requestsPromiseMiddleware({
getRequestAction: (action) => {
return action.meta && action.meta.requestAction && action.meta.requestAction.isPromise ? action.meta.requestAction : null;
},
})
... In my code (It's an implementation for React Native), the complete Redux setup is similar to: import { createStore, applyMiddleware } from 'redux';
import createSagaMiddleware from 'redux-saga';
import { requestsPromiseMiddleware } from 'redux-saga-requests';
import axios from 'axios';
import reducer from '../reducers';
import rootSaga from './sagas';
const sagaMiddleware = createSagaMiddleware();
const sagaRequestsPromiseMiddleware = requestsPromiseMiddleware({
getRequestAction: action => (action.meta && action.meta.requestAction && action.meta.requestAction.isPromise ? action.meta.requestAction : null),
});
const middlewares = [sagaMiddleware, sagaRequestsPromiseMiddleware];
const storeEnhancer = applyMiddleware(...middlewares);
const store = createStore(reducer, storeEnhancer);
const axiosInstance = axios.create({
baseURL: 'https://URL',
headers: { Accept: 'application/json', 'Content-Type': 'application/json' },
});
sagaMiddleware.run(rootSaga, axiosInstance);
export default store;
The example of dispatching an action (as non-promise) is normal as it appears in documentation: export const sendContactMessage = ({ name, email, message }) => ({
type: SEND_CONTACT_MESSAGE,
name,
email,
message,
request: {
url: '/contact',
method: 'post',
data: {
name,
email,
message,
},
},
}); I dispatch those non-promise actions from React component as: <ProfileScreenView
userData={userData}
onSendContact={this.props.sendContactMessage}
contactRequestStatus={contactRequestStatus}
/>
And, for request that needs to be handled as promises, I dispatch the actions as follow: export const sendFeedbackService = (serviceId, problemType = ProblemTypes.NONE) => ({
type: REQUEST_SEND_FEEDBACK_SERVICE,
serviceId,
problemType,
isPromise: true,
request: {
url: `/services/${serviceId}/feedback`,
method: 'put',
data: {
conflictType: problemType,
},
meta: {
// meta is optional, it will be added to success, error or abort action when defined
serviceId,
},
},
}); I dispatch those promise actions from React component as: handleRequestFeedbackService: ({ sendFeedbackService, service, setRequestFeedbackStatus }) => (problemType) => {
clearTimmer();
setRequestFeedbackStatus(Statuses.SENDING);
const problemTypeID = invert(ProblemTypes)[problemType];
sendFeedbackService(service.serviceId, problemTypeID, problemDescription, rating)
.then(() => {
setRequestFeedbackStatus(Statuses.SUCCESS);
})
.catch(() => {
setRequestFeedbackStatus(Statuses.FAILED);
clearTimmer();
timer = setTimeout(() => {
setRequestFeedbackStatus(Statuses.NONE);
clearTimmer();
}, 2500);
});
}, |
Regarding warning, @klis87 So, as you suggest, a Then, getRequestAction: action => (action.meta && action.meta.requestAction && action.meta.requestAction.meta && action.meta.requestAction.meta.isPromise ? action.meta.requestAction : null), Then, We can dispatch actions as: export const sendFeedbackService = (serviceId, problemType = ProblemTypes.NONE) => ({
type: REQUEST_SEND_FEEDBACK_SERVICE,
serviceId,
problemType,
request: {
url: `/services/${serviceId}/feedback`,
method: 'put',
data: {
conflictType: problemType,
},
meta: {
// meta is optional, it will be added to success, error or abort action when defined
serviceId,
isPromise: true,
},
},
}); |
Thanks for the code snippets. Your adjustment Btw, in action below: export const sendContactMessage = ({ name, email, message }) => ({
type: SEND_CONTACT_MESSAGE,
name,
email,
message,
request: {
url: '/contact',
method: 'post',
data: {
name,
email,
message,
},
},
}); you added Thats why our updated getRequestAction: action => action.meta && action.meta.isPromise ? action.meta.requestAction : null) but I guess your solution might be a safer option due to potential I will try to add this to the library in upcoming days. |
@mowbell Published as 0.14.0, pls let me know if sth doesn't work as expected. |
@klis87 Thanks a lot, it's working as expected, Great job! |
Can I mix promise middleware only for some requests and normal requests without handle these as promises?
When I use optional promise middleware, I must handle all requests (
then
andcatch
)What if I need handle only ones as promises, and the rest as normal redux-saga-requests?
For fix it on my project, I override
requestsPromiseMiddleware
config as:Then I write actions creators that needs promise handling as:
Maybe someone with the same problem can do it, but
My question, It is an issue or How can I do the same?
The text was updated successfully, but these errors were encountered: