2015-08-27 18:24:29 +02:00
|
|
|
var React = require('react');
|
2015-10-09 14:22:23 +02:00
|
|
|
var AppItem = require('./app-item.js');
|
2015-08-27 18:24:29 +02:00
|
|
|
|
|
|
|
module.exports = React.createClass({
|
|
|
|
|
2015-08-27 22:52:30 +02:00
|
|
|
propTypes: {
|
2015-08-30 21:29:19 +02:00
|
|
|
|
|
|
|
// The app items to display in the list
|
2015-08-27 22:52:30 +02:00
|
|
|
items: React.PropTypes.arrayOf(React.PropTypes.object).isRequired,
|
2015-08-30 21:29:19 +02:00
|
|
|
|
|
|
|
// the parent item path
|
2015-08-27 22:52:30 +02:00
|
|
|
parentPath: React.PropTypes.oneOfType([
|
|
|
|
React.PropTypes.string,
|
|
|
|
React.PropTypes.arrayOf(React.PropTypes.number)
|
|
|
|
]).isRequired,
|
2015-08-30 21:29:19 +02:00
|
|
|
|
|
|
|
// Item click handler
|
2015-08-27 22:52:30 +02:00
|
|
|
onItemClick: React.PropTypes.func.isRequired,
|
2015-08-30 21:29:19 +02:00
|
|
|
|
2015-08-27 22:52:30 +02:00
|
|
|
},
|
|
|
|
|
2015-08-27 18:24:29 +02:00
|
|
|
render: function() {
|
2015-08-27 22:52:30 +02:00
|
|
|
|
|
|
|
var parentPath = this.props.parentPath;
|
2015-08-30 21:29:19 +02:00
|
|
|
|
|
|
|
// For each items, we create an AppItem component
|
2015-08-27 22:52:30 +02:00
|
|
|
var items = (this.props.items).map(function(item, i) {
|
2015-08-30 21:29:19 +02:00
|
|
|
|
|
|
|
// The item path identifier
|
2015-08-27 22:52:30 +02:00
|
|
|
var path = parentPath+'.'+i;
|
2015-08-30 21:29:19 +02:00
|
|
|
|
2015-08-27 22:52:30 +02:00
|
|
|
return (
|
|
|
|
<AppItem key={path} itemPath={path} item={item} onItemClick={this.props.onItemClick} />
|
|
|
|
);
|
2015-08-30 21:29:19 +02:00
|
|
|
|
2015-08-27 22:52:30 +02:00
|
|
|
}.bind(this));
|
|
|
|
|
2015-08-30 21:29:19 +02:00
|
|
|
// Create the apps list
|
2015-08-27 18:24:29 +02:00
|
|
|
return (
|
2015-08-27 22:52:30 +02:00
|
|
|
<ul key={parentPath} className="apps-list">
|
|
|
|
{items}
|
2015-08-27 18:24:29 +02:00
|
|
|
</ul>
|
|
|
|
);
|
2015-08-27 22:52:30 +02:00
|
|
|
|
2015-08-27 18:24:29 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
});
|