import React, { Component } from 'react';
import Autolinker from 'autolinker';
import pure from 'pure-render-decorator';
import { timestamp } from '../util';

@pure
export default class Search extends Component {
  render() {
    const { result } = this.props;
    const content = Autolinker.link(result.content, { stripPrefix: false });

    const style = {
      paddingLeft: `${window.messageIndent}px`,
      textIndent: `-${window.messageIndent}px`
    };

    return (
      <p className="search-result" style={style}>
        <span className="message-time">{timestamp(new Date(result.time * 1000))}</span>
        <span>
          {' '}
          <span className="message-sender">{result.from}</span>
        </span>
        <span dangerouslySetInnerHTML={{ __html: ` ${content}` }} />
      </p>
    );
  }
}