62 lines
1.5 KiB
JavaScript
62 lines
1.5 KiB
JavaScript
/** @format */
|
|
/**
|
|
* External dependencies
|
|
*/
|
|
import { __ } from '@wordpress/i18n';
|
|
import { Icon } from '@wordpress/components';
|
|
import { Component } from '@wordpress/element';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import { MenuItem } from '@woocommerce/components';
|
|
|
|
class SectionControls extends Component {
|
|
constructor( props ) {
|
|
super( props );
|
|
this.onMoveUp = this.onMoveUp.bind( this );
|
|
this.onMoveDown = this.onMoveDown.bind( this );
|
|
}
|
|
|
|
onMoveUp() {
|
|
const { onMove, onToggle } = this.props;
|
|
onMove( -1 );
|
|
// Close the dropdown
|
|
onToggle();
|
|
}
|
|
|
|
onMoveDown() {
|
|
const { onMove, onToggle } = this.props;
|
|
onMove( 1 );
|
|
// Close the dropdown
|
|
onToggle();
|
|
}
|
|
|
|
render() {
|
|
const { onRemove, isFirst, isLast } = this.props;
|
|
|
|
return (
|
|
<div className="woocommerce-dashboard-section-controls">
|
|
{ ! isFirst && (
|
|
<MenuItem isClickable onInvoke={ this.onMoveUp }>
|
|
<Icon icon={ 'arrow-up-alt2' } label={ __( 'Move up' ) } />
|
|
{ __( 'Move up', 'woocommerce-admin' ) }
|
|
</MenuItem>
|
|
) }
|
|
{ ! isLast && (
|
|
<MenuItem isClickable onInvoke={ this.onMoveDown }>
|
|
<Icon icon={ 'arrow-down-alt2' } label={ __( 'Move Down' ) } />
|
|
{ __( 'Move Down', 'woocommerce-admin' ) }
|
|
</MenuItem>
|
|
) }
|
|
<MenuItem isClickable onInvoke={ onRemove }>
|
|
<Icon icon={ 'trash' } label={ __( 'Remove block' ) } />
|
|
{ __( 'Remove section', 'woocommerce-admin' ) }
|
|
</MenuItem>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default SectionControls;
|