mirror of
https://github.com/ascribe/onion.git
synced 2024-12-23 01:39:36 +01:00
webhooks in settings without acl
This commit is contained in:
parent
64030473cd
commit
1c25f8e776
47
js/actions/webhook_actions.js
Normal file
47
js/actions/webhook_actions.js
Normal file
@ -0,0 +1,47 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
import { alt } from '../alt';
|
||||||
|
import WebhookFetcher from '../fetchers/webhook_fetcher';
|
||||||
|
|
||||||
|
|
||||||
|
class WebhookActions {
|
||||||
|
constructor() {
|
||||||
|
this.generateActions(
|
||||||
|
'updateWebhooks',
|
||||||
|
'updateEvents',
|
||||||
|
'removeWebhook'
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
fetchWebhooks() {
|
||||||
|
WebhookFetcher.fetch()
|
||||||
|
.then((res) => {
|
||||||
|
this.actions.updateWebhooks(res.webhooks);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.logGlobal(err);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
fetchWebhookEvents() {
|
||||||
|
WebhookFetcher.fetchEvents()
|
||||||
|
.then((res) => {
|
||||||
|
this.actions.updateEvents(res.events);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.logGlobal(err);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteWebhook(id){
|
||||||
|
WebhookFetcher.deleteWebhook(id)
|
||||||
|
.then((res) => {
|
||||||
|
this.actions.removeWebhook(id);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.logGlobal(err);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default alt.createActions(WebhookActions);
|
@ -11,6 +11,7 @@ import WhitelabelActions from '../../actions/whitelabel_actions';
|
|||||||
import AccountSettings from './account_settings';
|
import AccountSettings from './account_settings';
|
||||||
import BitcoinWalletSettings from './bitcoin_wallet_settings';
|
import BitcoinWalletSettings from './bitcoin_wallet_settings';
|
||||||
import APISettings from './api_settings';
|
import APISettings from './api_settings';
|
||||||
|
import WebhookSettings from './webhook_settings';
|
||||||
|
|
||||||
import AclProxy from '../acl_proxy';
|
import AclProxy from '../acl_proxy';
|
||||||
|
|
||||||
@ -70,6 +71,7 @@ let SettingsContainer = React.createClass({
|
|||||||
aclName="acl_view_settings_api">
|
aclName="acl_view_settings_api">
|
||||||
<APISettings />
|
<APISettings />
|
||||||
</AclProxy>
|
</AclProxy>
|
||||||
|
<WebhookSettings />
|
||||||
<AclProxy
|
<AclProxy
|
||||||
aclObject={this.state.whitelabel}
|
aclObject={this.state.whitelabel}
|
||||||
aclName="acl_view_settings_bitcoin">
|
aclName="acl_view_settings_bitcoin">
|
||||||
|
151
js/components/ascribe_settings/webhook_settings.js
Normal file
151
js/components/ascribe_settings/webhook_settings.js
Normal file
@ -0,0 +1,151 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
import WebhookStore from '../../stores/webhook_store';
|
||||||
|
import WebhookActions from '../../actions/webhook_actions';
|
||||||
|
|
||||||
|
import GlobalNotificationModel from '../../models/global_notification_model';
|
||||||
|
import GlobalNotificationActions from '../../actions/global_notification_actions';
|
||||||
|
|
||||||
|
import Form from '../ascribe_forms/form';
|
||||||
|
import Property from '../ascribe_forms/property';
|
||||||
|
|
||||||
|
import ActionPanel from '../ascribe_panel/action_panel';
|
||||||
|
import CollapsibleParagraph from '../ascribe_collapsible/collapsible_paragraph';
|
||||||
|
|
||||||
|
import ApiUrls from '../../constants/api_urls';
|
||||||
|
import AscribeSpinner from '../ascribe_spinner';
|
||||||
|
|
||||||
|
import { getLangText } from '../../utils/lang_utils';
|
||||||
|
|
||||||
|
|
||||||
|
let WebhookSettings = React.createClass({
|
||||||
|
propTypes: {
|
||||||
|
defaultExpanded: React.PropTypes.bool
|
||||||
|
},
|
||||||
|
|
||||||
|
getInitialState() {
|
||||||
|
return WebhookStore.getState();
|
||||||
|
},
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
WebhookStore.listen(this.onChange);
|
||||||
|
WebhookActions.fetchWebhooks();
|
||||||
|
WebhookActions.fetchWebhookEvents();
|
||||||
|
},
|
||||||
|
|
||||||
|
componentWillUnmount() {
|
||||||
|
WebhookStore.unlisten(this.onChange);
|
||||||
|
},
|
||||||
|
|
||||||
|
onChange(state) {
|
||||||
|
this.setState(state);
|
||||||
|
},
|
||||||
|
|
||||||
|
onDeleteWebhook(event) {
|
||||||
|
let webhookId = event.target.getAttribute('data-id');
|
||||||
|
WebhookActions.deleteWebhook(webhookId);
|
||||||
|
|
||||||
|
let notification = new GlobalNotificationModel(getLangText('Webhook deleted'), 'success', 2000);
|
||||||
|
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||||
|
},
|
||||||
|
|
||||||
|
handleCreateSuccess() {
|
||||||
|
WebhookActions.fetchWebhooks();
|
||||||
|
let notification = new GlobalNotificationModel(getLangText('Webhook successfully created'), 'success', 5000);
|
||||||
|
GlobalNotificationActions.appendGlobalNotification(notification);
|
||||||
|
},
|
||||||
|
|
||||||
|
getWebhooks(){
|
||||||
|
let content = <AscribeSpinner color='dark-blue' size='lg'/>;
|
||||||
|
|
||||||
|
if (this.state.webhooks.length > -1) {
|
||||||
|
content = this.state.webhooks.map(function(webhook, i) {
|
||||||
|
const event = webhook.event.split('.')[0];
|
||||||
|
return (
|
||||||
|
<ActionPanel
|
||||||
|
name={webhook.event}
|
||||||
|
key={i}
|
||||||
|
content={
|
||||||
|
<div>
|
||||||
|
<div className='ascribe-panel-title'>
|
||||||
|
{event.toUpperCase()}
|
||||||
|
</div>
|
||||||
|
<div className="ascribe-panel-subtitle">
|
||||||
|
{webhook.target}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
buttons={
|
||||||
|
<div className="pull-right">
|
||||||
|
<div className="pull-right">
|
||||||
|
<button
|
||||||
|
className="pull-right btn btn-tertiary btn-sm"
|
||||||
|
onClick={this.onDeleteWebhook}
|
||||||
|
data-id={webhook.id}>
|
||||||
|
{getLangText('DELETE')}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
}/>
|
||||||
|
);
|
||||||
|
}, this);
|
||||||
|
}
|
||||||
|
return content;
|
||||||
|
},
|
||||||
|
|
||||||
|
getEvents() {
|
||||||
|
if (this.state.events && this.state.events.length > 1) {
|
||||||
|
return (
|
||||||
|
<Property
|
||||||
|
name='event'
|
||||||
|
label={getLangText('Select the event to trigger a webhook', '...')}
|
||||||
|
onChange={this.onLicenseChange}>
|
||||||
|
<select name="license">
|
||||||
|
{this.state.events.map((event, i) => {
|
||||||
|
return (
|
||||||
|
<option
|
||||||
|
name={i}
|
||||||
|
key={i}
|
||||||
|
value={ event + '.webhook' }>
|
||||||
|
{ event.toUpperCase() }
|
||||||
|
</option>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</select>
|
||||||
|
</Property>);
|
||||||
|
}
|
||||||
|
return null;
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<CollapsibleParagraph
|
||||||
|
title={getLangText('Webhooks')}
|
||||||
|
defaultExpanded={this.props.defaultExpanded}>
|
||||||
|
<Form
|
||||||
|
url={ApiUrls.webhooks}
|
||||||
|
handleSuccess={this.handleCreateSuccess}>
|
||||||
|
{ this.getEvents() }
|
||||||
|
<Property
|
||||||
|
name='target'
|
||||||
|
label={getLangText('Redirect Url')}>
|
||||||
|
<input
|
||||||
|
type="text"
|
||||||
|
placeholder={getLangText('Enter the url to be triggered')}
|
||||||
|
required/>
|
||||||
|
</Property>
|
||||||
|
<hr />
|
||||||
|
</Form>
|
||||||
|
<pre>
|
||||||
|
Usage: curl <url> -H 'Authorization: Bearer <token>'
|
||||||
|
</pre>
|
||||||
|
{this.getWebhooks()}
|
||||||
|
</CollapsibleParagraph>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
export default WebhookSettings;
|
@ -72,6 +72,9 @@ let ApiUrls = {
|
|||||||
'users_username': AppConstants.apiEndpoint + 'users/username/',
|
'users_username': AppConstants.apiEndpoint + 'users/username/',
|
||||||
'users_profile': AppConstants.apiEndpoint + 'users/profile/',
|
'users_profile': AppConstants.apiEndpoint + 'users/profile/',
|
||||||
'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/',
|
'wallet_settings': AppConstants.apiEndpoint + 'users/wallet_settings/',
|
||||||
|
'webhook': AppConstants.apiEndpoint + 'webhooks/${webhook_id}/',
|
||||||
|
'webhooks': AppConstants.apiEndpoint + 'webhooks/',
|
||||||
|
'webhooks_events': AppConstants.apiEndpoint + 'webhooks/events/',
|
||||||
'whitelabel_settings': AppConstants.apiEndpoint + 'whitelabel/settings/${subdomain}/',
|
'whitelabel_settings': AppConstants.apiEndpoint + 'whitelabel/settings/${subdomain}/',
|
||||||
'delete_s3_file': AppConstants.serverUrl + 's3/delete/',
|
'delete_s3_file': AppConstants.serverUrl + 's3/delete/',
|
||||||
'prize_list': AppConstants.apiEndpoint + 'prize/'
|
'prize_list': AppConstants.apiEndpoint + 'prize/'
|
||||||
|
23
js/fetchers/webhook_fetcher.js
Normal file
23
js/fetchers/webhook_fetcher.js
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
import requests from '../utils/requests';
|
||||||
|
|
||||||
|
let WebhookFetcher = {
|
||||||
|
/**
|
||||||
|
* Fetch the registered webhooks of a user from the API.
|
||||||
|
*/
|
||||||
|
fetch() {
|
||||||
|
return requests.get('webhooks');
|
||||||
|
},
|
||||||
|
|
||||||
|
deleteWebhook(id) {
|
||||||
|
return requests.delete('webhook', {'webhook_id': id });
|
||||||
|
},
|
||||||
|
|
||||||
|
fetchEvents() {
|
||||||
|
return requests.get('webhooks_events');
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
export default WebhookFetcher;
|
27
js/stores/webhook_store.js
Normal file
27
js/stores/webhook_store.js
Normal file
@ -0,0 +1,27 @@
|
|||||||
|
'use strict';
|
||||||
|
|
||||||
|
import { alt } from '../alt';
|
||||||
|
import WebhookActions from '../actions/webhook_actions';
|
||||||
|
|
||||||
|
|
||||||
|
class WebhookStore {
|
||||||
|
constructor() {
|
||||||
|
this.webhooks = {};
|
||||||
|
this.events = {};
|
||||||
|
this.bindActions(WebhookActions);
|
||||||
|
}
|
||||||
|
|
||||||
|
onUpdateWebhooks(webhooks) {
|
||||||
|
this.webhooks = webhooks;
|
||||||
|
}
|
||||||
|
|
||||||
|
onUpdateEvents(events) {
|
||||||
|
this.events = events;
|
||||||
|
}
|
||||||
|
|
||||||
|
onRemoveWebhook(id) {
|
||||||
|
this.webhooks = this.webhooks.filter((webhook) => webhook.id !== parseInt(id));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default alt.createStore(WebhookStore, 'WebhookStore');
|
Loading…
Reference in New Issue
Block a user