diff --git a/model/incoming_webhook.go b/model/incoming_webhook.go index 4ebc7e8b10..de58093ff1 100644 --- a/model/incoming_webhook.go +++ b/model/incoming_webhook.go @@ -7,6 +7,7 @@ import ( "bytes" "encoding/json" "io" + "net/http" "regexp" ) @@ -79,35 +80,36 @@ func IncomingWebhookListFromJson(data io.Reader) []*IncomingWebhook { func (o *IncomingWebhook) IsValid() *AppError { if len(o.Id) != 26 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.id.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.id.app_error", nil, "", http.StatusBadRequest) + } if o.CreateAt == 0 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.create_at.app_error", nil, "id="+o.Id) + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.create_at.app_error", nil, "id="+o.Id, http.StatusBadRequest) } if o.UpdateAt == 0 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.update_at.app_error", nil, "id="+o.Id) + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.update_at.app_error", nil, "id="+o.Id, http.StatusBadRequest) } if len(o.UserId) != 26 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.user_id.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.user_id.app_error", nil, "", http.StatusBadRequest) } if len(o.ChannelId) != 26 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.channel_id.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.channel_id.app_error", nil, "", http.StatusBadRequest) } if len(o.TeamId) != 26 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.team_id.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.team_id.app_error", nil, "", http.StatusBadRequest) } if len(o.DisplayName) > 64 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.display_name.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.display_name.app_error", nil, "", http.StatusBadRequest) } if len(o.Description) > 128 { - return NewLocAppError("IncomingWebhook.IsValid", "model.incoming_hook.description.app_error", nil, "") + return NewAppError("IncomingWebhook.IsValid", "model.incoming_hook.description.app_error", nil, "", http.StatusBadRequest) } return nil diff --git a/webapp/components/integrations/components/abstract_incoming_webhook.jsx b/webapp/components/integrations/components/abstract_incoming_webhook.jsx index a75c29fac3..1253842a78 100644 --- a/webapp/components/integrations/components/abstract_incoming_webhook.jsx +++ b/webapp/components/integrations/components/abstract_incoming_webhook.jsx @@ -12,48 +12,57 @@ import SpinnerButton from 'components/spinner_button.jsx'; import {Link} from 'react-router/es6'; export default class AbstractIncomingWebhook extends React.Component { - static get propTypes() { - return { - team: PropTypes.object - }; + static propTypes = { + + /** + * The current team + */ + team: PropTypes.object.isRequired, + + /** + * The header text to render, has id and defaultMessage + */ + header: PropTypes.object.isRequired, + + /** + * The footer text to render, has id and defaultMessage + */ + footer: PropTypes.object.isRequired, + + /** + * The server error text after a failed action + */ + serverError: PropTypes.string.isRequired, + + /** + * The hook used to set the initial state + */ + initialHook: PropTypes.object, + + /** + * The async function to run when the action button is pressed + */ + action: PropTypes.func.isRequired } constructor(props) { super(props); - this.handleSubmit = this.handleSubmit.bind(this); + this.state = this.getStateFromHook(this.props.initialHook || {}); + } - this.updateDisplayName = this.updateDisplayName.bind(this); - this.updateDescription = this.updateDescription.bind(this); - this.updateChannelId = this.updateChannelId.bind(this); - - this.state = { - displayName: '', - description: '', - channelId: '', + getStateFromHook = (hook) => { + return { + displayName: hook.display_name || '', + description: hook.description || '', + channelId: hook.channel_id || '', saving: false, serverError: '', clientError: null }; - - if (typeof this.performAction === 'undefined') { - throw new TypeError('Subclasses must override performAction'); - } - - if (typeof this.header === 'undefined') { - throw new TypeError('Subclasses must override header'); - } - - if (typeof this.footer === 'undefined') { - throw new TypeError('Subclasses must override footer'); - } - - this.performAction = this.performAction.bind(this); - this.header = this.header.bind(this); - this.footer = this.footer.bind(this); } - handleSubmit(e) { + handleSubmit = (e) => { e.preventDefault(); if (this.state.saving) { @@ -86,30 +95,31 @@ export default class AbstractIncomingWebhook extends React.Component { description: this.state.description }; - this.performAction(hook); + this.props.action(hook).then(() => this.setState({saving: false})); } - updateDisplayName(e) { + updateDisplayName = (e) => { this.setState({ displayName: e.target.value }); } - updateDescription(e) { + updateDescription = (e) => { this.setState({ description: e.target.value }); } - updateChannelId(e) { + updateChannelId = (e) => { this.setState({ channelId: e.target.value }); } render() { - var headerToRender = this.header(); - var footerToRender = this.footer(); + var headerToRender = this.props.header; + var footerToRender = this.props.footer; + return (
@@ -212,7 +222,7 @@ export default class AbstractIncomingWebhook extends React.Component {
{ - browserHistory.push(`/${this.props.team.name}/integrations/confirm?type=incoming_webhooks&id=${data.id}`); - }, - (err) => { - this.setState({ - saving: false, - serverError: err.message - }); - } - ); - } - - header() { - return {id: 'integrations.add', defaultMessage: 'Add'}; - } - - footer() { - return {id: 'add_incoming_webhook.save', defaultMessage: 'Save'}; - } -} diff --git a/webapp/components/integrations/components/add_incoming_webhook/add_incoming_webhook.jsx b/webapp/components/integrations/components/add_incoming_webhook/add_incoming_webhook.jsx new file mode 100644 index 0000000000..23f0fad6f0 --- /dev/null +++ b/webapp/components/integrations/components/add_incoming_webhook/add_incoming_webhook.jsx @@ -0,0 +1,68 @@ +// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import React from 'react'; +import {browserHistory} from 'react-router/es6'; +import PropTypes from 'prop-types'; + +import AbstractIncomingWebhook from 'components/integrations/components/abstract_incoming_webhook.jsx'; + +const HEADER = {id: 'integrations.add', defaultMessage: 'Add'}; +const FOOTER = {id: 'add_incoming_webhook.save', defaultMessage: 'Save'}; + +export default class AddIncomingWebhook extends React.PureComponent { + static propTypes = { + + /** + * The current team + */ + team: PropTypes.object.isRequired, + + /** + * The request state for createIncomingHook action. Contains status and error + */ + createIncomingHookRequest: PropTypes.object.isRequired, + + actions: PropTypes.shape({ + + /** + * The function to call to add a new incoming webhook + */ + createIncomingHook: PropTypes.func.isRequired + }).isRequired + } + + constructor(props) { + super(props); + + this.state = { + serverError: '' + }; + } + + addIncomingHook = async (hook) => { + this.setState({serverError: ''}); + + const data = await this.props.actions.createIncomingHook(hook); + if (data) { + browserHistory.push(`/${this.props.team.name}/integrations/confirm?type=incoming_webhooks&id=${data.id}`); + return; + } + + if (this.props.createIncomingHookRequest.error) { + this.setState({serverError: this.props.createIncomingHookRequest.error.message}); + } + } + + render() { + return ( + + ); + } +} diff --git a/webapp/components/integrations/components/add_incoming_webhook/index.js b/webapp/components/integrations/components/add_incoming_webhook/index.js new file mode 100644 index 0000000000..ed2b53ba86 --- /dev/null +++ b/webapp/components/integrations/components/add_incoming_webhook/index.js @@ -0,0 +1,25 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + + import {connect} from 'react-redux'; + import {bindActionCreators} from 'redux'; + import {createIncomingHook} from 'mattermost-redux/actions/integrations'; + + import AddIncomingWebhook from './add_incoming_webhook.jsx'; + + function mapStateToProps(state, ownProps) { + return { + ...ownProps, + createIncomingHookRequest: state.requests.integrations.createIncomingHook + }; + } + + function mapDispatchToProps(dispatch) { + return { + actions: bindActionCreators({ + createIncomingHook + }, dispatch) + }; + } + + export default connect(mapStateToProps, mapDispatchToProps)(AddIncomingWebhook); \ No newline at end of file diff --git a/webapp/components/integrations/components/edit_incoming_webhook.jsx b/webapp/components/integrations/components/edit_incoming_webhook.jsx deleted file mode 100644 index 00cb50cbd4..0000000000 --- a/webapp/components/integrations/components/edit_incoming_webhook.jsx +++ /dev/null @@ -1,74 +0,0 @@ -// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. -// See License.txt for license information. - -import {browserHistory} from 'react-router/es6'; -import IntegrationStore from 'stores/integration_store.jsx'; -import {updateIncomingHook, loadIncomingHooks} from 'actions/integration_actions.jsx'; - -import AbstractIncomingWebhook from './abstract_incoming_webhook.jsx'; -import TeamStore from 'stores/team_store.jsx'; - -export default class EditIncomingWebhook extends AbstractIncomingWebhook { - constructor(props) { - super(props); - - this.handleIntegrationChange = this.handleIntegrationChange.bind(this); - this.originalIncomingHook = null; - } - - componentDidMount() { - IntegrationStore.addChangeListener(this.handleIntegrationChange); - - if (window.mm_config.EnableIncomingWebhooks === 'true') { - loadIncomingHooks(); - } - } - - componentWillUnmount() { - IntegrationStore.removeChangeListener(this.handleIntegrationChange); - } - - handleIntegrationChange() { - const teamId = TeamStore.getCurrentId(); - - const hooks = IntegrationStore.getIncomingWebhooks(teamId); - const loading = !IntegrationStore.hasReceivedIncomingWebhooks(teamId); - - if (!loading) { - this.originalIncomingHook = hooks.filter((hook) => hook.id === this.props.location.query.id)[0]; - - this.setState({ - displayName: this.originalIncomingHook.display_name, - description: this.originalIncomingHook.description, - channelId: this.originalIncomingHook.channel_id - }); - } - } - - performAction(hook) { - if (this.originalIncomingHook.id) { - hook.id = this.originalIncomingHook.id; - } - - updateIncomingHook( - hook, - () => { - browserHistory.push(`/${this.props.team.name}/integrations/incoming_webhooks`); - }, - (err) => { - this.setState({ - saving: false, - serverError: err.message - }); - } - ); - } - - header() { - return {id: 'integrations.edit', defaultMessage: 'Edit'}; - } - - footer() { - return {id: 'update_incoming_webhook.update', defaultMessage: 'Update'}; - } -} diff --git a/webapp/components/integrations/components/edit_incoming_webhook/edit_incoming_webhook.jsx b/webapp/components/integrations/components/edit_incoming_webhook/edit_incoming_webhook.jsx new file mode 100644 index 0000000000..35d8983a2f --- /dev/null +++ b/webapp/components/integrations/components/edit_incoming_webhook/edit_incoming_webhook.jsx @@ -0,0 +1,112 @@ +// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import {browserHistory} from 'react-router/es6'; +import LoadingScreen from 'components/loading_screen.jsx'; + +import AbstractIncomingWebhook from 'components/integrations/components/abstract_incoming_webhook.jsx'; + +import React from 'react'; +import PropTypes from 'prop-types'; + +const HEADER = {id: 'integrations.edit', defaultMessage: 'Edit'}; +const FOOTER = {id: 'update_incoming_webhook.update', defaultMessage: 'Update'}; + +export default class EditIncomingWebhook extends React.PureComponent { + static propTypes = { + + /** + * The current team + */ + team: PropTypes.object.isRequired, + + /** + * The incoming webhook to edit + */ + hook: PropTypes.object, + + /** + * The id of the incoming webhook to edit + */ + hookId: PropTypes.string.isRequired, + + /** + * The request state for updateIncomingHook action. Contains status and error + */ + updateIncomingHookRequest: PropTypes.object.isRequired, + + actions: PropTypes.shape({ + + /** + * The function to call to update an incoming webhook + */ + updateIncomingHook: PropTypes.func.isRequired, + + /** + * The function to call to get an incoming webhook + */ + getIncomingHook: PropTypes.func.isRequired + }).isRequired + } + + constructor(props) { + super(props); + + this.state = { + showConfirmModal: false, + serverError: '' + }; + } + + componentDidMount() { + if (window.mm_config.EnableIncomingWebhooks === 'true') { + this.props.actions.getIncomingHook(this.props.hookId); + } + } + + editIncomingHook = async (hook) => { + this.newHook = hook; + + if (this.props.hook.id) { + hook.id = this.props.hook.id; + } + + if (this.props.hook.token) { + hook.token = this.props.hook.token; + } + + await this.submitHook(); + } + + submitHook = async () => { + this.setState({serverError: ''}); + + const data = await this.props.actions.updateIncomingHook(this.newHook); + + if (data) { + browserHistory.push(`/${this.props.team.name}/integrations/incoming_webhooks`); + return; + } + + if (this.props.updateIncomingHookRequest.error) { + this.setState({serverError: this.props.updateIncomingHookRequest.error.message}); + } + } + + render() { + if (!this.props.hook) { + return ; + } + + return ( + + ); + } +} diff --git a/webapp/components/integrations/components/edit_incoming_webhook/index.js b/webapp/components/integrations/components/edit_incoming_webhook/index.js new file mode 100644 index 0000000000..a391a98a69 --- /dev/null +++ b/webapp/components/integrations/components/edit_incoming_webhook/index.js @@ -0,0 +1,30 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import {connect} from 'react-redux'; +import {bindActionCreators} from 'redux'; +import {updateIncomingHook, getIncomingHook} from 'mattermost-redux/actions/integrations'; + +import EditIncomingWebhook from './edit_incoming_webhook.jsx'; + +function mapStateToProps(state, ownProps) { + const hookId = ownProps.location.query.id; + + return { + ...ownProps, + hookId, + hook: state.entities.integrations.incomingHooks[hookId], + updateIncomingHookRequest: state.requests.integrations.createIncomingHook + }; +} + +function mapDispatchToProps(dispatch) { + return { + actions: bindActionCreators({ + updateIncomingHook, + getIncomingHook + }, dispatch) + }; +} + +export default connect(mapStateToProps, mapDispatchToProps)(EditIncomingWebhook); \ No newline at end of file diff --git a/webapp/routes/route_integrations.jsx b/webapp/routes/route_integrations.jsx index 37b33ed404..169d374c67 100644 --- a/webapp/routes/route_integrations.jsx +++ b/webapp/routes/route_integrations.jsx @@ -25,13 +25,13 @@ export default { { path: 'add', getComponents: (location, callback) => { - System.import('components/integrations/components/add_incoming_webhook.jsx').then(RouteUtils.importComponentSuccess(callback)); + System.import('components/integrations/components/add_incoming_webhook').then(RouteUtils.importComponentSuccess(callback)); } }, { path: 'edit', getComponents: (location, callback) => { - System.import('components/integrations/components/edit_incoming_webhook.jsx').then(RouteUtils.importComponentSuccess(callback)); + System.import('components/integrations/components/edit_incoming_webhook').then(RouteUtils.importComponentSuccess(callback)); } } ] diff --git a/webapp/tests/components/integrations/__snapshots__/add_incoming_hook.test.jsx.snap b/webapp/tests/components/integrations/__snapshots__/add_incoming_hook.test.jsx.snap new file mode 100644 index 0000000000..ce34d81bc3 --- /dev/null +++ b/webapp/tests/components/integrations/__snapshots__/add_incoming_hook.test.jsx.snap @@ -0,0 +1,26 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`components/integrations/AddIncomingWebhook should match snapshot 1`] = ` + +`; diff --git a/webapp/tests/components/integrations/__snapshots__/edit_incoming_hook.test.jsx.snap b/webapp/tests/components/integrations/__snapshots__/edit_incoming_hook.test.jsx.snap new file mode 100644 index 0000000000..ed392dcbd2 --- /dev/null +++ b/webapp/tests/components/integrations/__snapshots__/edit_incoming_hook.test.jsx.snap @@ -0,0 +1,7 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`components/integrations/EditIncomingWebhook should match snapshot 1`] = ` + +`; diff --git a/webapp/tests/components/integrations/add_incoming_hook.test.jsx b/webapp/tests/components/integrations/add_incoming_hook.test.jsx new file mode 100644 index 0000000000..ae5a46cb2f --- /dev/null +++ b/webapp/tests/components/integrations/add_incoming_hook.test.jsx @@ -0,0 +1,29 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + + import React from 'react'; + import {shallow} from 'enzyme'; + + import AddIncomingWebhook from 'components/integrations/components/add_incoming_webhook/add_incoming_webhook.jsx'; + + describe('components/integrations/AddIncomingWebhook', () => { + test('should match snapshot', () => { + function emptyFunction() {} //eslint-disable-line no-empty-function + const teamId = 'testteamid'; + + const wrapper = shallow( + + ); + expect(wrapper).toMatchSnapshot(); + }); + }); diff --git a/webapp/tests/components/integrations/edit_incoming_hook.test.jsx b/webapp/tests/components/integrations/edit_incoming_hook.test.jsx new file mode 100644 index 0000000000..cb7544314c --- /dev/null +++ b/webapp/tests/components/integrations/edit_incoming_hook.test.jsx @@ -0,0 +1,30 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + + import React from 'react'; + import {shallow} from 'enzyme'; + + import EditIncomingWebhook from 'components/integrations/components/edit_incoming_webhook/edit_incoming_webhook.jsx'; + + describe('components/integrations/EditIncomingWebhook', () => { + test('should match snapshot', () => { + function emptyFunction() {} //eslint-disable-line no-empty-function + const teamId = 'testteamid'; + + const wrapper = shallow( + + ); + expect(wrapper).toMatchSnapshot(); + }); + });