From 9de236ca9c67749c81ac7edf33924b36447064df Mon Sep 17 00:00:00 2001
From: Harrison Healey <harrisonmhealey@gmail.com>
Date: Tue, 29 Mar 2016 10:15:03 -0400
Subject: Removed incoming and outgoing webhooks from user settings

---
 .../user_settings/manage_incoming_hooks.jsx        | 225 ------------
 .../user_settings/manage_outgoing_hooks.jsx        | 397 ---------------------
 .../user_settings/user_settings_integrations.jsx   |  88 +----
 3 files changed, 1 insertion(+), 709 deletions(-)
 delete mode 100644 webapp/components/user_settings/manage_incoming_hooks.jsx
 delete mode 100644 webapp/components/user_settings/manage_outgoing_hooks.jsx

(limited to 'webapp/components/user_settings')

diff --git a/webapp/components/user_settings/manage_incoming_hooks.jsx b/webapp/components/user_settings/manage_incoming_hooks.jsx
deleted file mode 100644
index b61b331ce..000000000
--- a/webapp/components/user_settings/manage_incoming_hooks.jsx
+++ /dev/null
@@ -1,225 +0,0 @@
-// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
-// See License.txt for license information.
-
-import * as Client from 'utils/client.jsx';
-import * as Utils from 'utils/utils.jsx';
-import Constants from 'utils/constants.jsx';
-import ChannelStore from 'stores/channel_store.jsx';
-import LoadingScreen from '../loading_screen.jsx';
-
-import {FormattedMessage, FormattedHTMLMessage} from 'react-intl';
-
-import React from 'react';
-
-export default class ManageIncomingHooks extends React.Component {
-    constructor() {
-        super();
-
-        this.getHooks = this.getHooks.bind(this);
-        this.addNewHook = this.addNewHook.bind(this);
-        this.updateChannelId = this.updateChannelId.bind(this);
-
-        this.state = {hooks: [], channelId: ChannelStore.getByName(Constants.DEFAULT_CHANNEL).id, getHooksComplete: false};
-    }
-    componentDidMount() {
-        this.getHooks();
-    }
-    addNewHook() {
-        const hook = {};
-        hook.channel_id = this.state.channelId;
-
-        Client.addIncomingHook(
-            hook,
-            (data) => {
-                let hooks = this.state.hooks;
-                if (!hooks) {
-                    hooks = [];
-                }
-                hooks.push(data);
-                this.setState({hooks});
-            },
-            (err) => {
-                this.setState({serverError: err});
-            }
-        );
-    }
-    removeHook(id) {
-        const data = {};
-        data.id = id;
-
-        Client.deleteIncomingHook(
-            data,
-            () => {
-                const hooks = this.state.hooks;
-                let index = -1;
-                for (let i = 0; i < hooks.length; i++) {
-                    if (hooks[i].id === id) {
-                        index = i;
-                        break;
-                    }
-                }
-
-                if (index !== -1) {
-                    hooks.splice(index, 1);
-                }
-
-                this.setState({hooks});
-            },
-            (err) => {
-                this.setState({serverError: err});
-            }
-        );
-    }
-    getHooks() {
-        Client.listIncomingHooks(
-            (data) => {
-                const state = this.state;
-
-                if (data) {
-                    state.hooks = data;
-                }
-
-                state.getHooksComplete = true;
-                this.setState(state);
-            },
-            (err) => {
-                this.setState({serverError: err});
-            }
-        );
-    }
-    updateChannelId(e) {
-        this.setState({channelId: e.target.value});
-    }
-    render() {
-        let serverError;
-        if (this.state.serverError) {
-            serverError = <label className='has-error'>{this.state.serverError}</label>;
-        }
-
-        const channels = ChannelStore.getAll();
-        const options = [];
-        channels.forEach((channel) => {
-            if (channel.type !== Constants.DM_CHANNEL) {
-                options.push(
-                    <option
-                        key={'incoming-hook' + channel.id}
-                        value={channel.id}
-                    >
-                        {channel.display_name}
-                    </option>
-                );
-            }
-        });
-
-        let disableButton = '';
-        if (this.state.channelId === '') {
-            disableButton = ' disable';
-        }
-
-        const hooks = [];
-        this.state.hooks.forEach((hook) => {
-            const c = ChannelStore.get(hook.channel_id);
-            if (c) {
-                hooks.push(
-                    <div
-                        key={hook.id}
-                        className='webhook__item'
-                    >
-                        <div className='padding-top x2 webhook__url'>
-                            <strong>{'URL: '}</strong>
-                            <span className='word-break--all'>{Utils.getWindowLocationOrigin() + '/hooks/' + hook.id}</span>
-                        </div>
-                        <div className='padding-top'>
-                            <strong>
-                                <FormattedMessage
-                                    id='user.settings.hooks_in.channel'
-                                    defaultMessage='Channel: '
-                                />
-                            </strong>{c.display_name}
-                        </div>
-                        <a
-                            className={'webhook__remove'}
-                            href='#'
-                            onClick={this.removeHook.bind(this, hook.id)}
-                        >
-                            <span aria-hidden='true'>{'×'}</span>
-                        </a>
-                        <div className='padding-top x2 divider-light'></div>
-                    </div>
-                );
-            }
-        });
-
-        let displayHooks;
-        if (!this.state.getHooksComplete) {
-            displayHooks = <LoadingScreen/>;
-        } else if (hooks.length > 0) {
-            displayHooks = hooks;
-        } else {
-            displayHooks = (
-                <div className='padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_in.none'
-                        defaultMessage='None'
-                    />
-                </div>
-            );
-        }
-
-        const existingHooks = (
-            <div className='webhooks__container'>
-                <label className='control-label padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_in.existing'
-                        defaultMessage='Existing incoming webhooks'
-                    />
-                </label>
-                <div className='padding-top divider-light'></div>
-                <div className='webhooks__list'>
-                    {displayHooks}
-                </div>
-            </div>
-        );
-
-        return (
-            <div key='addIncomingHook'>
-                <FormattedHTMLMessage
-                    id='user.settings.hooks_in.description'
-                    defaultMessage='Create webhook URLs for use in external integrations. Please see <a href="http://docs.mattermost.com/developer/webhooks-incoming.html" target="_blank">incoming webhooks documentation</a> to learn more. View all incoming webhooks configured on this team below.'
-                />
-                <div><label className='control-label padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_in.addTitle'
-                        defaultMessage='Add a new incoming webhook'
-                    />
-                </label></div>
-                <div className='row padding-top'>
-                    <div className='col-sm-10 padding-bottom'>
-                        <select
-                            ref='channelName'
-                            className='form-control'
-                            value={this.state.channelId}
-                            onChange={this.updateChannelId}
-                        >
-                            {options}
-                        </select>
-                        {serverError}
-                    </div>
-                    <div className='col-sm-2 col-xs-4 no-padding--left padding-bottom'>
-                        <a
-                            className={'btn form-control no-padding btn-sm btn-primary' + disableButton}
-                            href='#'
-                            onClick={this.addNewHook}
-                        >
-                            <FormattedMessage
-                                id='user.settings.hooks_in.add'
-                                defaultMessage='Add'
-                            />
-                        </a>
-                    </div>
-                </div>
-                {existingHooks}
-            </div>
-        );
-    }
-}
diff --git a/webapp/components/user_settings/manage_outgoing_hooks.jsx b/webapp/components/user_settings/manage_outgoing_hooks.jsx
deleted file mode 100644
index 8adec09ce..000000000
--- a/webapp/components/user_settings/manage_outgoing_hooks.jsx
+++ /dev/null
@@ -1,397 +0,0 @@
-// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
-// See License.txt for license information.
-
-import LoadingScreen from '../loading_screen.jsx';
-
-import ChannelStore from 'stores/channel_store.jsx';
-
-import * as Client from 'utils/client.jsx';
-import Constants from 'utils/constants.jsx';
-
-import {intlShape, injectIntl, defineMessages, FormattedMessage, FormattedHTMLMessage} from 'react-intl';
-
-const holders = defineMessages({
-    optional: {
-        id: 'user.settings.hooks_out.optional',
-        defaultMessage: 'Optional if channel selected'
-    },
-    callbackHolder: {
-        id: 'user.settings.hooks_out.callbackHolder',
-        defaultMessage: 'Each URL must start with http:// or https://'
-    },
-    select: {
-        id: 'user.settings.hooks_out.select',
-        defaultMessage: '--- Select a channel ---'
-    }
-});
-
-import React from 'react';
-
-class ManageOutgoingHooks extends React.Component {
-    constructor() {
-        super();
-
-        this.getHooks = this.getHooks.bind(this);
-        this.addNewHook = this.addNewHook.bind(this);
-        this.updateChannelId = this.updateChannelId.bind(this);
-        this.updateTriggerWords = this.updateTriggerWords.bind(this);
-        this.updateCallbackURLs = this.updateCallbackURLs.bind(this);
-
-        this.state = {hooks: [], channelId: '', triggerWords: '', callbackURLs: '', getHooksComplete: false};
-    }
-    componentDidMount() {
-        this.getHooks();
-    }
-    addNewHook(e) {
-        e.preventDefault();
-
-        if ((this.state.channelId === '' && this.state.triggerWords === '') ||
-                this.state.callbackURLs === '') {
-            return;
-        }
-
-        const hook = {};
-        hook.channel_id = this.state.channelId;
-        if (this.state.triggerWords.length !== 0) {
-            hook.trigger_words = this.state.triggerWords.trim().split(',');
-        }
-        hook.callback_urls = this.state.callbackURLs.split('\n').map((url) => url.trim());
-
-        Client.addOutgoingHook(
-            hook,
-            (data) => {
-                let hooks = Object.assign([], this.state.hooks);
-                if (!hooks) {
-                    hooks = [];
-                }
-                hooks.push(data);
-                this.setState({hooks, addError: null, channelId: '', triggerWords: '', callbackURLs: ''});
-            },
-            (err) => {
-                this.setState({addError: err.message});
-            }
-        );
-    }
-    removeHook(id) {
-        const data = {};
-        data.id = id;
-
-        Client.deleteOutgoingHook(
-            data,
-            () => {
-                const hooks = this.state.hooks;
-                let index = -1;
-                for (let i = 0; i < hooks.length; i++) {
-                    if (hooks[i].id === id) {
-                        index = i;
-                        break;
-                    }
-                }
-
-                if (index !== -1) {
-                    hooks.splice(index, 1);
-                }
-
-                this.setState({hooks});
-            },
-            (err) => {
-                this.setState({editError: err.message});
-            }
-        );
-    }
-    regenToken(id) {
-        const regenData = {};
-        regenData.id = id;
-
-        Client.regenOutgoingHookToken(
-            regenData,
-            (data) => {
-                const hooks = Object.assign([], this.state.hooks);
-                for (let i = 0; i < hooks.length; i++) {
-                    if (hooks[i].id === id) {
-                        hooks[i] = data;
-                        break;
-                    }
-                }
-
-                this.setState({hooks, editError: null});
-            },
-            (err) => {
-                this.setState({editError: err.message});
-            }
-        );
-    }
-    getHooks() {
-        Client.listOutgoingHooks(
-            (data) => {
-                if (data) {
-                    this.setState({hooks: data, getHooksComplete: true, editError: null});
-                }
-            },
-            (err) => {
-                this.setState({editError: err.message});
-            }
-        );
-    }
-    updateChannelId(e) {
-        this.setState({channelId: e.target.value});
-    }
-    updateTriggerWords(e) {
-        this.setState({triggerWords: e.target.value});
-    }
-    updateCallbackURLs(e) {
-        this.setState({callbackURLs: e.target.value});
-    }
-    render() {
-        let addError;
-        if (this.state.addError) {
-            addError = <label className='has-error'>{this.state.addError}</label>;
-        }
-        let editError;
-        if (this.state.editError) {
-            addError = <label className='has-error'>{this.state.editError}</label>;
-        }
-
-        const channels = ChannelStore.getAll();
-        const options = [];
-        options.push(
-            <option
-                key='select-channel'
-                value=''
-            >
-                {this.props.intl.formatMessage(holders.select)}
-            </option>
-        );
-
-        channels.forEach((channel) => {
-            if (channel.type === Constants.OPEN_CHANNEL) {
-                options.push(
-                    <option
-                        key={'outgoing-hook' + channel.id}
-                        value={channel.id}
-                    >
-                        {channel.display_name}
-                    </option>
-                );
-            }
-        });
-
-        const hooks = [];
-        this.state.hooks.forEach((hook) => {
-            const c = ChannelStore.get(hook.channel_id);
-
-            if (!c && hook.channel_id && hook.channel_id.length !== 0) {
-                return;
-            }
-
-            let channelDiv;
-            if (c) {
-                channelDiv = (
-                    <div className='padding-top'>
-                        <strong>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.channel'
-                                defaultMessage='Channel: '
-                            />
-                        </strong>{c.display_name}
-                    </div>
-                );
-            }
-
-            let triggerDiv;
-            if (hook.trigger_words && hook.trigger_words.length !== 0) {
-                triggerDiv = (
-                    <div className='padding-top'>
-                        <strong>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.trigger'
-                                defaultMessage='Trigger Words: '
-                            />
-                        </strong>{hook.trigger_words.join(', ')}
-                    </div>
-                );
-            }
-
-            hooks.push(
-                <div
-                    key={hook.id}
-                    className='webhook__item'
-                >
-                    <div className='padding-top x2 webhook__url'>
-                        <strong>{'URLs: '}</strong><span className='word-break--all'>{hook.callback_urls.join(', ')}</span>
-                    </div>
-                    {channelDiv}
-                    {triggerDiv}
-                    <div className='padding-top'>
-                        <strong>{'Token: '}</strong>{hook.token}
-                    </div>
-                    <div className='padding-top'>
-                        <a
-                            className='text-danger'
-                            href='#'
-                            onClick={this.regenToken.bind(this, hook.id)}
-                        >
-                            <FormattedMessage
-                                id='user.settings.hooks_out.regen'
-                                defaultMessage='Regen Token'
-                            />
-                        </a>
-                        <a
-                            className='webhook__remove'
-                            href='#'
-                            onClick={this.removeHook.bind(this, hook.id)}
-                        >
-                            <span aria-hidden='true'>{'×'}</span>
-                        </a>
-                    </div>
-                    <div className='padding-top x2 divider-light'></div>
-                </div>
-            );
-        });
-
-        let displayHooks;
-        if (!this.state.getHooksComplete) {
-            displayHooks = <LoadingScreen/>;
-        } else if (hooks.length > 0) {
-            displayHooks = hooks;
-        } else {
-            displayHooks = (
-                <div className='padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_out.none'
-                        defaultMessage='None'
-                    />
-                </div>
-            );
-        }
-
-        const existingHooks = (
-            <div className='webhooks__container'>
-                <label className='control-label padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_out.existing'
-                        defaultMessage='Existing outgoing webhooks'
-                    />
-                </label>
-                <div className='padding-top divider-light'></div>
-                <div className='webhooks__list'>
-                    {displayHooks}
-                </div>
-            </div>
-        );
-
-        const disableButton = (this.state.channelId === '' && this.state.triggerWords === '') || this.state.callbackURLs === '';
-
-        return (
-            <div key='addOutgoingHook'>
-                <FormattedHTMLMessage
-                    id='user.settings.hooks_out.addDescription'
-                    defaultMessage='Create webhooks to send new message events to an external integration. Please see <a href="http://docs.mattermost.com/developer/webhooks-outgoing.html" target="_blank">outgoing webhooks documentation</a>  to learn more. View all outgoing webhooks configured on this team below.'
-                />
-                <div><label className='control-label padding-top x2'>
-                    <FormattedMessage
-                        id='user.settings.hooks_out.addTitle'
-                        defaultMessage='Add a new outgoing webhook'
-                    />
-                </label></div>
-                <div className='padding-top divider-light'></div>
-                <div className='padding-top'>
-                    <div>
-                        <label className='control-label'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.channel'
-                                defaultMessage='Channel: '
-                            />
-                        </label>
-                        <div className='padding-top'>
-                            <select
-                                ref='channelName'
-                                className='form-control'
-                                value={this.state.channelId}
-                                onChange={this.updateChannelId}
-                            >
-                                {options}
-                            </select>
-                        </div>
-                        <div className='padding-top'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.only'
-                                defaultMessage='Only public channels can be used'
-                            />
-                        </div>
-                    </div>
-                    <div className='padding-top x2'>
-                        <label className='control-label'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.trigger'
-                                defaultMessage='Trigger Words: '
-                            />
-                        </label>
-                        <div className='padding-top'>
-                            <input
-                                ref='triggerWords'
-                                className='form-control'
-                                value={this.state.triggerWords}
-                                onChange={this.updateTriggerWords}
-                                placeholder={this.props.intl.formatMessage(holders.optional)}
-                            />
-                        </div>
-                        <div className='padding-top'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.comma'
-                                defaultMessage='Comma separated words to trigger on'
-                            />
-                        </div>
-                    </div>
-                    <div className='padding-top x2'>
-                        <label className='control-label'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.callback'
-                                defaultMessage='Callback URLs: '
-                            />
-                        </label>
-                        <div className='padding-top'>
-                        <textarea
-                            ref='callbackURLs'
-                            className='form-control no-resize'
-                            value={this.state.callbackURLs}
-                            resize={false}
-                            rows={3}
-                            onChange={this.updateCallbackURLs}
-                            placeholder={this.props.intl.formatMessage(holders.callbackHolder)}
-                        />
-                        </div>
-                        <div className='padding-top'>
-                            <FormattedMessage
-                                id='user.settings.hooks_out.callbackDesc'
-                                defaultMessage='New line separated URLs that will receive the HTTP POST event'
-                            />
-                        </div>
-                        {addError}
-                    </div>
-                    <div className='padding-top padding-bottom'>
-                        <a
-                            className={'btn btn-sm btn-primary'}
-                            href='#'
-                            disabled={disableButton}
-                            onClick={this.addNewHook}
-                        >
-                            <FormattedMessage
-                                id='user.settings.hooks_out.add'
-                                defaultMessage='Add'
-                            />
-                        </a>
-                    </div>
-                </div>
-                {existingHooks}
-                {editError}
-            </div>
-        );
-    }
-}
-
-ManageOutgoingHooks.propTypes = {
-    intl: intlShape.isRequired
-};
-
-export default injectIntl(ManageOutgoingHooks);
diff --git a/webapp/components/user_settings/user_settings_integrations.jsx b/webapp/components/user_settings/user_settings_integrations.jsx
index 9061e34df..37081b863 100644
--- a/webapp/components/user_settings/user_settings_integrations.jsx
+++ b/webapp/components/user_settings/user_settings_integrations.jsx
@@ -4,29 +4,11 @@
 import $ from 'jquery';
 import SettingItemMin from '../setting_item_min.jsx';
 import SettingItemMax from '../setting_item_max.jsx';
