webapp/components/post_view/components/floating_timestamp.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59

// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.

import {FormattedDate} from 'react-intl';

import React from 'react';
import PureRenderMixin from 'react-addons-pure-render-mixin';

export default class FloatingTimestamp extends React.Component {
    constructor(props) {
        super(props);

        this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
    }

    render() {
        if (!this.props.isMobile) {
            return <noscript/>;
        }

        if (this.props.createAt === 0) {
            return <noscript/>;
        }

        const dateString = (
            <FormattedDate
                value={this.props.createAt}
                weekday='short'
                day='2-digit'
                month='short'
                year='numeric'
            />
        );

        let className = 'post-list__timestamp';
        if (this.props.isScrolling) {
            className += ' scrolling';
        }

        if (this.props.isRhsPost) {
            className += ' rhs';
        }

        return (
            <div className={className}>
                <div>
                    <span>{dateString}</span>
                </div>
            </div>
        );
    }
}

FloatingTimestamp.propTypes = {
    isScrolling: React.PropTypes.bool.isRequired,
    isMobile: React.PropTypes.bool,
    createAt: React.PropTypes.number,
    isRhsPost: React.PropTypes.bool
};