ndla-ui/es/ContentTypeBadge/ContentTypeBadge.js

UI component library for NDLA.

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; };

import React from 'react';
import PropTypes from 'prop-types';
import BEMHelper from 'react-bem-helper';

import { SubjectMaterial, TasksAndActivities, AssessmentResource, Subject, ExternalLearningResource, SharedResource, LearningPath } from 'ndla-icons/contentType';

import * as contentTypes from '../model/ContentType';
import { ContentTypeShape } from '../shapes';

var classes = new BEMHelper({
  name: 'content-type-badge',
  prefix: 'c-'
});

export var ContentTypeBadge = function ContentTypeBadge(_ref) {
  var type = _ref.type,
      background = _ref.background,
      size = _ref.size;

  var modifiers = [type, size];

  if (background) {
    modifiers.push('background');
  }

  var icon = null;
  switch (type) {
    case contentTypes.SUBJECT_MATERIAL:
      icon = React.createElement(SubjectMaterial, null);
      break;
    case contentTypes.TASKS_AND_ACTIVITIES:
      icon = React.createElement(TasksAndActivities, null);
      break;
    case contentTypes.ASSESSMENT_RESOURCES:
      icon = React.createElement(AssessmentResource, null);
      break;
    case contentTypes.SUBJECT:
      icon = React.createElement(Subject, null);
      break;
    case contentTypes.EXTERNAL_LEARNING_RESOURCES:
      icon = React.createElement(ExternalLearningResource, null);
      break;
    case contentTypes.SOURCE_MATERIAL:
      icon = React.createElement(SharedResource, null);
      break;
    case contentTypes.LEARNING_PATH:
      icon = React.createElement(LearningPath, null);
      break;
    default:
      break;
  }
  return React.createElement(
    'div',
    classes('', modifiers),
    icon
  );
};

ContentTypeBadge.propTypes = {
  size: PropTypes.oneOf(['xx-small', 'x-small', 'small', 'large']),
  type: ContentTypeShape,
  background: PropTypes.bool
};

ContentTypeBadge.defaultProps = {
  size: 'small'
};

export var SubjectMaterialBadge = function SubjectMaterialBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.SUBJECT_MATERIAL }));
};
export var TasksAndActivitiesBadge = function TasksAndActivitiesBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.TASKS_AND_ACTIVITIES }));
};
export var AssessmentResourcesBadge = function AssessmentResourcesBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.ASSESSMENT_RESOURCES }));
};
export var SubjectBadge = function SubjectBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.SUBJECT }));
};
export var ExternalLearningResourcesBadge = function ExternalLearningResourcesBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, {
    type: contentTypes.EXTERNAL_LEARNING_RESOURCES
  }));
};
export var SourceMaterialBadge = function SourceMaterialBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.SOURCE_MATERIAL }));
};

export var LearningPathBadge = function LearningPathBadge(props) {
  return React.createElement(ContentTypeBadge, _extends({}, props, { type: contentTypes.LEARNING_PATH }));
};