{"size": 2712, "ext": "js", "max_stars_repo_path": "mm-react/src/components/logging/LogLine.js", "max_stars_repo_name": "gridgentoo/tickgrinder", "max_stars_repo_stars_event_min_datetime": "2017-01-25T08:37:34.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-25T05:35:52.000Z", "max_issues_repo_path": "mm-react/src/components/logging/LogLine.js", "max_issues_repo_name": "karthikbm/tickgrinder", "max_issues_repo_issues_event_min_datetime": "2017-01-12T09:10:00.000Z", "max_issues_repo_issues_event_max_datetime": "2019-05-18T09:18:55.000Z", "max_forks_repo_path": "mm-react/src/components/logging/LogLine.js", "max_forks_repo_name": "karthikbm/tickgrinder", "max_forks_repo_forks_event_min_datetime": "2017-01-12T09:59:24.000Z", "max_forks_repo_forks_event_max_datetime": "2022-03-25T22:49:13.000Z"}
{"max_stars_count": 444, "max_issues_count": 9, "max_forks_count": 111, "avg_line_length": 23.5826086957, "max_line_length": 93, "alphanum_fraction": 0.6187315634}
//! A single log line entry

import { connect } from 'dva';
import React from 'react';
import { Row, Col, Tag, Tooltip } from 'antd';
const CheckableTag = Tag.CheckableTag;

import { InstanceShape } from '../../utils/commands';
import logStyles from '../../static/css/logging.css';

/// Render a pretty severity level
const Severity = connect()(({dispatch, level, onClick, closable}) => {
  let color;
  switch(level) {
  case 'Debug':
    color = 'cyan-inverse';
    break;
  case 'Notice':
    color = 'blue-inverse';
    break;
  case 'Warning':
    color = 'yellow-inverse';
    break;
  case 'Error':
    color = 'orange-inverse';
    break;
  case 'Critical':
    color = 'red-inverse';
    break;
  }

  const handleClick = () => {
    onClick(dispatch, level);
  };

  return (
    <Tag
      closable={closable}
      color={color}
      onClick={handleClick}
    >
      {level}
    </Tag>);
});

const StaticInstance = ({dispatch, sender}) => {
  let instance_type = sender.instance_type;
  const handleChange = () => dispatch({type: 'logging/instanceAdded', item: sender});

  return (
    <Tooltip
      placement="right"
      title={sender.uuid}
    >
      <CheckableTag onChange={handleChange}>
        {instance_type}
      </CheckableTag>
    </Tooltip>
  );
};

StaticInstance.propTypes = {
  dispatch: React.PropTypes.func.isRequired,
  sender: React.PropTypes.shape({
    instance_type: React.PropTypes.string.isRequired,
    uuid: React.PropTypes.string.isRequired,
  }).isRequired,
};

const MessageType = connect()(({dispatch, children}) => {
  const handleChange = () => dispatch({type: 'logging/categoryAdded', item: children});
  return <CheckableTag onChange={handleChange}>{children}</CheckableTag>;
});

const LogLine = ({dispatch, msg}) => {
  const handleClick = dispatch => dispatch({type: 'logging/severityAdded', item: msg.level});

  return (
    <Row
      align="middle"
      className={msg.level + ' ' + logStyles.logLine}
      justify="space-around"
      type="flex"
    >
      <Col span={2}>
        <StaticInstance
          dispatch={dispatch}
          sender={msg.sender}
        />
      </Col>
      <Col span={2}><MessageType>{msg.message_type}</MessageType></Col>
      <Col span={18}><div>{msg.message}</div></Col>
      <Col span={2}>
        <Severity
          level={msg.level}
          onClick={handleClick}
        />
      </Col>
    </Row>
  );
};

LogLine.propTypes = {
  dispatch: React.PropTypes.func.isRequired,
  msg: React.PropTypes.shape({
    level: React.PropTypes.string.isRequired,
    sender: React.PropTypes.shape(InstanceShape).isRequired,
  }).isRequired,
};

export default {
  LogLine: connect()(LogLine),
  Severity: Severity,
};
