React = require 'react' _ = require "underscore" {EventedIFrame} = require 'nylas-component-kit' {QuotedHTMLParser} = require 'nylas-exports' class EmailFrame extends React.Component @displayName = 'EmailFrame' render: => componentDidMount: => @_mounted = true @_writeContent() @_setFrameHeight() componentWillUnmount: => @_mounted = false componentDidUpdate: => @_writeContent() @_setFrameHeight() shouldComponentUpdate: (newProps, newState) => # Turns out, React is not able to tell if props.children has changed, # so whenever the message list updates each email-frame is repopulated, # often with the exact same content. To avoid unnecessary calls to # _writeContent, we do a quick check for deep equality. !_.isEqual(newProps, @props) _writeContent: => wrapperClass = if @props.showQuotedText then "show-quoted-text" else "" doc = React.findDOMNode(@).contentDocument doc.open() EmailFixingStyles = document.querySelector('[source-path*="email-frame.less"]')?.innerText EmailFixingStyles = EmailFixingStyles.replace(/.ignore-in-parent-frame/g, '') if (EmailFixingStyles) doc.write("") doc.write("
#{@_emailContent()}
") doc.close() # Notify the EventedIFrame that we've replaced it's document (with `open`) # so it can attach event listeners again. @refs.iframe.documentWasReplaced() _setFrameHeight: => _.defer => return unless @_mounted domNode = React.findDOMNode(@) doc = domNode.contentDocument height = doc.getElementById("inbox-html-wrapper").scrollHeight if domNode.height != "#{height}px" domNode.height = "#{height}px" unless domNode?.contentDocument?.readyState is 'complete' @_setFrameHeight() _emailContent: => email = @props.children # When showing quoted text, always return the pure content if @props.showQuotedText email else QuotedHTMLParser.hideQuotedHTML(email) module.exports = EmailFrame