Double click to select account creation type (#4986)

* Extend links to whole container

* Add doubleClick to Account Creator
This commit is contained in:
Nicolas Gotchac 2017-03-22 12:12:21 +01:00 committed by Jaco Greeff
parent a028e445fe
commit 67c225f971
3 changed files with 34 additions and 9 deletions

View File

@ -145,6 +145,7 @@ export default class CreationType extends Component {
items={ TYPES } items={ TYPES }
noStretch noStretch
onSelectClick={ this.onChange } onSelectClick={ this.onChange }
onSelectDoubleClick={ this.onSelect }
renderItem={ this.renderItem } renderItem={ this.renderItem }
/> />
); );
@ -180,4 +181,11 @@ export default class CreationType extends Component {
store.setCreateType(item.key); store.setCreateType(item.key);
} }
onSelect = (item) => {
const { store } = this.props;
store.setCreateType(item.key);
store.nextStage();
}
} }

View File

@ -82,12 +82,17 @@ export default class Container extends Component {
to={ link } to={ link }
> >
{ card } { card }
{ this.renderHover() }
</Link> </Link>
) )
: card : (
} <div>
{ card }
{ this.renderHover() } { this.renderHover() }
</div> </div>
)
}
</div>
); );
} }

View File

@ -14,6 +14,7 @@
// You should have received a copy of the GNU General Public License // You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>. // along with Parity. If not, see <http://www.gnu.org/licenses/>.
import { noop } from 'lodash';
import React, { Component, PropTypes } from 'react'; import React, { Component, PropTypes } from 'react';
import { StarIcon } from '~/ui/Icons'; import { StarIcon } from '~/ui/Icons';
@ -29,8 +30,13 @@ export default class SelectionList extends Component {
noStretch: PropTypes.bool, noStretch: PropTypes.bool,
onDefaultClick: PropTypes.func, onDefaultClick: PropTypes.func,
onSelectClick: PropTypes.func.isRequired, onSelectClick: PropTypes.func.isRequired,
onSelectDoubleClick: PropTypes.func,
renderItem: PropTypes.func.isRequired renderItem: PropTypes.func.isRequired
} };
static defaultProps = {
onSelectDoubleClick: noop
};
render () { render () {
const { items, noStretch } = this.props; const { items, noStretch } = this.props;
@ -45,23 +51,28 @@ export default class SelectionList extends Component {
} }
renderItem = (item, index) => { renderItem = (item, index) => {
const { isChecked, onDefaultClick, onSelectClick, renderItem } = this.props; const { isChecked, onDefaultClick, onSelectClick, onSelectDoubleClick, renderItem } = this.props;
const isSelected = isChecked const isSelected = isChecked
? isChecked(item) ? isChecked(item)
: item.checked; : item.checked;
const makeDefault = () => { const handleClick = () => {
onDefaultClick(item); onSelectClick(item);
return false; return false;
}; };
const selectItem = () => { const handleDoubleClick = () => {
onSelectClick(item); onSelectDoubleClick(item);
return false; return false;
}; };
let defaultIcon = null; let defaultIcon = null;
if (onDefaultClick) { if (onDefaultClick) {
const makeDefault = () => {
onDefaultClick(item);
return false;
};
defaultIcon = ( defaultIcon = (
<div className={ styles.overlay }> <div className={ styles.overlay }>
{ {
@ -85,7 +96,8 @@ export default class SelectionList extends Component {
<div className={ classes.join(' ') }> <div className={ classes.join(' ') }>
<div <div
className={ styles.content } className={ styles.content }
onClick={ selectItem } onClick={ handleClick }
onDoubleClick={ handleDoubleClick }
> >
{ renderItem(item, index) } { renderItem(item, index) }
</div> </div>