From b3a806df6bf4183ffde2b439576bb685f0981a8c Mon Sep 17 00:00:00 2001 From: Deniz Kusefoglu Date: Mon, 23 Sep 2019 18:17:56 -0700 Subject: [PATCH] Fix endpoint type conversions (#15240) * Fix endpoint type conversions * Update reducer * Add token to slack endpoint * Add test for http endpoint --- ui/cypress/e2e/notificationEndpoints.test.ts | 24 ++++++++++ .../endpoints/EndpointOptionsHTTP.tsx | 4 ++ .../endpoints/EndpointOptionsSlack.tsx | 22 +++++++-- .../endpoints/EndpointOverlay.reducer.ts | 47 +++++++++++++++---- ui/src/types/alerting.ts | 1 + 5 files changed, 85 insertions(+), 13 deletions(-) diff --git a/ui/cypress/e2e/notificationEndpoints.test.ts b/ui/cypress/e2e/notificationEndpoints.test.ts index c45357fb79..7676177465 100644 --- a/ui/cypress/e2e/notificationEndpoints.test.ts +++ b/ui/cypress/e2e/notificationEndpoints.test.ts @@ -76,6 +76,25 @@ describe('Notification Endpoints', () => { cy.contains('Pagerduty') }) + cy.getByTestID('endpoint--dropdown-item http').click() + + cy.getByTestID('endpoint--dropdown--button').within(() => { + cy.contains('HTTP') + }) + }) + + cy.getByTestID('http-url') + .clear() + .type('http.url.us') + .should('have.value', 'http.url.us') + + cy.getByTestID('endpoint-change--dropdown') + .click() + .within(() => { + cy.getByTestID('endpoint--dropdown--button').within(() => { + cy.contains('HTTP') + }) + cy.getByTestID('endpoint--dropdown-item slack').click() cy.getByTestID('endpoint--dropdown--button').within(() => { @@ -88,6 +107,11 @@ describe('Notification Endpoints', () => { .type('slack.url.us') .should('have.value', 'slack.url.us') + cy.getByTestID('slack-token') + .clear() + .type('tokenzzzzzz') + .should('have.value', 'tokenzzzzzz') + cy.getByTestID('endpoint-save--button').click() cy.getByTestID(`endpoint-card ${name}`).should('exist') diff --git a/ui/src/alerting/components/endpoints/EndpointOptionsHTTP.tsx b/ui/src/alerting/components/endpoints/EndpointOptionsHTTP.tsx index 32ee9072a1..6de7eddc17 100644 --- a/ui/src/alerting/components/endpoints/EndpointOptionsHTTP.tsx +++ b/ui/src/alerting/components/endpoints/EndpointOptionsHTTP.tsx @@ -69,6 +69,7 @@ const EndpointOptionsHTTP: FC = ({ value={url} onChange={onChange} required={true} + testID="http-url" /> @@ -81,6 +82,7 @@ const EndpointOptionsHTTP: FC = ({ value={token} onChange={onChange} type={InputType.Password} + testID="http-bearer-token" /> @@ -98,6 +100,7 @@ const EndpointOptionsHTTP: FC = ({ ? InputType.Password : InputType.Text } + testID="http-username" /> @@ -108,6 +111,7 @@ const EndpointOptionsHTTP: FC = ({ value={password} type={InputType.Password} onChange={onChange} + testID="http-password" /> diff --git a/ui/src/alerting/components/endpoints/EndpointOptionsSlack.tsx b/ui/src/alerting/components/endpoints/EndpointOptionsSlack.tsx index 4ac4ab3b5f..23bfd6f6a9 100644 --- a/ui/src/alerting/components/endpoints/EndpointOptionsSlack.tsx +++ b/ui/src/alerting/components/endpoints/EndpointOptionsSlack.tsx @@ -2,7 +2,14 @@ import React, {FC, ChangeEvent} from 'react' // Components -import {Input, FormElement, Panel, Grid, Columns} from '@influxdata/clockface' +import { + Input, + FormElement, + Panel, + Grid, + Columns, + InputType, +} from '@influxdata/clockface' interface Props { url: string @@ -10,7 +17,7 @@ interface Props { onChange: (e: ChangeEvent) => void } -const EndpointOptionsSlack: FC = ({url, onChange}) => { +const EndpointOptionsSlack: FC = ({url, token, onChange}) => { return ( @@ -20,7 +27,7 @@ const EndpointOptionsSlack: FC = ({url, onChange}) => { - + = ({url, onChange}) => { onChange={onChange} /> + + + diff --git a/ui/src/alerting/components/endpoints/EndpointOverlay.reducer.ts b/ui/src/alerting/components/endpoints/EndpointOverlay.reducer.ts index 490ddbaeb6..7f481d7e8b 100644 --- a/ui/src/alerting/components/endpoints/EndpointOverlay.reducer.ts +++ b/ui/src/alerting/components/endpoints/EndpointOverlay.reducer.ts @@ -1,6 +1,9 @@ +import {omit} from 'lodash' + // Types import {NotificationEndpoint} from 'src/types' import {DEFAULT_ENDPOINT_URLS} from 'src/alerting/constants' +import {NotificationEndpointBase} from 'src/client' export type Action = | {type: 'UPDATE_ENDPOINT'; endpoint: NotificationEndpoint} @@ -9,7 +12,10 @@ export type Action = export type EndpointState = NotificationEndpoint -export const reducer = (state: EndpointState, action: Action) => { +export const reducer = ( + state: EndpointState, + action: Action +): EndpointState => { switch (action.type) { case 'UPDATE_ENDPOINT': { const {endpoint} = action @@ -18,25 +24,46 @@ export const reducer = (state: EndpointState, action: Action) => { case 'UPDATE_ENDPOINT_TYPE': { const {endpoint} = action if (state.type != endpoint.type) { + const baseProps: NotificationEndpointBase = omit(endpoint, [ + 'url', + 'token', + 'username', + 'password', + 'method', + 'authMethod', + 'contentTemplate', + 'headers', + 'clientURL', + 'routingKey', + ]) switch (endpoint.type) { case 'pagerduty': return { - ...state, - ...endpoint, + ...baseProps, + type: 'pagerduty', clientURL: `${location.origin}/orgs/${ - endpoint.orgID + baseProps.orgID }/alert-history`, + routingKey: '', } - default: + case 'http': return { - ...state, - ...endpoint, - url: DEFAULT_ENDPOINT_URLS[endpoint.type], + ...baseProps, + type: 'http', + method: 'POST', + authMethod: 'none', + url: DEFAULT_ENDPOINT_URLS.http, + } + case 'slack': + return { + ...baseProps, + type: 'slack', + url: DEFAULT_ENDPOINT_URLS.slack, + token: '', } } } - - return {...state, ...endpoint} + return state } case 'DELETE_ENDPOINT': { return state diff --git a/ui/src/types/alerting.ts b/ui/src/types/alerting.ts index 9f77d74411..57d9c705f2 100644 --- a/ui/src/types/alerting.ts +++ b/ui/src/types/alerting.ts @@ -98,6 +98,7 @@ export { SlackNotificationEndpoint, HTTPNotificationEndpoint, NotificationEndpointUpdate, + NotificationEndpointBase, } from '../client' import {Check, Threshold, HTTPNotificationEndpoint} from '../client'