ndla-ui/lib/Subject/SubjectNewContent.js

UI component library for NDLA.

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _reactBemHelper = require('react-bem-helper');

var _reactBemHelper2 = _interopRequireDefault(_reactBemHelper);

var _common = require('ndla-icons/common');

var _ndlaUi = require('ndla-ui');

var _Subject = require('./Subject');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var classes = (0, _reactBemHelper2.default)('c-subject-new-content');

var SubjectNewContent = function SubjectNewContent(_ref) {
  var heading = _ref.heading,
      content = _ref.content;
  return _react2.default.createElement(
    'section',
    classes(),
    _react2.default.createElement(
      _Subject.SubjectSectionTitle,
      { className: classes('heading').className },
      heading
    ),
    _react2.default.createElement(
      'nav',
      classes('content'),
      _react2.default.createElement(
        'ul',
        classes('list'),
        content.map(function (item) {
          return _react2.default.createElement(
            'li',
            _extends({}, classes('item'), { key: item.url }),
            _react2.default.createElement(
              'div',
              classes('left-wrapper'),
              _react2.default.createElement(_ndlaUi.ContentTypeBadge, {
                type: item.contentType,
                size: 'x-small',
                background: true,
                outline: true
              }),
              _react2.default.createElement(
                'div',
                classes('content-link'),
                _react2.default.createElement(
                  'div',
                  classes('date'),
                  item.formattedDate
                ),
                _react2.default.createElement(
                  _ndlaUi.SafeLink,
                  _extends({ to: item.url }, classes('link')),
                  item.name
                ),
                _react2.default.createElement(
                  'div',
                  classes('topic-name'),
                  item.topicName.map(function (topic, index) {
                    return _react2.default.createElement(
                      _react.Fragment,
                      { key: topic },
                      index > 0 && _react2.default.createElement(_common.ChevronRight, null),
                      topic
                    );
                  })
                )
              )
            )
          );
        })
      )
    )
  );
};

SubjectNewContent.propTypes = {
  heading: _propTypes2.default.string.isRequired,
  content: _propTypes2.default.arrayOf(_propTypes2.default.shape({
    name: _propTypes2.default.string.isRequired,
    url: _propTypes2.default.string.isRequired,
    topicName: _propTypes2.default.arrayOf(_propTypes2.default.string).isRequired,
    formattedDate: _propTypes2.default.string.isRequired,
    contentType: _propTypes2.default.string.isRequired
  })).isRequired
};

exports.default = SubjectNewContent;