From 981ea33b8e10456bc279f36235c814305d01b243 Mon Sep 17 00:00:00 2001
From: Joram Wilander <jwawilander@gmail.com>
Date: Thu, 24 Nov 2016 09:35:09 -0500
Subject: PLT-4403 Add server-based channel autocomplete, search and paging
 (#4585)

* Add more channel paging API

* Add channel paging support to client

* Add DB channel search functions

* Add API for searching more channels

* Add more channel search functionality to client

* Add API for autocompleting channels

* Add channel autocomplete functionality to the client

* Move to be deprecated APIs to their own file

* Final clean-up

* Fixes related to feedback

* Localization changes

* Add unit as suffix to timeout constants
---
 webapp/components/filtered_channel_list.jsx | 180 ----------------------------
 1 file changed, 180 deletions(-)
 delete mode 100644 webapp/components/filtered_channel_list.jsx

(limited to 'webapp/components/filtered_channel_list.jsx')

diff --git a/webapp/components/filtered_channel_list.jsx b/webapp/components/filtered_channel_list.jsx
deleted file mode 100644
index 64d033bc5..000000000
--- a/webapp/components/filtered_channel_list.jsx
+++ /dev/null
@@ -1,180 +0,0 @@
-// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
-// See License.txt for license information.
-
-import $ from 'jquery';
-import ReactDOM from 'react-dom';
-import * as UserAgent from 'utils/user_agent.jsx';
-
-import {localizeMessage} from 'utils/utils.jsx';
-import {FormattedMessage} from 'react-intl';
-
-import React from 'react';
-import loadingGif from 'images/load.gif';
-
-export default class FilteredChannelList extends React.Component {
-    constructor(props) {
-        super(props);
-
-        this.handleFilterChange = this.handleFilterChange.bind(this);
-        this.createChannelRow = this.createChannelRow.bind(this);
-        this.filterChannels = this.filterChannels.bind(this);
-
-        this.state = {
-            filter: '',
-            joiningChannel: '',
-            channels: this.filterChannels(props.channels)
-        };
-    }
-
-    componentWillReceiveProps(nextProps) {
-        // assume the channel list is immutable
-        if (this.props.channels !== nextProps.channels) {
-            this.setState({
-                channels: this.filterChannels(nextProps.channels)
-            });
-        }
-    }
-
-    componentDidMount() {
-        // only focus the search box on desktop so that we don't cause the keyboard to open on mobile
-        if (!UserAgent.isMobile()) {
-            ReactDOM.findDOMNode(this.refs.filter).focus();
-        }
-    }
-
-    componentDidUpdate(prevProps, prevState) {
-        if (prevState.filter !== this.state.filter) {
-            $(ReactDOM.findDOMNode(this.refs.channelList)).scrollTop(0);
-        }
-    }
-
-    handleJoin(channel) {
-        this.setState({joiningChannel: channel.id});
-        this.props.handleJoin(
-            channel,
-            () => {
-                this.setState({joiningChannel: ''});
-            });
-    }
-
-    createChannelRow(channel) {
-        let joinButton;
-        if (this.state.joiningChannel === channel.id) {
-            joinButton = (
-                <img
-                    className='join-channel-loading-gif'
-                    src={loadingGif}
-                />
-            );
-        } else {
-            joinButton = (
-                <button
-                    onClick={this.handleJoin.bind(this, channel)}
-                    className='btn btn-primary'
-                >
-                    <FormattedMessage
-                        id='more_channels.join'
-                        defaultMessage='Join'
-                    />
-                </button>
-            );
-        }
-
-        return (
-            <div
-                className='more-modal__row'
-                key={channel.id}
-            >
-                <div className='more-modal__details'>
-                    <p className='more-modal__name'>{channel.display_name}</p>
-                    <p className='more-modal__description'>{channel.purpose}</p>
-                </div>
-                <div className='more-modal__actions'>
-                    {joinButton}
-                </div>
-            </div>
-        );
-    }
-
-    filterChannels(channels) {
-        if (!this.state || !this.state.filter) {
-            return channels;
-        }
-
-        return channels.filter((chan) => {
-            const filter = this.state.filter.toLowerCase();
-            return Boolean((chan.name.toLowerCase().indexOf(filter) !== -1 || chan.display_name.toLowerCase().indexOf(filter) !== -1) && chan.delete_at === 0);
-        });
-    }
-
-    handleFilterChange(e) {
-        this.setState({
-            filter: e.target.value
-        });
-    }
-
-    render() {
-        let channels = this.state.channels;
-
-        if (this.state.filter && this.state.filter.length > 0) {
-            channels = this.filterChannels(channels);
-        }
-
-        let count;
-        if (channels.length === this.props.channels.length) {
-            count = (
-                <FormattedMessage
-                    id='filtered_channels_list.count'
-                    defaultMessage='{count} {count, plural, =0 {0 channels} one {channel} other {channels}}'
-                    values={{
-                        count: channels.length
-                    }}
-                />
-            );
-        } else {
-            count = (
-                <FormattedMessage
-                    id='filtered_channels_list.countTotal'
-                    defaultMessage='{count} {count, plural, =0 {0 channels} one {channel} other {channels}} of {total} Total'
-                    values={{
-                        count: channels.length,
-                        total: this.props.channels.length
-                    }}
-                />
-            );
-        }
-
-        return (
-            <div className='filtered-user-list'>
-                <div className='filter-row'>
-                    <div className='col-sm-6'>
-                        <input
-                            ref='filter'
-                            className='form-control filter-textbox'
-                            placeholder={localizeMessage('filtered_channels_list.search', 'Search channels')}
-                            onInput={this.handleFilterChange}
-                        />
-                    </div>
-                    <div className='col-sm-12'>
-                        <span className='channel-count pull-left'>{count}</span>
-                    </div>
-                </div>
-                <div
-                    ref='channelList'
-                    className='more-modal__list'
-                >
-                    {channels.map(this.createChannelRow)}
-                </div>
-            </div>
-        );
-    }
-}
-
-FilteredChannelList.defaultProps = {
-    channels: []
-};
-
-FilteredChannelList.propTypes = {
-    channels: React.PropTypes.arrayOf(React.PropTypes.object),
-    handleJoin: React.PropTypes.func.isRequired
-};
-- 
cgit v1.2.3-1-g7c22

