
import React from 'react';
import PropTypes from 'prop-types';
import { createNamespace } from '../../../../tools/namingTools';

import './styles/CompareProductEditions.scss';

const n = createNamespace('CompareProductEditions');

export const CompareProductEditions = ({ editionNames }) => (
    <React.Fragment>
        {editionNames && editionNames.length ? (
            <ul {...n('list').withTestId().props}>
                {editionNames.map(editionName => <li key={editionName}>{editionName}</li>)}
            </ul>
        ) : ''}
    </React.Fragment>
);

CompareProductEditions.isRenderable = item => item.editionNames && item.editionNames.length;

CompareProductEditions.propTypes = {
    editionNames: PropTypes.arrayOf(PropTypes.string)
};

CompareProductEditions.defaultProps = {
    editionNames: null
};
