diff --git a/ui/package-lock.json b/ui/package-lock.json
index 00ee5b583..61c947983 100644
--- a/ui/package-lock.json
+++ b/ui/package-lock.json
@@ -14116,11 +14116,6 @@
"lodash": "^4.17.15"
}
},
- "webpack-node-externals": {
- "version": "2.5.2",
- "resolved": "https://registry.npmjs.org/webpack-node-externals/-/webpack-node-externals-2.5.2.tgz",
- "integrity": "sha512-aHdl/y2N7PW2Sx7K+r3AxpJO+aDMcYzMQd60Qxefq3+EwhewSbTBqNumOsCE1JsCUNoyfGj5465N0sSf6hc/5w=="
- },
"webpack-sources": {
"version": "1.4.3",
"resolved": "https://registry.npmjs.org/webpack-sources/-/webpack-sources-1.4.3.tgz",
diff --git a/ui/src/features/components/SubmitBar/index.js b/ui/src/features/components/SubmitBar/index.js
index 3c5becf1f..36a3f4113 100644
--- a/ui/src/features/components/SubmitBar/index.js
+++ b/ui/src/features/components/SubmitBar/index.js
@@ -1,14 +1,43 @@
import Button from "../../../components/Button";
import React from "react";
-
-const SubmitBar = ({onSubmit, onCancel, loading, disabled}) => {
-
- return (
- {onCancel && }
-
-
);
+const SubmitBar = ({
+ onSubmit,
+ onCancel,
+ loading,
+ disabled,
+ onTest,
+ testDisabled,
+ showTestWebhookSuccessMsg,
+}) => {
+ const buttonColor = showTestWebhookSuccessMsg && "green";
+ const buttonIsInverted = !showTestWebhookSuccessMsg;
+ const buttonText = !showTestWebhookSuccessMsg ? "Test" : "Great, It Works!";
+ return (
+
+ {onTest && (
+ <>
+
+ >
+ )}
+ {onCancel && (
+
+ )}
+
+
+ );
};
export default SubmitBar;
diff --git a/ui/src/features/components/WebhooksList/CollapsibleWebhook.js b/ui/src/features/components/WebhooksList/CollapsibleWebhook.js
index a830ccf8f..1b97ca3c6 100644
--- a/ui/src/features/components/WebhooksList/CollapsibleWebhook.js
+++ b/ui/src/features/components/WebhooksList/CollapsibleWebhook.js
@@ -2,7 +2,7 @@ import React from 'react';
import CollapsibleItem from '../../../components/CollapsibleItem/CollapsibleItem';
import WebhookForm from './WebhookForm';
import { buildStateFromWebhook, createWebhookRequest } from './utils'
-import { editWebhookSuccess, loading, webhookSuccess } from '../../redux/selectors/webhooksSelector';
+import { editWebhookSuccess, loading, webhookSuccess, testWebhookSuccess } from '../../redux/selectors/webhooksSelector';
import * as Actions from '../../redux/action';
import { connect } from 'react-redux';
import DeleteDialog from '../DeleteDialog';
@@ -34,6 +34,15 @@ export class CollapsibleWebhook extends React.Component {
onChangeWebhook = (webhook) => {
this.setState({ webhook });
};
+
+ hideTestWebhookSuccessMsg = () => {
+ this.props.setTestWebHookSuccess(false)
+ };
+
+ onTest = () => {
+ const { webhook } = this.state;
+ this.props.testWebhook(webhook.id);
+ };
onSubmit = () => {
const { createMode } = this.props;
@@ -57,6 +66,14 @@ export class CollapsibleWebhook extends React.Component {
}
}
+ toggleExpanded = () => {
+ const { createMode } = this.props;
+ if(!createMode) {
+ this.setState({ expanded: !this.state.expanded })
+ this.hideTestWebhookSuccessMsg()
+ }
+ }
+
render () {
const { expanded, showDeleteReportWarning, webhook } = this.state;
const { createMode } = this.props;
@@ -72,9 +89,7 @@ export class CollapsibleWebhook extends React.Component {
return (
{
- !createMode && this.setState({ expanded: !this.state.expanded })
- }}
+ onClick={this.toggleExpanded}
editable
expanded={expanded}
toggleable={!createMode}
@@ -136,8 +151,10 @@ export class CollapsibleWebhook extends React.Component {
};
generateBody = () => {
+ const { createMode, testWebHookSuccess } = this.props;
+ const showTestWebhookSuccessMsg = !createMode && testWebHookSuccess;
return (
-
)
}
@@ -147,17 +164,20 @@ function mapStateToProps (state) {
return {
loading: loading(state),
webhookSuccess: webhookSuccess(state),
- editWebhookSuccess: editWebhookSuccess(state)
+ editWebhookSuccess: editWebhookSuccess(state),
+ testWebHookSuccess: testWebhookSuccess(state)
}
}
const mapDispatchToProps = {
createWebhook: Actions.createWebhook,
getWebhooks: Actions.getWebhooks,
+ testWebhook: Actions.testWebhook,
editWebhook: Actions.editWebhook,
deleteWebhook: Actions.deleteWebHook,
setWebhookSuccess: Actions.createWebHookSuccess,
- setEditWebhookSuccess: Actions.editWebHookSuccess
+ setEditWebhookSuccess: Actions.editWebHookSuccess,
+ setTestWebHookSuccess: Actions.testWebHookSuccess,
};
export default connect(mapStateToProps, mapDispatchToProps)(CollapsibleWebhook);
diff --git a/ui/src/features/components/WebhooksList/WebhookForm.js b/ui/src/features/components/WebhooksList/WebhookForm.js
index 6be56c97b..b48db2f0d 100644
--- a/ui/src/features/components/WebhooksList/WebhookForm.js
+++ b/ui/src/features/components/WebhooksList/WebhookForm.js
@@ -9,7 +9,7 @@ import UiSwitcher from "../../../components/UiSwitcher";
import SubmitBar from '../SubmitBar'
import InfoToolTip from '../InfoToolTip';
-const WebhookForm = ({loading, onSubmit, onCancel, onChangeWebhook, webhook}) => {
+const WebhookForm = ({loading, onSubmit, onCancel, onChangeWebhook, webhook, onTest, testDisabled, showTestWebhookSuccessMsg}) => {
const onChangeProps = (props) => {
const newWebhook = {...webhook, ...props};
@@ -78,7 +78,7 @@ const WebhookForm = ({loading, onSubmit, onCancel, onChangeWebhook, webhook}) =>
}
/>
-
+
)
diff --git a/ui/src/features/redux/action.js b/ui/src/features/redux/action.js
index 96a4cd5cd..88e52ecbc 100644
--- a/ui/src/features/redux/action.js
+++ b/ui/src/features/redux/action.js
@@ -28,9 +28,11 @@ import {
createWebHookSuccess,
cleanErrors,
editWebhook,
+ testWebhook,
deleteWebHook,
deleteWebHookSuccess,
editWebHookSuccess,
+ testWebHookSuccess,
} from './actions/webhooksActions';
import {
clearStopJobSuccess,
@@ -198,9 +200,11 @@ export {
createWebHookSuccess,
cleanErrors,
editWebhook,
+ testWebhook,
deleteWebHook,
deleteWebHookSuccess,
- editWebHookSuccess
+ editWebHookSuccess,
+ testWebHookSuccess
};
//processors
diff --git a/ui/src/features/redux/actions/webhooksActions.js b/ui/src/features/redux/actions/webhooksActions.js
index cf5d6bcd3..85d8699f6 100644
--- a/ui/src/features/redux/actions/webhooksActions.js
+++ b/ui/src/features/redux/actions/webhooksActions.js
@@ -23,11 +23,18 @@ export const createWebHookFailure = (value) => (
export const editWebHookSuccess = (value) => (
{type: Types.EDIT_WEBHOOK_SUCCESS, value}
);
+export const testWebHookSuccess = (value) => (
+ {type: Types.TEST_WEBHOOK_SUCCESS, value}
+);
export const editWebHookFailure = (value) => (
{type: Types.EDIT_WEBHOOK_FAILURE, value}
);
+export const testWebHookFailure = (value) => (
+ {type: Types.TEST_WEBHOOK_FAILURE, value}
+);
+
export const deleteWebHook = (id) => (
{type: Types.DELETE_WEBHOOK, id}
);
@@ -55,3 +62,7 @@ export const cleanErrors = (value) => (
export const editWebhook = (body, id) => (
{type: Types.EDIT_WEBHOOK, body, id}
);
+
+export const testWebhook = (id) => (
+ {type: Types.TEST_WEBHOOK, id}
+);
diff --git a/ui/src/features/redux/apis/webhooksApi.js b/ui/src/features/redux/apis/webhooksApi.js
index a773c9c37..390d51897 100644
--- a/ui/src/features/redux/apis/webhooksApi.js
+++ b/ui/src/features/redux/apis/webhooksApi.js
@@ -8,6 +8,12 @@ export const getWebhooksApi = () => {
});
};
+export const testWebhookApi = (id) => {
+ let url = `${env.PREDATOR_URL}/webhooks/${id}/test`;
+ return axios.post(url, {
+ headers: {}
+ });
+};
export const createWebhookApi = (body) => {
let url = `${env.PREDATOR_URL}/webhooks`;
diff --git a/ui/src/features/redux/reducers/webhooksReducer.js b/ui/src/features/redux/reducers/webhooksReducer.js
index 5b1f69c5b..59290ca81 100644
--- a/ui/src/features/redux/reducers/webhooksReducer.js
+++ b/ui/src/features/redux/reducers/webhooksReducer.js
@@ -5,6 +5,7 @@ const initialState = Immutable.Map({
webhooks: [],
create_webhook_success: false,
edit_webhook_success: false,
+ test_webhook_success: false,
webhook_error: undefined,
get_webhooks_error: undefined,
loading: false,
@@ -18,6 +19,8 @@ export default function reduce(state = initialState, action = {}) {
return state.set('delete_webhook_success', action.value);
case Types.EDIT_WEBHOOK_SUCCESS:
return state.set('edit_webhook_success', action.value);
+ case Types.TEST_WEBHOOK_SUCCESS:
+ return state.set('test_webhook_success', action.value);
case Types.GET_WEBHOOKS_SUCCESS:
return state.set('webhooks', action.value);
case Types.LOADING:
@@ -25,6 +28,7 @@ export default function reduce(state = initialState, action = {}) {
case Types.GET_WEBHOOKS_FAILURE:
case Types.CREATE_WEBHOOK_FAILUE:
case Types.EDIT_WEBHOOK_FAILURE:
+ case Types.TEST_WEBHOOK_FAILURE:
return state.set('webhook_error', action.value);
case Types.CLEAN_ERRORS:
return state.set('webhook_error', undefined);
diff --git a/ui/src/features/redux/saga/webhooksSagas.js b/ui/src/features/redux/saga/webhooksSagas.js
index 29636f1d5..e5012e3c4 100644
--- a/ui/src/features/redux/saga/webhooksSagas.js
+++ b/ui/src/features/redux/saga/webhooksSagas.js
@@ -1,7 +1,7 @@
import {put, takeLatest, call} from 'redux-saga/effects'
import * as Actions from '../actions/webhooksActions'
import * as Types from '../types/webhooks'
-import {getWebhooksApi, createWebhookApi, editWebhookApi, deleteWebhookApi} from '../apis/webhooksApi'
+import {getWebhooksApi, createWebhookApi, editWebhookApi, deleteWebhookApi, testWebhookApi} from '../apis/webhooksApi'
export function* getWebhooks() {
try {
@@ -52,9 +52,22 @@ export function* deleteWebhook({id}) {
yield put(Actions.setLoading(false));
}
+export function* testWebhook({id}) {
+ try {
+ yield put(Actions.setLoading(true));
+ const result = yield call(testWebhookApi, id);
+ yield put(Actions.testWebHookSuccess(true));
+ } catch (e) {
+ yield put(Actions.testWebHookFailure(e))
+
+ }
+ yield put(Actions.setLoading(false));
+}
+
export function* webhooksRegister() {
yield takeLatest(Types.GET_WEBHOOKS, getWebhooks);
yield takeLatest(Types.CREATE_WEBHOOK, createWebhook);
yield takeLatest(Types.EDIT_WEBHOOK, editWebhook);
yield takeLatest(Types.DELETE_WEBHOOK, deleteWebhook);
+ yield takeLatest(Types.TEST_WEBHOOK, testWebhook);
}
diff --git a/ui/src/features/redux/selectors/webhooksSelector.js b/ui/src/features/redux/selectors/webhooksSelector.js
index f6f4da940..e68171184 100644
--- a/ui/src/features/redux/selectors/webhooksSelector.js
+++ b/ui/src/features/redux/selectors/webhooksSelector.js
@@ -6,6 +6,7 @@ export const loading = (state) => state.WebhooksReducer.get('loading');
export const webhookSuccess = (state) => state.WebhooksReducer.get('create_webhook_success');
export const editWebhookSuccess = (state) => state.WebhooksReducer.get('edit_webhook_success');
export const deleteWebhookSuccess = (state) => state.WebhooksReducer.get('delete_webhook_success');
+export const testWebhookSuccess = (state) => state.WebhooksReducer.get('test_webhook_success');
export const webhookError = (state) => state.WebhooksReducer.get('webhook_error');
export const sortedWebhooksWithSpacer = createSelector(webhooks, (webhooks) => {
diff --git a/ui/src/features/redux/types/webhooks.js b/ui/src/features/redux/types/webhooks.js
index bc09efb9e..34d4c515c 100644
--- a/ui/src/features/redux/types/webhooks.js
+++ b/ui/src/features/redux/types/webhooks.js
@@ -16,5 +16,9 @@ export const DELETE_WEBHOOK = 'DELETE_WEBHOOK';
export const DELETE_WEBHOOK_SUCCESS = 'DELETE_WEBHOOK_SUCCESS';
export const DELETE_WEBHOOK_FAILURE = 'DELETE_WEBHOOK_FAILURE';
+export const TEST_WEBHOOK = 'TEST_WEBHOOK';
+export const TEST_WEBHOOK_SUCCESS = 'TEST_WEBHOOK_SUCCESS';
+export const TEST_WEBHOOK_FAILURE = 'TEST_WEBHOOK_FAILURE';
+
export const LOADING = 'LOADING';
export const CLEAN_ERRORS = 'CLEAN_ERRORS';