diff --git a/ui/src/kapacitor/components/AlertOutputs.tsx b/ui/src/kapacitor/components/AlertOutputs.tsx index e5d282fe8..45684790d 100644 --- a/ui/src/kapacitor/components/AlertOutputs.tsx +++ b/ui/src/kapacitor/components/AlertOutputs.tsx @@ -4,21 +4,40 @@ import AlertTabs from 'src/kapacitor/components/AlertTabs' import {Kapacitor, Source} from 'src/types' +export interface Notification { + id?: string + type: string + icon: string + duration: number + message: string +} + +type NotificationFunc = () => Notification + interface AlertOutputProps { exists: boolean kapacitor: Kapacitor source: Source hash: string + publishNotification: (message: Notification | NotificationFunc) => void } const AlertOutputs: SFC = ({ - exists, - kapacitor, - source, hash, + exists, + source, + kapacitor, + publishNotification, }) => { if (exists) { - return + return ( + + ) } return ( diff --git a/ui/src/kapacitor/components/AlertTabs.js b/ui/src/kapacitor/components/AlertTabs.js index 1debe68bf..5d6827c6f 100644 --- a/ui/src/kapacitor/components/AlertTabs.js +++ b/ui/src/kapacitor/components/AlertTabs.js @@ -1,10 +1,7 @@ import React, {Component} from 'react' import PropTypes from 'prop-types' -import {connect} from 'react-redux' -import {bindActionCreators} from 'redux' import _ from 'lodash' -import {publishNotification as publishNotificationAction} from 'shared/actions/notifications' import {Tab, Tabs, TabPanel, TabPanels, TabList} from 'shared/components/Tabs' import { @@ -331,8 +328,4 @@ AlertTabs.propTypes = { hash: string.isRequired, } -const mapDispatchToProps = dispatch => ({ - publishNotification: bindActionCreators(publishNotificationAction, dispatch), -}) - -export default connect(null, mapDispatchToProps)(AlertTabs) +export default AlertTabs diff --git a/ui/src/kapacitor/components/KapacitorForm.tsx b/ui/src/kapacitor/components/KapacitorForm.tsx index a57b5985a..b722e89f0 100644 --- a/ui/src/kapacitor/components/KapacitorForm.tsx +++ b/ui/src/kapacitor/components/KapacitorForm.tsx @@ -6,6 +6,16 @@ import Input from 'src/kapacitor/components/KapacitorFormInput' import {Kapacitor, Source} from 'src/types' +export interface Notification { + id?: string + type: string + icon: string + duration: number + message: string +} + +type NotificationFunc = () => Notification + interface Props { kapacitor: Kapacitor exists: boolean @@ -15,6 +25,7 @@ interface Props { onChangeUrl: (e: ChangeEvent) => void source: Source hash: string + publishNotification: (message: Notification | NotificationFunc) => void } const KapacitorForm: SFC = ({ @@ -27,6 +38,7 @@ const KapacitorForm: SFC = ({ onInputChange, source, hash, + publishNotification, }) =>
@@ -102,14 +114,13 @@ const KapacitorForm: SFC = ({
- { - - } +
diff --git a/ui/src/kapacitor/containers/KapacitorPage.tsx b/ui/src/kapacitor/containers/KapacitorPage.tsx index 7da7ac3c8..aee066d33 100644 --- a/ui/src/kapacitor/containers/KapacitorPage.tsx +++ b/ui/src/kapacitor/containers/KapacitorPage.tsx @@ -28,7 +28,7 @@ import { export const defaultName = 'My Kapacitor' export const kapacitorPort = '9092' -type Notification = { +export interface Notification { id?: string type: string icon: string @@ -36,7 +36,7 @@ type Notification = { message: string } -type NotificationFunc = () => Notification +export type NotificationFunc = () => Notification interface Kapacitor { url: string @@ -93,8 +93,8 @@ export class KapacitorPage extends PureComponent { const kapacitor = await getKapacitor(source, id) this.setState({kapacitor}) await this.checkKapacitorConnection(kapacitor) - } catch (err) { - console.error('Could not get kapacitor: ', err) + } catch (error) { + console.error('Could not get kapacitor: ', error) publishNotification(NOTIFY_KAPACITOR_CONNECTION_FAILED) } } @@ -178,6 +178,7 @@ export class KapacitorPage extends PureComponent { await pingKapacitor(kapacitor) this.setState({exists: true}) } catch (error) { + console.error(error) this.setState({exists: false}) this.props.publishNotification(NOTIFY_KAPACITOR_CONNECTION_FAILED) } @@ -191,7 +192,7 @@ export class KapacitorPage extends PureComponent { } render() { - const {source, location, params} = this.props + const {source, location, params, publishNotification} = this.props const hash = (location && location.hash) || (params && params.hash) || '' const {kapacitor, exists} = this.state @@ -205,6 +206,7 @@ export class KapacitorPage extends PureComponent { onChangeUrl={this.handleChangeUrl} onReset={this.handleResetToDefaults} onInputChange={this.handleInputChange} + publishNotification={publishNotification} /> ) } diff --git a/ui/src/shared/apis/index.js b/ui/src/shared/apis/index.js index 96bfeced2..d08804d84 100644 --- a/ui/src/shared/apis/index.js +++ b/ui/src/shared/apis/index.js @@ -36,16 +36,22 @@ export function deleteSource(source) { }) } -export function pingKapacitor(kapacitor) { - return AJAX({ - method: 'GET', - url: kapacitor.links.ping, - }) +export const pingKapacitor = async kapacitor => { + try { + const data = await AJAX({ + method: 'GET', + url: kapacitor.links.ping, + }) + return data + } catch (error) { + console.error(error) + throw error + } } export const getKapacitor = async (source, kapacitorID) => { try { - const {data} = AJAX({ + const {data} = await AJAX({ url: `${source.links.kapacitors}/${kapacitorID}`, method: 'GET', }) @@ -134,7 +140,12 @@ export function updateKapacitor({ } export const getKapacitorConfig = async kapacitor => { - return await kapacitorProxy(kapacitor, 'GET', '/kapacitor/v1/config', '') + try { + return await kapacitorProxy(kapacitor, 'GET', '/kapacitor/v1/config', '') + } catch (error) { + console.error(error) + throw error + } } export const getKapacitorConfigSection = (kapacitor, section) => { diff --git a/ui/src/shared/copy/notifications.js b/ui/src/shared/copy/notifications.js index ee750050c..19f1a2cd6 100644 --- a/ui/src/shared/copy/notifications.js +++ b/ui/src/shared/copy/notifications.js @@ -456,7 +456,7 @@ export const NOTIFY_ALERT_ENDPOINT_SAVED = endpoint => ({ }) export const NOTIFY_ALERT_ENDPOINT_SAVE_FAILED = (endpoint, errorMessage) => ({ - ...defaultSuccessNotification, + ...defaultErrorNotification, message: `There was an error saving the alert configuration for ${endpoint}: ${errorMessage}`, }) diff --git a/ui/test/kapacitor/containers/KapacitorPage.test.tsx b/ui/test/kapacitor/containers/KapacitorPage.test.tsx index e8860e648..fbba550ce 100644 --- a/ui/test/kapacitor/containers/KapacitorPage.test.tsx +++ b/ui/test/kapacitor/containers/KapacitorPage.test.tsx @@ -199,6 +199,7 @@ describe('Kapacitor.Containers.KapacitorPage', () => { await wrapper.instance().componentDidMount() expect(wrapper.state().kapacitor).toEqual(mocks.kapacitor) + expect(wrapper.state().exists).toBe(true) }) }) })