import React from 'react'

class AttachmentVideo extends React.Component {
  render() {
    let videoPreviewSrc = this.props.video.photo_640 || this.props.video.photo_800

    return (
      <a className="video" href={ this.props.postLink }>
        <div className="preview">
          <img src={ videoPreviewSrc } />
          <div className="play-icon">
            <i className="fa fa-play" />
          </div>
        </div>
        <div className="title">{ this.props.video.title }</div>
      </a>
    )
  }
}

export default class Attachments extends React.Component {
  render() {
    if (!this.props.attachments) {
      return null
    }

    let videos = []
    let photos = []
    let links = []

    this.props.attachments.forEach((attachment, index) => {
      if (attachment.type == "photo") {
        photos.push(<img src={ attachment.photo.photo_604 } className="photo" key={ index }/>)
      }
      if (attachment.type == "link") {
        links.push(<a href={ attachment.link.url } className="link" key={ index }>{ attachment.link.url }</a>)
      }
      if (attachment.type == "video") {
        videos.push(<AttachmentVideo postLink={ this.props.postLink } video= { attachment.video } key={ index } />)
      }
    })

    return (
      <div className="attachments">
        <div className="videos">{ videos }</div>
        <div className="photos">{ photos }</div>
        <div className="links">{ links }</div>
      </div>
    )
  }
}

@@ -20,16 +20,201 @@
 react'%0A%0A
+class AttachmentLink extends React.Component %7B%0A  render() %7B%0A    return (%0A      %3Ca href=%7B this.props.link.url %7D className=%22link%22%3E%0A        %7B this.props.link.url %7D%0A      %3C/a%3E%0A    )%0A  %7D%0A%7D%0A%0A
 class At
@@ -1153,96 +1153,63 @@
 sh(%3C
-a href=%7B attachment.link.url %7D className=%22link%22 key=%7B index %7D%3E%7B attachment.link.url %7D%3C/a
+AttachmentLink link=%7B attachment.link %7D key=%7B index %7D /
 %3E)%0A 
@@ -1331,17 +1331,16 @@
 %7D video=
- 
 %7B attach

Introduce AttachmentLink component