pitaya-launcher/js/components/edit/edit-view.jsx

68 lines
1.7 KiB
JavaScript

var React = require('react');
var connect = require('react-redux').connect;
var ProfileTree = require('./profile-tree.jsx');
var DesktopAppList = require('./desktop-app-list.jsx');
var ItemForm = require('./item-form.jsx');
var IconThemeSelector = require('./icon-theme-selector.jsx');
var actions = require('../../store/actions');
var DragDropContext = require('react-dnd').DragDropContext;
var HTML5Backend = require('react-dnd/modules/backends/HTML5');
var EditView = React.createClass({
componentDidMount: function() {
this.props.dispatch(actions.edit.loadDesktopApps());
},
render: function() {
return (
<div className="edit">
<div className="menu-bar">
</div>
<div className="workspace">
<div className="left-menu">
<IconThemeSelector onThemeSelected={this.onThemeSelected} />
<DesktopAppList
theme={this.props.theme}
desktopApps={this.props.desktopApps}
onItemDropped={this.onItemDropped} />
</div>
<ProfileTree />
<ItemForm />
</div>
</div>
);
},
onItemDropped: function(desktopEntry, targetItem) {
var newProfileItem = {
label: desktopEntry.Name,
icon: desktopEntry.Icon,
exec: desktopEntry.Exec
};
this.props.dispatch(actions.edit.addProfileItem(newProfileItem, targetItem));
},
onThemeSelected: function(theme) {
this.props.dispatch(actions.edit.selectTheme(theme));
}
});
function select(state) {
return {
desktopApps: state.desktopApps,
profile: state.profile,
theme: state.theme
};
}
module.exports = DragDropContext(HTML5Backend)(connect(select)(EditView));