import React from 'react';
import {connect} from 'react-redux';

import Application from './Application.jsx';
import ApplicationList from './ApplicationList.jsx';

import './Desktop.less';

class Desktop extends React.Component {
    constructor() {
        super();
    }

    render() {
        let appInstances = [];
        for (let id in this.props.app.instances) {
            let app = this.props.app.instances[id];
            appInstances.push((
                <Application
                    key={app.id}
                    ref={`app_${app.id}`}
                    app={app}
                />
            ));
        }

        let appList;
        if (this.props.appList.showList) {
            appList = (
                <ApplicationList />
            );
        }

        return (
            <div className='ui-desktop'>
                {appInstances}
                {appList}
            </div>
        );
    }
}

function mapStateToProps(state) {
    return state;
}

export default connect(mapStateToProps)(Desktop);