context = window

@SessionNotification = React.createClass({

  render: () ->

    classes = classNames({
        'session-notification' : true
        'has-details' : @props.detail?
    })

    help = `<a rel="external" href={this.props.help} className="notify-help">?</a>` if @props.help?

    title = `<div className="msg">{this.props.title}{help}</div>`
    extra = `<div className="detail">{this.props.extra}</div>` if @props.extra?

    `<div className={classes}>
      {title}
      {extra}
    </div>`

  componentDidMount: () ->

    $root = $(@getDOMNode())
    context.JK.popExternalLinks($root)

    if @props.detail?
      context.JK.hoverBubble($root, @props.detail, {offsetParent:$root.closest('.top-parent'), positions: ['left', 'bottom']})
})