diff --git a/client/modules/IDE/actions/collections.js b/client/modules/IDE/actions/collections.js index cb61dc23..3bd99dc1 100644 --- a/client/modules/IDE/actions/collections.js +++ b/client/modules/IDE/actions/collections.js @@ -1,4 +1,5 @@ import axios from 'axios'; +import { browserHistory } from 'react-router'; import * as ActionTypes from '../../../constants'; import { startLoader, stopLoader } from './loader'; import { setToastText, showToast } from './toast'; @@ -47,20 +48,22 @@ export function createCollection(collection) { }); dispatch(stopLoader()); - const collectionName = response.data.name; - dispatch(setToastText(`Created "${collectionName}"`)); + const newCollection = response.data; + dispatch(setToastText(`Created "${newCollection.name}"`)); dispatch(showToast(TOAST_DISPLAY_TIME_MS)); - return response.data; + const pathname = `/${newCollection.owner.username}/collections/${newCollection.id}`; + const location = { pathname, state: { skipSavingPath: true } }; + + browserHistory.push(location); }) .catch((response) => { + console.error('Error creating collection', response.data); dispatch({ type: ActionTypes.ERROR, error: response.data }); dispatch(stopLoader()); - - return response.data; }); }; } diff --git a/client/modules/IDE/components/QuickAddList/QuickAddList.jsx b/client/modules/IDE/components/QuickAddList/QuickAddList.jsx index fe32168d..5694929d 100644 --- a/client/modules/IDE/components/QuickAddList/QuickAddList.jsx +++ b/client/modules/IDE/components/QuickAddList/QuickAddList.jsx @@ -53,7 +53,8 @@ const QuickAddList = ({ {...item} onSelect={ (event) => { - event.target.blur(); + event.stopPropagation(); + event.currentTarget.blur(); handleAction(item); } } diff --git a/client/modules/User/components/Collection.jsx b/client/modules/User/components/Collection.jsx index 477f1319..0c8723b0 100644 --- a/client/modules/User/components/Collection.jsx +++ b/client/modules/User/components/Collection.jsx @@ -380,15 +380,15 @@ Collection.propTypes = { }).isRequired, getCollections: PropTypes.func.isRequired, collection: PropTypes.shape({ - id: PropTypes.string.isRequired, - name: PropTypes.string.isRequired, + id: PropTypes.string, + name: PropTypes.string, slug: PropTypes.string, description: PropTypes.string, owner: PropTypes.shape({ - username: PropTypes.string.isRequired, + username: PropTypes.string, }).isRequired, items: PropTypes.arrayOf(PropTypes.shape({})), - }).isRequired, + }), username: PropTypes.string, loading: PropTypes.bool.isRequired, toggleDirectionForField: PropTypes.func.isRequired, @@ -401,7 +401,14 @@ Collection.propTypes = { }; Collection.defaultProps = { - username: undefined + username: undefined, + collection: { + id: undefined, + items: [], + owner: { + username: undefined + } + } }; function mapStateToProps(state, ownProps) { diff --git a/client/modules/User/components/CollectionCreate.jsx b/client/modules/User/components/CollectionCreate.jsx index 220dcfda..b5821223 100644 --- a/client/modules/User/components/CollectionCreate.jsx +++ b/client/modules/User/components/CollectionCreate.jsx @@ -2,7 +2,6 @@ import PropTypes from 'prop-types'; import React from 'react'; import { Helmet } from 'react-helmet'; import { connect } from 'react-redux'; -import { browserHistory } from 'react-router'; import { bindActionCreators } from 'redux'; import * as CollectionsActions from '../../IDE/actions/collections'; @@ -39,19 +38,7 @@ class CollectionCreate extends React.Component { handleCreateCollection = (event) => { event.preventDefault(); - this.props.createCollection(this.state.collection) - .then(({ id, owner }) => { - const pathname = `/${owner.username}/collections/${id}`; - const location = { pathname, state: { skipSavingPath: true } }; - - browserHistory.replace(location); - }) - .catch((error) => { - console.error('Error creating collection', error); - this.setState({ - creationError: error, - }); - }); + this.props.createCollection(this.state.collection); } render() { @@ -107,12 +94,7 @@ CollectionCreate.propTypes = { username: PropTypes.string, authenticated: PropTypes.bool.isRequired }).isRequired, - createCollection: PropTypes.func.isRequired, - collection: PropTypes.shape({}).isRequired, // TODO - sorting: PropTypes.shape({ - field: PropTypes.string.isRequired, - direction: PropTypes.string.isRequired - }).isRequired + createCollection: PropTypes.func.isRequired }; function mapStateToProps(state, ownProps) { diff --git a/client/modules/User/pages/CollectionView.jsx b/client/modules/User/pages/CollectionView.jsx index c402539c..9e512774 100644 --- a/client/modules/User/pages/CollectionView.jsx +++ b/client/modules/User/pages/CollectionView.jsx @@ -72,6 +72,7 @@ function mapStateToProps(state) { } function mapDispatchToProps(dispatch) { + return {}; } CollectionView.propTypes = { @@ -84,7 +85,7 @@ CollectionView.propTypes = { }).isRequired, theme: PropTypes.string.isRequired, user: PropTypes.shape({ - username: PropTypes.string.isRequired, + username: PropTypes.string, }), }; diff --git a/client/styles/abstracts/_placeholders.scss b/client/styles/abstracts/_placeholders.scss index 1b1eb377..09b9932f 100644 --- a/client/styles/abstracts/_placeholders.scss +++ b/client/styles/abstracts/_placeholders.scss @@ -87,7 +87,7 @@ fill: getThemifyVariable('button-color'); opacity: 1; } - &:enabled:hover { + &:not(disabled):hover { border-color: getThemifyVariable('button-background-hover-color'); background-color: getThemifyVariable('button-background-hover-color'); color: getThemifyVariable('button-hover-color'); @@ -95,7 +95,7 @@ fill: getThemifyVariable('button-hover-color'); } } - &:enabled:active { + &:not(disabled):active { border-color: getThemifyVariable('button-background-active-color'); background-color: getThemifyVariable('button-background-active-color'); color: getThemifyVariable('button-active-color');