import { List } from 'atoms';
import { DepartmentCard } from 'molecules';
import React, { Component } from 'react';
import styles from './DepartmentList.css';

class DepartmentList extends Component {
  render() {

    const departmentCardRenderer = dataItem => (
      <DepartmentCard
        image={dataItem.image}
        title={dataItem.title}
        key={dataItem.id}
      />
    );

    return (
      <section>
        <div className={styles.wrapper}>
          <List
            // Default propertie goes here
            // End of default properties

            // Overriden properties
            {...this.props}

            // Non overridable properties goes here
            childRenderer={departmentCardRenderer}
          />
        </div>
      </section>
    );
  }
}

export default DepartmentList;