summaryrefslogtreecommitdiffstats
path: root/webapp/components/file_attachment_list_container.jsx
blob: f9ad3814c1d2a7b35e0ee212e088baeaacd25478 (plain)
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
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.

import React from 'react';

import * as AsyncClient from 'utils/async_client.jsx';
import FileStore from 'stores/file_store.jsx';

import FileAttachmentList from './file_attachment_list.jsx';

export default class FileAttachmentListContainer extends React.Component {
    static propTypes = {
        post: React.PropTypes.object.isRequired,
        compactDisplay: React.PropTypes.bool.isRequired
    }

    constructor(props) {
        super(props);

        this.handleFileChange = this.handleFileChange.bind(this);

        this.state = {
            fileInfos: FileStore.getInfosForPost(props.post.id)
        };
    }

    componentDidMount() {
        FileStore.addChangeListener(this.handleFileChange);

        if (this.props.post.id && !FileStore.hasInfosForPost(this.props.post.id)) {
            AsyncClient.getFileInfosForPost(this.props.post.channel_id, this.props.post.id);
        }
    }

    componentWillReceiveProps(nextProps) {
        if (nextProps.post.id !== this.props.post.id) {
            this.setState({
                fileInfos: FileStore.getInfosForPost(nextProps.post.id)
            });

            if (nextProps.post.id && !FileStore.hasInfosForPost(nextProps.post.id)) {
                AsyncClient.getFileInfosForPost(nextProps.post.channel_id, nextProps.post.id);
            }
        }
    }

    shouldComponentUpdate(nextProps, nextState) {
        if (this.props.post.id !== nextProps.post.id) {
            return true;
        }

        if (this.props.compactDisplay !== nextProps.compactDisplay) {
            return true;
        }

        // fileInfos are treated as immutable by the FileStore
        if (nextState.fileInfos !== this.state.fileInfos) {
            return true;
        }

        return false;
    }

    handleFileChange() {
        this.setState({
            fileInfos: FileStore.getInfosForPost(this.props.post.id)
        });
    }

    componentWillUnmount() {
        FileStore.removeChangeListener(this.handleFileChange);
    }

    render() {
        let fileCount = 0;
        if (this.props.post.file_ids) {
            fileCount = this.props.post.file_ids.length;
        } else if (this.props.post.filenames) {
            fileCount = this.props.post.filenames.length;
        }

        return (
            <FileAttachmentList
                fileCount={fileCount}
                fileInfos={this.state.fileInfos}
                compactDisplay={this.props.compactDisplay}
            />
        );
    }
}