-import ManageIncomingHooks from './manage_incoming_hooks.jsx';
-import ManageOutgoingHooks from './manage_outgoing_hooks.jsx';
 import ManageCommandHooks from './manage_command_hooks.jsx';
 
 import {intlShape, injectIntl, defineMessages, FormattedMessage} from 'react-intl';
 
 const holders = defineMessages({
-    inName: {
-        id: 'user.settings.integrations.incomingWebhooks',
-        defaultMessage: 'Incoming Webhooks'
-    },
-    inDesc: {
-        id: 'user.settings.integrations.incomingWebhooksDescription',
-        defaultMessage: 'Manage your incoming webhooks'
-    },
-    outName: {
-        id: 'user.settings.integrations.outWebhooks',
-        defaultMessage: 'Outgoing Webhooks'
-    },
-    outDesc: {
-        id: 'user.settings.integrations.outWebhooksDescription',
-        defaultMessage: 'Manage your outgoing webhooks'
-    },
     cmdName: {
         id: 'user.settings.integrations.commands',
         defaultMessage: 'Slash Commands'
@@ -52,74 +34,10 @@ class UserSettingsIntegrationsTab extends React.Component {
         this.props.updateSection(section);
     }
     render() {
-        let incomingHooksSection;
-        let outgoingHooksSection;
         let commandHooksSection;
         var inputs = [];
         const {formatMessage} = this.props.intl;
 
-        if (global.window.mm_config.EnableIncomingWebhooks === 'true') {
-            if (this.props.activeSection === 'incoming-hooks') {
-                inputs.push(
-                    <ManageIncomingHooks key='incoming-hook-ui'/>
-                );
-
-                incomingHooksSection = (
-                    <SettingItemMax
-                        title={formatMessage(holders.inName)}
-                        width='medium'
-                        inputs={inputs}
-                        updateSection={(e) => {
-                            this.updateSection('');
-                            e.preventDefault();
-                        }}
-                    />
-                );
-            } else {
-                incomingHooksSection = (
-                    <SettingItemMin
-                        title={formatMessage(holders.inName)}
-                        width='medium'
-                        describe={formatMessage(holders.inDesc)}
-                        updateSection={() => {
-                            this.updateSection('incoming-hooks');
-                        }}
-                    />
-                );
-            }
-        }
-
-        if (global.window.mm_config.EnableOutgoingWebhooks === 'true') {
-            if (this.props.activeSection === 'outgoing-hooks') {
-                inputs.push(
-                    <ManageOutgoingHooks key='outgoing-hook-ui'/>
-                );
-
-                outgoingHooksSection = (
-                    <SettingItemMax
-                        title={formatMessage(holders.outName)}
-                        width='medium'
-                        inputs={inputs}
-                        updateSection={(e) => {
-                            this.updateSection('');
-                            e.preventDefault();
-                        }}
-                    />
-                );
-            } else {
-                outgoingHooksSection = (
-                    <SettingItemMin
-                        title={formatMessage(holders.outName)}
-                        width='medium'
-                        describe={formatMessage(holders.outDesc)}
-                        updateSection={() => {
-                            this.updateSection('outgoing-hooks');
-                        }}
-                    />
-                );
-            }
-        }
-
         if (global.window.mm_config.EnableCommands === 'true') {
             if (this.props.activeSection === 'command-hooks') {
                 inputs.push(
@@ -187,10 +105,6 @@ class UserSettingsIntegrationsTab extends React.Component {
                         />
                     </h3>
                     <div className='divider-dark first'/>
-                    {incomingHooksSection}
-                    <div className='divider-light'/>
-                    {outgoingHooksSection}
-                    <div className='divider-dark'/>
                     {commandHooksSection}
                     <div className='divider-dark'/>
                 </div>
@@ -209,4 +123,4 @@ UserSettingsIntegrationsTab.propTypes = {
     collapseModal: React.PropTypes.func.isRequired
 };
 
-export default injectIntl(UserSettingsIntegrationsTab);
\ No newline at end of file
+export default injectIntl(UserSettingsIntegrationsTab);
-- 
cgit v1.2.3-1-g7c22