fix JS error on SpinnerButton and refactor edit incoming/outgoing webhook (#6917)

webapp/components/integrations/components/edit_incoming_webhook.jsx

@@ -31,13 +31,11 @@ export default class EditIncomingWebhook extends AbstractIncomingWebhook {
     handleIntegrationChange() {
         const teamId = TeamStore.getCurrentId();
 
-        this.setState({
-            hooks: IntegrationStore.getIncomingWebhooks(teamId),
-            loading: !IntegrationStore.hasReceivedIncomingWebhooks(teamId)
-        });
+        const hooks = IntegrationStore.getIncomingWebhooks(teamId);
+        const loading = !IntegrationStore.hasReceivedIncomingWebhooks(teamId);
 
-        if (!this.state.loading) {
-            this.originalIncomingHook = this.state.hooks.filter((hook) => hook.id === this.props.location.query.id)[0];
+        if (!loading) {
+            this.originalIncomingHook = hooks.filter((hook) => hook.id === this.props.location.query.id)[0];
 
             this.setState({
                 displayName: this.originalIncomingHook.display_name,

webapp/components/integrations/components/edit_outgoing_webhook.jsx

@@ -43,21 +43,11 @@ export default class EditOutgoingWebhook extends AbstractOutgoingWebhook {
     handleIntegrationChange() {
         const teamId = TeamStore.getCurrentId();
 
-        this.setState({
-            hooks: IntegrationStore.getOutgoingWebhooks(teamId),
-            loading: !IntegrationStore.hasReceivedOutgoingWebhooks(teamId)
-        });
+        const hooks = IntegrationStore.getOutgoingWebhooks(teamId);
+        const 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
-            });
+        if (!loading) {
+            this.originalOutgoingHook = hooks.filter((hook) => hook.id === this.props.location.query.id)[0];
 
             var triggerWords = '';
             if (this.originalOutgoingHook.trigger_words) {
@@ -76,6 +66,11 @@ export default class EditOutgoingWebhook extends AbstractOutgoingWebhook {
             }
 
             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,
                 triggerWords,
                 callbackUrls
             });

webapp/components/spinner_button.jsx

@@ -16,6 +16,12 @@ export default class SpinnerButton extends React.Component {
         };
     }
 
+    static get defaultProps() {
+        return {
+            spinning: false
+        };
+    }
+
     render() {
         const {spinning, children, ...props} = this.props; // eslint-disable-line no-use-before-define