definig success and error callbacks for every private axios request

This commit is contained in:
Delucse 2020-12-11 14:35:24 +01:00
parent 1821ac4e40
commit 4f002d8694
10 changed files with 179 additions and 78 deletions

View File

@ -44,7 +44,6 @@ export const loadUser = () => (dispatch) => {
res.config.success(res);
})
.catch(err => {
console.log(err);
err.config.error(err);
});
};
@ -82,7 +81,6 @@ export const login = ({ email, password }) => (dispatch) => {
dispatch(returnSuccess(res.data.message, res.status, 'LOGIN_SUCCESS'));
})
.catch(err => {
console.log(err);
dispatch(returnErrors(err.response.data.message, err.response.status, 'LOGIN_FAIL'));
dispatch({
type: LOGIN_FAIL
@ -101,51 +99,59 @@ export const login = ({ email, password }) => (dispatch) => {
// Connect to MyBadges-Account
export const connectMyBadges = ({ username, password }) => (dispatch, getState) => {
// Headers
const config = {
headers: {
'Content-Type': 'application/json'
success: res => {
var user = getState().auth.user;
user.badge = res.data.account;
user.badges = res.data.badges;
dispatch({
type: MYBADGES_CONNECT,
payload: user
});
dispatch(returnSuccess(res.data.message, res.status, 'MYBADGES_CONNECT_SUCCESS'));
},
error: err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'MYBADGES_CONNECT_FAIL'));
}
};
// Request Body
const body = JSON.stringify({ username, password });
axios.post(`${process.env.REACT_APP_BLOCKLY_API}/user/badge`, body, config)
.then(res => {
var user = getState().auth.user;
user.badge = res.data.account;
user.badges = res.data.badges;
dispatch({
type: MYBADGES_CONNECT,
payload: user
});
dispatch(returnSuccess(res.data.message, res.status, 'MYBADGES_CONNECT_SUCCESS'));
res.config.success(res);
})
.catch(err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'MYBADGES_CONNECT_FAIL'));
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});
};
// Disconnect MyBadges-Account
export const disconnectMyBadges = () => (dispatch, getState) => {
// Headers
const config = {
headers: {
'Content-Type': 'application/json'
success: res => {
var user = getState().auth.user;
user.badge = null;
user.badges = null;
dispatch({
type: MYBADGES_DISCONNECT,
payload: user
});
dispatch(returnSuccess(res.data.message, res.status, 'MYBADGES_DISCONNECT_SUCCESS'));
},
error: err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'MYBADGES_DISCONNECT_FAIL'));
}
};
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/user/badge`, config)
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/user/badge`, {}, config)
.then(res => {
var user = getState().auth.user;
user.badge = null;
user.badges = null;
dispatch({
type: MYBADGES_DISCONNECT,
payload: user
});
dispatch(returnSuccess(res.data.message, res.status, 'MYBADGES_DISCONNECT_SUCCESS'));
res.config.success(res);
})
.catch(err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'MYBADGES_DISCONNECT_FAIL'));
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});
};
@ -189,8 +195,7 @@ export const logout = () => (dispatch) => {
res.config.success(res);
})
.catch(err => {
console.log(err);
if(err.response.status !== 401){
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});

View File

@ -21,8 +21,8 @@ export const setDescription = (description) => (dispatch) => {
export const getProject = (type, id) => (dispatch) => {
dispatch({type: PROJECT_PROGRESS});
dispatch(setType(type));
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`)
.then(res => {
const config = {
success: res => {
var data = type === 'share' ? 'content' : type;
var project = res.data[data];
if(project){
@ -41,19 +41,27 @@ export const getProject = (type, id) => (dispatch) => {
dispatch({type: PROJECT_PROGRESS});
dispatch(returnErrors(res.data.message, res.status, 'PROJECT_EMPTY'));
}
})
.catch(err => {
},
error: err => {
if(err.response){
dispatch(returnErrors(err.response.data.message, err.response.status, 'GET_PROJECT_FAIL'));
}
dispatch({type: PROJECT_PROGRESS});
}
};
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
};
export const getProjects = (type) => (dispatch) => {
dispatch({type: PROJECT_PROGRESS});
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/${type}`)
.then(res => {
const config = {
success: res => {
var data = type === 'project' ? 'projects' : 'galleries';
var projects = res.data[data];
dispatch({
@ -62,12 +70,20 @@ export const getProjects = (type) => (dispatch) => {
});
dispatch({type: PROJECT_PROGRESS});
dispatch(returnSuccess(res.data.message, res.status));
})
.catch(err => {
},
error: err => {
if(err.response){
dispatch(returnErrors(err.response.data.message, err.response.status, 'GET_PROJECTS_FAIL'));
}
dispatch({type: PROJECT_PROGRESS});
}
};
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/${type}`, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
};
@ -81,8 +97,8 @@ export const updateProject = (type, id) => (dispatch, getState) => {
if(type==='gallery'){
body.description = project.description;
}
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`, body)
.then(res => {
const config = {
success: res => {
var project = res.data[type];
var projects = getState().project.projects;
var index = projects.findIndex(res => res._id === project._id);
@ -96,8 +112,8 @@ export const updateProject = (type, id) => (dispatch, getState) => {
} else {
dispatch(returnSuccess(res.data.message, res.status, 'GALLERY_UPDATE_SUCCESS'));
}
})
.catch(err => {
},
error: err => {
if(err.response){
if(type === 'project'){
dispatch(returnErrors(err.response.data.message, err.response.status, 'PROJECT_UPDATE_FAIL'));
@ -105,13 +121,21 @@ export const updateProject = (type, id) => (dispatch, getState) => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'GALLERY_UPDATE_FAIL'));
}
}
}
};
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`, body, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
};
export const deleteProject = (type, id) => (dispatch, getState) => {
var project = getState().project;
axios.delete(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`)
.then(res => {
const config = {
success: res => {
var projects = getState().project.projects;
var index = projects.findIndex(res => res._id === id);
projects.splice(index, 1)
@ -124,10 +148,18 @@ export const deleteProject = (type, id) => (dispatch, getState) => {
} else {
dispatch(returnSuccess(res.data.message, res.status, 'GALLERY_DELETE_SUCCESS'));
}
},
error: err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'PROJECT_DELETE_FAIL'));
}
};
axios.delete(`${process.env.REACT_APP_BLOCKLY_API}/${type}/${id}`, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
if(err.response){
dispatch(returnErrors(err.response.data.message, err.response.status, 'PROJECT_DELETE_FAIL'));
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});
};

View File

@ -12,6 +12,7 @@ export const getTutorial = (id) => (dispatch, getState) => {
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/${id}`)
.then(res => {
var tutorial = res.data.tutorial;
console.log('status', getState().tutorial.status);
existingTutorial(tutorial, getState().tutorial.status).then(status => {
console.log('progress',getState().auth.progress);
console.log('status');
@ -19,6 +20,7 @@ export const getTutorial = (id) => (dispatch, getState) => {
type: TUTORIAL_SUCCESS,
payload: status
});
console.log('eins');
dispatch(updateStatus(status));
dispatch({
type: GET_TUTORIAL,
@ -46,6 +48,7 @@ export const getTutorials = () => (dispatch, getState) => {
type: TUTORIAL_SUCCESS,
payload: status
});
console.log('zwei');
dispatch(updateStatus(status));
dispatch({
type: GET_TUTORIALS,
@ -64,8 +67,8 @@ export const getTutorials = () => (dispatch, getState) => {
};
export const assigneBadge = (id) => (dispatch, getState) => {
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/user/badge/${id}`)
.then(res => {
const config = {
success: res => {
var badge = res.data.badge;
var user = getState().auth.user;
user.badges.push(badge._id);
@ -74,10 +77,18 @@ export const assigneBadge = (id) => (dispatch, getState) => {
payload: user
});
dispatch(returnSuccess(badge, res.status, 'ASSIGNE_BADGE_SUCCESS'));
},
error: err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'ASSIGNE_BADGE_FAIL'));
}
};
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/user/badge/${id}`, {}, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
if(err.response){
dispatch(returnErrors(err.response.data.message, err.response.status, 'ASSIGNE_BADGE_FAIL'));
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});
};
@ -103,8 +114,8 @@ export const updateStatus = (status) => (dispatch, getState) => {
export const deleteTutorial = (id) => (dispatch, getState) => {
var tutorial = getState().tutorial;
var id = getState().builder.id;
axios.delete(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/${id}`)
.then(res => {
const config = {
success: res => {
var tutorials = tutorial.tutorials;
var index = tutorials.findIndex(res => res._id === id);
tutorials.splice(index, 1)
@ -113,10 +124,18 @@ export const deleteTutorial = (id) => (dispatch, getState) => {
payload: tutorials
});
dispatch(returnSuccess(res.data.message, res.status, 'TUTORIAL_DELETE_SUCCESS'));
},
error: err => {
dispatch(returnErrors(err.response.data.message, err.response.status, 'TUTORIAL_DELETE_FAIL'));
}
};
axios.delete(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/${id}`, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
if(err.response){
dispatch(returnErrors(err.response.data.message, err.response.status, 'TUTORIAL_DELETE_FAIL'));
if(err.response && err.response.status !== 401){
err.config.error(err);
}
});
};
@ -152,6 +171,7 @@ export const tutorialCheck = (status, step) => (dispatch, getState) => {
type: status === 'success' ? TUTORIAL_SUCCESS : TUTORIAL_ERROR,
payload: tutorialsStatus
});
console.log('drei');
dispatch(updateStatus(tutorialsStatus));
dispatch(tutorialChange());
dispatch(returnSuccess('','','TUTORIAL_CHECK_SUCCESS'));
@ -208,6 +228,7 @@ const existingTutorials = (tutorials, status) => new Promise(function(resolve, r
});
const existingTutorial = (tutorial, status) => new Promise(function(resolve, reject){
console.log('st',status);
var tutorialsId = tutorial._id;
var statusIndex = status.findIndex(status => status._id === tutorialsId);
if (statusIndex > -1) {

View File

@ -254,7 +254,6 @@ export const resetTutorial = () => (dispatch, getState) => {
dispatch(tutorialBadge(''));
var steps = [
{
id: 1,
type: 'instruction',
headline: '',
text: '',
@ -282,7 +281,7 @@ export const readJSON = (json) => (dispatch, getState) => {
// accept only valid attributes
var steps = json.steps.map((step, i) => {
var object = {
// id: step.id,
_id: step._id,
type: step.type,
headline: step.headline,
text: step.text

View File

@ -5,7 +5,6 @@ import { workspaceName } from '../../actions/workspaceActions';
import { getProject, resetProject } from '../../actions/projectActions';
import { clearMessages, returnErrors } from '../../actions/messageActions';
import axios from 'axios';
import { withRouter } from 'react-router-dom';
import { createNameId } from 'mnemonic-id';

View File

@ -4,7 +4,6 @@ import { connect } from 'react-redux';
import { getProjects, resetProject } from '../../actions/projectActions';
import { clearMessages } from '../../actions/messageActions';
import axios from 'axios';
import { Link, withRouter } from 'react-router-dom';
import Breadcrumbs from '../Breadcrumbs';

View File

@ -2,7 +2,7 @@ import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { checkError, readJSON, jsonString, progress, tutorialId, resetTutorial as resetTutorialBuilder} from '../../../actions/tutorialBuilderActions';
import { getTutorials, resetTutorial, deleteTutorial } from '../../../actions/tutorialActions';
import { getTutorials, resetTutorial, deleteTutorial, tutorialProgress } from '../../../actions/tutorialActions';
import { clearMessages } from '../../../actions/messageActions';
import axios from 'axios';
@ -68,10 +68,19 @@ class Builder extends Component {
}
componentDidMount() {
this.props.getTutorials();
this.props.tutorialProgress();
// retrieve tutorials only if a potential user is loaded - authentication
// is finished (success or failed)
if(!this.props.authProgress){
this.props.getTutorials();
}
}
componentDidUpdate(props, state) {
if(props.authProgress !== this.props.authProgress && !this.props.authProgress){
// authentication is completed
this.props.getTutorials();
}
if(props.message !== this.props.message){
if(this.props.message.id === 'GET_TUTORIALS_FAIL'){
// alert(this.props.message.msg);
@ -183,6 +192,9 @@ class Builder extends Component {
newTutorial.append('title', this.props.title);
newTutorial.append('badge', this.props.badge);
steps.forEach((step, i) => {
if(step._id){
newTutorial.append(`steps[${i}][_id]`, step._id);
}
newTutorial.append(`steps[${i}][type]`, step.type);
newTutorial.append(`steps[${i}][headline]`, step.headline);
newTutorial.append(`steps[${i}][text]`, step.text);
@ -215,14 +227,22 @@ class Builder extends Component {
submitNew = () => {
var newTutorial = this.submit();
if(newTutorial){
axios.post(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/`, newTutorial)
.then(res => {
const config = {
success: res => {
var tutorial = res.data.tutorial;
this.props.history.push(`/tutorial/${tutorial._id}`);
})
.catch(err => {
},
error: err => {
this.setState({ snackbar: true, key: Date.now(), message: `Fehler beim Erstellen des Tutorials. Versuche es noch einmal.`, type: 'error' });
window.scrollTo(0, 0);
}
};
axios.post(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/`, newTutorial, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
}
}
@ -230,14 +250,22 @@ class Builder extends Component {
submitUpdate = () => {
var updatedTutorial = this.submit();
if(updatedTutorial){
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/${this.props.id}`, updatedTutorial)
.then(res => {
const config = {
success: res => {
var tutorial = res.data.tutorial;
this.props.history.push(`/tutorial/${tutorial._id}`);
})
.catch(err => {
},
error: err => {
this.setState({ snackbar: true, key: Date.now(), message: `Fehler beim Ändern des Tutorials. Versuche es noch einmal.`, type: 'error' });
window.scrollTo(0, 0);
}
};
axios.put(`${process.env.REACT_APP_BLOCKLY_API}/tutorial/${this.props.id}`, updatedTutorial, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
}
}
@ -399,6 +427,7 @@ Builder.propTypes = {
progress: PropTypes.func.isRequired,
deleteTutorial: PropTypes.func.isRequired,
resetTutorialBuilder: PropTypes.func.isRequired,
tutorialProgress: PropTypes.func.isRequired,
title: PropTypes.string.isRequired,
badge: PropTypes.string.isRequired,
id: PropTypes.string.isRequired,
@ -410,7 +439,8 @@ Builder.propTypes = {
isProgress: PropTypes.bool.isRequired,
tutorials: PropTypes.array.isRequired,
message: PropTypes.object.isRequired,
user: PropTypes.object.isRequired
user: PropTypes.object.isRequired,
authProgress: PropTypes.bool.isRequired
};
const mapStateToProps = state => ({
@ -425,6 +455,7 @@ const mapStateToProps = state => ({
tutorials: state.tutorial.tutorials,
message: state.message,
user: state.auth.user,
authProgress: state.auth.progress
});
export default connect(mapStateToProps, { checkError, readJSON, jsonString, progress, tutorialId, resetTutorialBuilder, getTutorials, resetTutorial, clearMessages, deleteTutorial })(withStyles(styles, { withTheme: true })(withRouter(Builder)));
export default connect(mapStateToProps, { checkError, readJSON, jsonString, progress, tutorialId, resetTutorialBuilder, getTutorials, resetTutorial, tutorialProgress, clearMessages, deleteTutorial })(withStyles(styles, { withTheme: true })(withRouter(Builder)));

View File

@ -23,7 +23,7 @@ class Tutorial extends Component {
componentDidMount() {
this.props.tutorialProgress();
// retrieve tutorials only if a potential user is loaded - authentication
// retrieve tutorial only if a potential user is loaded - authentication
// is finished (success or failed)
if(!this.props.progress){
this.props.getTutorial(this.props.match.params.tutorialId);

View File

@ -94,13 +94,20 @@ export class MyBadges extends Component {
getBadges = () => {
this.setState({progress: true});
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/user/badge`)
const config = {
success: res => {
this.setState({badges: res.data.badges, progress: false});
},
error: err => {
this.setState({progress: false});
}
};
axios.get(`${process.env.REACT_APP_BLOCKLY_API}/user/badge`, config)
.then(res => {
this.setState({badges: res.data.badges, progress: false});
res.config.success(res);
})
.catch(err => {
this.setState({progress: false});
console.log(err);
err.config.error(err);
});
};

View File

@ -95,14 +95,22 @@ class SaveProject extends Component {
if(this.state.projectType === 'gallery'){
body.description = this.state.description;
}
axios.post(`${process.env.REACT_APP_BLOCKLY_API}/${this.state.projectType}`, body)
.then(res => {
const config = {
success: res => {
var project = res.data[this.state.projectType];
this.props.history.push(`/${this.state.projectType}/${project._id}`);
})
.catch(err => {
},
error: err => {
this.setState({ snackbar: true, key: Date.now(), message: `Fehler beim Speichern des ${this.state.projectType === 'gallery' ? 'Galerie-':''}Projektes. Versuche es noch einmal.`, type: 'error' });
window.scrollTo(0, 0);
}
};
axios.post(`${process.env.REACT_APP_BLOCKLY_API}/${this.state.projectType}`, body, config)
.then(res => {
res.config.success(res);
})
.catch(err => {
err.config.error(err);
});
}