2015-02-25 08:19:47 +08:00
|
|
|
React = require 'react/addons'
|
|
|
|
moment = require 'moment'
|
2015-05-16 01:53:00 +08:00
|
|
|
{Utils} = require 'nylas-exports'
|
2015-02-25 08:19:47 +08:00
|
|
|
|
2015-05-20 06:59:37 +08:00
|
|
|
class DeveloperBarLongPollItem extends React.Component
|
|
|
|
@displayName: 'DeveloperBarLongPollItem'
|
2015-02-25 08:19:47 +08:00
|
|
|
|
2015-05-01 04:08:29 +08:00
|
|
|
constructor: (@props) ->
|
|
|
|
@state = expanded: false
|
2015-02-25 08:19:47 +08:00
|
|
|
|
2015-05-15 05:12:53 +08:00
|
|
|
shouldComponentUpdate: (nextProps, nextState) =>
|
|
|
|
return not Utils.isEqualReact(nextProps, @props) or not Utils.isEqualReact(nextState, @state)
|
|
|
|
|
2015-05-01 04:08:29 +08:00
|
|
|
render: =>
|
2015-02-25 08:19:47 +08:00
|
|
|
if @state.expanded
|
|
|
|
payload = JSON.stringify(@props.item)
|
|
|
|
else
|
|
|
|
payload = []
|
|
|
|
|
|
|
|
itemId = @props.item.id
|
|
|
|
itemVersion = @props.item.version || @props.item.attributes?.version
|
|
|
|
itemId += " (version #{itemVersion})" if itemVersion
|
|
|
|
|
|
|
|
timestamp = moment(@props.item.timestamp).format("h:mm:ss")
|
|
|
|
|
2015-07-23 02:18:23 +08:00
|
|
|
classname = "item"
|
|
|
|
right = @props.item.cursor
|
|
|
|
|
2015-12-29 10:10:17 +08:00
|
|
|
if @props.ignoredBecause
|
2015-07-23 02:18:23 +08:00
|
|
|
classname += " ignored"
|
2015-12-29 10:10:17 +08:00
|
|
|
right = @props.ignoredBecause + " - " + right
|
2015-07-23 02:18:23 +08:00
|
|
|
|
|
|
|
<div className={classname} onClick={ => @setState expanded: not @state?.expanded}>
|
|
|
|
<div className="cursor">{right}</div>
|
2015-02-25 08:19:47 +08:00
|
|
|
{" #{timestamp}: #{@props.item.event} #{@props.item.object} #{itemId}"}
|
|
|
|
<div className="payload" onClick={ (e) -> e.stopPropagation() }>
|
|
|
|
{payload}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
2015-05-01 04:08:29 +08:00
|
|
|
|
|
|
|
|
2015-05-20 06:59:37 +08:00
|
|
|
module.exports = DeveloperBarLongPollItem
|