diff options
Diffstat (limited to 'webapp/components/integrations/components/edit_outgoing_webhook.jsx')
| -rw-r--r-- | webapp/components/integrations/components/edit_outgoing_webhook.jsx | 190 |
1 files changed, 190 insertions, 0 deletions
diff --git a/webapp/components/integrations/components/edit_outgoing_webhook.jsx b/webapp/components/integrations/components/edit_outgoing_webhook.jsx new file mode 100644 index 000000000..2268af923 --- /dev/null +++ b/webapp/components/integrations/components/edit_outgoing_webhook.jsx @@ -0,0 +1,190 @@ +// 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 {browserHistory} from 'react-router/es6'; +import IntegrationStore from 'stores/integration_store.jsx'; +import {loadOutgoingHooks} from 'actions/integration_actions.jsx'; + +import AbstractOutgoingWebhook from './abstract_outgoing_webhook.jsx'; +import ConfirmModal from 'components/confirm_modal.jsx'; +import {FormattedMessage} from 'react-intl'; +import TeamStore from 'stores/team_store.jsx'; + +export default class EditOutgoingWebhook extends AbstractOutgoingWebhook { + constructor(props) { + super(props); + + this.handleIntegrationChange = this.handleIntegrationChange.bind(this); + this.handleConfirmModal = this.handleConfirmModal.bind(this); + this.handleUpdate = this.handleUpdate.bind(this); + this.submitCommand = this.submitCommand.bind(this); + this.confirmModalDismissed = this.confirmModalDismissed.bind(this); + this.originalOutgoingHook = null; + + this.state = { + showConfirmModal: false + }; + } + + componentDidMount() { + IntegrationStore.addChangeListener(this.handleIntegrationChange); + + if (window.mm_config.EnableOutgoingWebhooks === 'true') { + loadOutgoingHooks(); + } + } + + componentWillUnmount() { + IntegrationStore.removeChangeListener(this.handleIntegrationChange); + } + + handleIntegrationChange() { + const teamId = TeamStore.getCurrentId(); + + this.setState({ + hooks: IntegrationStore.getOutgoingWebhooks(teamId), + loading: !IntegrationStore.hasReceivedOutgoingWebhooks(teamId) + }); + + if (!this.state.loading) { + this.originalOutgoingHook = this.state.hooks.filter((hook) => hook.id === this.props.location.query.id)[0]; + + this.setState({ + displayName: this.originalOutgoingHook.display_name, + description: this.originalOutgoingHook.description, + channelId: this.originalOutgoingHook.channel_id, + contentType: this.originalOutgoingHook.content_type, + triggerWhen: this.originalOutgoingHook.trigger_when + }); + + var triggerWords = ''; + if (this.originalOutgoingHook.trigger_words) { + let i = 0; + for (i = 0; i < this.originalOutgoingHook.trigger_words.length; i++) { + triggerWords += this.originalOutgoingHook.trigger_words[i] + '\n'; + } + } + + var callbackUrls = ''; + if (this.originalOutgoingHook.callback_urls) { + let i = 0; + for (i = 0; i < this.originalOutgoingHook.callback_urls.length; i++) { + callbackUrls += this.originalOutgoingHook.callback_urls[i] + '\n'; + } + } + + this.setState({ + triggerWords, + callbackUrls + }); + } + } + + performAction(hook) { + this.newHook = hook; + + if (this.originalOutgoingHook.id) { + hook.id = this.originalOutgoingHook.id; + } + + if (this.originalOutgoingHook.token) { + hook.token = this.originalOutgoingHook.token; + } + + var triggerWordsSame = (this.originalOutgoingHook.trigger_words.length === hook.trigger_words.length) && + this.originalOutgoingHook.trigger_words.every((v, i) => v === hook.trigger_words[i]); + + var callbackUrlsSame = (this.originalOutgoingHook.callback_urls.length === hook.callback_urls.length) && + this.originalOutgoingHook.callback_urls.every((v, i) => v === hook.callback_urls[i]); + + if (this.originalOutgoingHook.content_type !== hook.content_type || + !triggerWordsSame || !callbackUrlsSame) { + this.handleConfirmModal(); + this.setState({ + saving: false + }); + } else { + this.submitCommand(); + } + } + + handleUpdate() { + this.setState({ + saving: true, + serverError: '', + clientError: '' + }); + + this.submitCommand(); + } + + handleConfirmModal() { + this.setState({showConfirmModal: true}); + } + + confirmModalDismissed() { + this.setState({showConfirmModal: false}); + } + + submitCommand() { + AsyncClient.updateOutgoingHook( + this.newHook, + () => { + browserHistory.push(`/${this.props.team.name}/integrations/outgoing_webhooks`); + }, + (err) => { + this.setState({ + saving: false, + showConfirmModal: false, + serverError: err.message + }); + } + ); + } + + header() { + return {id: 'integrations.edit', defaultMessage: 'Edit'}; + } + + footer() { + return {id: 'update_outgoing_webhook.update', defaultMessage: 'Update'}; + } + + renderExtra() { + const confirmButton = ( + <FormattedMessage + id='update_outgoing_webhook.update' + defaultMessage='Update' + /> + ); + + const confirmTitle = ( + <FormattedMessage + id='update_outgoing_webhook.confirm' + defaultMessage='Edit Outgoing Webhook' + /> + ); + + const confirmMessage = ( + <FormattedMessage + id='update_outgoing_webhook.question' + defaultMessage='Your changes may break the existing outgoing webhook. Are you sure you would like to update it?' + /> + ); + + return ( + <ConfirmModal + title={confirmTitle} + message={confirmMessage} + confirmButton={confirmButton} + show={this.state.showConfirmModal} + onConfirm={this.handleUpdate} + onCancel={this.confirmModalDismissed} + /> + ); + } +} |