Delete collection from list

This commit is contained in:
Andrew Nicolaou 2019-10-20 15:31:20 +02:00
parent 3573253504
commit a82e079782
4 changed files with 31 additions and 4 deletions

View file

@ -38,6 +38,7 @@ export const SET_PROJECTS = 'SET_PROJECTS';
export const SET_COLLECTIONS = 'SET_COLLECTIONS'; export const SET_COLLECTIONS = 'SET_COLLECTIONS';
export const CREATE_COLLECTION = 'CREATED_COLLECTION'; export const CREATE_COLLECTION = 'CREATED_COLLECTION';
export const DELETE_COLLECTION = 'DELETE_COLLECTION';
export const ADD_TO_COLLECTION = 'ADD_TO_COLLECTION'; export const ADD_TO_COLLECTION = 'ADD_TO_COLLECTION';
export const REMOVE_FROM_COLLECTION = 'REMOVE_FROM_COLLECTION'; export const REMOVE_FROM_COLLECTION = 'REMOVE_FROM_COLLECTION';

View file

@ -148,3 +148,26 @@ export function editCollection(collectionId, { name, description }) {
}); });
}; };
} }
export function deleteCollection(collectionId) {
return (dispatch) => {
const url = `${ROOT_URL}/collections/${collectionId}`;
return axios.delete(url, { withCredentials: true })
.then((response) => {
dispatch({
type: ActionTypes.DELETE_COLLECTION,
payload: response.data,
collectionId,
});
return response.data;
})
.catch((response) => {
dispatch({
type: ActionTypes.ERROR,
error: response.data
});
return response.data;
});
};
}

View file

@ -128,10 +128,10 @@ class CollectionListRowBase extends React.Component {
this.props.showShareModal(this.props.collection.id, this.props.collection.name, this.props.username); this.props.showShareModal(this.props.collection.id, this.props.collection.name, this.props.username);
} }
handleSketchDelete = () => { handleCollectionDelete = () => {
this.closeAll(); this.closeAll();
if (window.confirm(`Are you sure you want to delete "${this.props.collection.name}"?`)) { if (window.confirm(`Are you sure you want to delete "${this.props.collection.name}"?`)) {
this.props.deleteProject(this.props.collection.id); this.props.deleteCollection(this.props.collection.id);
} }
} }
@ -185,7 +185,7 @@ class CollectionListRowBase extends React.Component {
<li> <li>
<button <button
className="sketch-list__action-option" className="sketch-list__action-option"
onClick={this.handleSketchDelete} onClick={this.handleCollectionDelete}
onBlur={this.onBlurComponent} onBlur={this.onBlurComponent}
onFocus={this.onFocusComponent} onFocus={this.onFocusComponent}
> >
@ -278,7 +278,7 @@ CollectionListRowBase.propTypes = {
username: PropTypes.string, username: PropTypes.string,
authenticated: PropTypes.bool.isRequired authenticated: PropTypes.bool.isRequired
}).isRequired, }).isRequired,
deleteProject: PropTypes.func.isRequired, deleteCollection: PropTypes.func.isRequired,
showShareModal: PropTypes.func.isRequired, showShareModal: PropTypes.func.isRequired,
cloneProject: PropTypes.func.isRequired, cloneProject: PropTypes.func.isRequired,
exportProjectAsZip: PropTypes.func.isRequired, exportProjectAsZip: PropTypes.func.isRequired,

View file

@ -5,6 +5,9 @@ const sketches = (state = [], action) => {
case ActionTypes.SET_COLLECTIONS: case ActionTypes.SET_COLLECTIONS:
return action.collections; return action.collections;
case ActionTypes.DELETE_COLLECTION:
return state.filter(({ id }) => action.collectionId !== id);
// The API returns the complete new edited collection // The API returns the complete new edited collection
// with any items added or removed // with any items added or removed
case ActionTypes.EDIT_COLLECTION: case ActionTypes.EDIT_COLLECTION: