import React from 'react'
import UnitContainer from '../../../../../containers/app/sidebars/topology/machine/UnitContainer'

const UnitListComponent = ({ unitType, unitIds, inSimulation }) => (
    <ul className="list-group mt-1">
        {unitIds.length !== 0 ? (
            unitIds.map((unitId, index) => (
                <UnitContainer
                    unitType={unitType}
                    unitId={unitId}
                    index={index}
                    key={index}
                />
            ))
        ) : (
            <div className="alert alert-info">
                {inSimulation ? (
                    <strong>No units of this type in this machine</strong>
                ) : (
                    <span>
            <strong>No units...</strong> Add some with the menu above!
          </span>
                )}
            </div>
        )}
    </ul>
)

export default UnitListComponent