From c8a5385ff31204c2339d0f6b5b6bb83261a4d839 Mon Sep 17 00:00:00 2001 From: shahzad Date: Fri, 20 Sep 2019 16:43:32 +0500 Subject: [PATCH 01/35] expanded row component --- .../monitor_list/condensed_check_list.tsx | 101 ++++++++++-------- .../functional/monitor_list/monitor_list.tsx | 33 +++--- .../monitor_list/monitor_list_drawer.tsx | 57 ++++++---- 3 files changed, 104 insertions(+), 87 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx index 7ac4b6e82602fc..8952e47cc5fbc4 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx @@ -13,10 +13,11 @@ import { EuiFlexGroup, } from '@elastic/eui'; import moment from 'moment'; -import React from 'react'; +import React, { useContext } from 'react'; import { CondensedCheck, CondensedCheckStatus } from './types'; import { MonitorListStatusColumn } from './monitor_list_status_column'; import { LocationLink } from './location_link'; +import { UptimeSettingsContext } from '../../../contexts'; const getBadgeColor = (status: string, successColor: string, dangerColor: string) => { switch (status) { @@ -44,51 +45,57 @@ const getHealthColor = (dangerColor: string, status: string, successColor: strin interface CondensedCheckListProps { condensedChecks: CondensedCheck[]; - successColor: string; - dangerColor: string; } -export const CondensedCheckList = ({ - condensedChecks, - dangerColor, - successColor, -}: CondensedCheckListProps) => ( - - {condensedChecks.map(({ childStatuses, location, status, timestamp }: CondensedCheck) => ( - - - - - - - - - - - - - - ip ? ( - - - - - {ip} - {moment(parseInt(condensedTimestamp, 10)).fromNow()} - - ) : null - )} - > - {`${childStatuses.length} checks`} - - - - ))} - -); +export const CondensedCheckList = ({ condensedChecks }: CondensedCheckListProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); + + return ( + + {condensedChecks.map(({ childStatuses, location, status, timestamp }: CondensedCheck) => ( + + + + + + + + + + + + + + ip ? ( + + + + + {ip} + + {moment(parseInt(condensedTimestamp, 10)).fromNow()} + + + ) : null + )} + > + {`${childStatuses.length} checks`} + + + + ))} + + ); +}; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx index 4d4a30b852c700..d7c618c1f5848d 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx @@ -21,7 +21,6 @@ import { MonitorListStatusColumn } from './monitor_list_status_column'; import { formatUptimeGraphQLErrorList } from '../../../lib/helper/format_error_list'; import { ExpandedRowMap } from './types'; import { MonitorListDrawer } from './monitor_list_drawer'; -import { CLIENT_DEFAULTS } from '../../../../common/constants'; import { MonitorBarSeries } from '../charts'; import { MonitorPageLink } from '../monitor_page_link'; import { MonitorListActionsPopover } from './monitor_list_actions_popover'; @@ -54,7 +53,6 @@ export const MonitorListComponent = (props: Props) => { absoluteStartDate, absoluteEndDate, dangerColor, - successColor, data, errors, hasActiveFilters, @@ -92,6 +90,21 @@ export const MonitorListComponent = (props: Props) => { // }, // }; + const getExpandedRowMap = () => { + return drawerIds.reduce((map: ExpandedRowMap, id: string) => { + return { + ...map, + [id]: ( + monitorId === id) : undefined + } + /> + ), + }; + }, {}); + }; + return ( @@ -110,21 +123,7 @@ export const MonitorListComponent = (props: Props) => { isExpandable={true} hasActions={true} itemId="monitor_id" - itemIdToExpandedRowMap={drawerIds.reduce((map: ExpandedRowMap, id: string) => { - return { - ...map, - [id]: ( - monitorId === id) : undefined - } - successColor={successColor} - dangerColor={dangerColor} - /> - ), - }; - }, {})} + itemIdToExpandedRowMap={getExpandedRowMap()} items={items} // TODO: not needed without sorting and pagination // onChange={onChange} diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index ac54518b6f49f3..521a4059add4c5 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -4,44 +4,55 @@ * you may not use this file except in compliance with the Elastic License. */ -import React from 'react'; -import { MonitorSummary } from '../../../../common/graphql/types'; +import React, { useContext } from 'react'; +import { EuiText, EuiHealth, EuiLink } from '@elastic/eui'; +import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; import { CheckList } from './check_list'; import { toCondensedCheck } from './to_condensed_check'; import { CondensedCheckList } from './condensed_check_list'; +import { CLIENT_DEFAULTS } from '../../../../common/constants'; +import { UptimeSettingsContext } from '../../../contexts'; interface MonitorListDrawerProps { summary?: MonitorSummary; - dangerColor: string; - successColor: string; - /** - * The number of checks the component should fully render - * before squashing them to single rows with condensed details. - */ - condensedCheckLimit: number; } /** * The elements shown when the user expands the monitor list rows. */ -export const MonitorListDrawer = ({ - condensedCheckLimit, - dangerColor, - successColor, - summary, -}: MonitorListDrawerProps) => { +export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); if (!summary || !summary.state.checks) { return null; } - if (summary.state.checks.length < condensedCheckLimit) { - return ; - } else { + const upLocations: CheckMonitor[] = []; + const downLocations: CheckMonitor[] = []; + summary.state.checks.forEach(check => { + if (check.monitor.status === 'up') { + upLocations.push(check.monitor); + } + if (check.monitor.status === 'down') { + downLocations.push(check.monitor); + } + }); + if (summary.state.checks.length < CLIENT_DEFAULTS.CONDENSED_CHECK_LIMIT) { return ( - + <> + {summary.state.url.full} + + + Down in {upLocations.map(location => (location.name || location.ip) + ',')} + + + + Up in {upLocations.map(location => (location.name || location.ip) + ',')} + + + ); + } else { + return ; } }; From 472868cbf5d6939b21ef6fd9cc110ea83b9357b6 Mon Sep 17 00:00:00 2001 From: shahzad Date: Fri, 20 Sep 2019 16:43:32 +0500 Subject: [PATCH 02/35] expanded row component --- .../monitor_list/condensed_check_list.tsx | 101 ++++++++++-------- .../functional/monitor_list/monitor_list.tsx | 33 +++--- .../monitor_list/monitor_list_drawer.tsx | 57 ++++++---- 3 files changed, 104 insertions(+), 87 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx index 7ac4b6e82602fc..8952e47cc5fbc4 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/condensed_check_list.tsx @@ -13,10 +13,11 @@ import { EuiFlexGroup, } from '@elastic/eui'; import moment from 'moment'; -import React from 'react'; +import React, { useContext } from 'react'; import { CondensedCheck, CondensedCheckStatus } from './types'; import { MonitorListStatusColumn } from './monitor_list_status_column'; import { LocationLink } from './location_link'; +import { UptimeSettingsContext } from '../../../contexts'; const getBadgeColor = (status: string, successColor: string, dangerColor: string) => { switch (status) { @@ -44,51 +45,57 @@ const getHealthColor = (dangerColor: string, status: string, successColor: strin interface CondensedCheckListProps { condensedChecks: CondensedCheck[]; - successColor: string; - dangerColor: string; } -export const CondensedCheckList = ({ - condensedChecks, - dangerColor, - successColor, -}: CondensedCheckListProps) => ( - - {condensedChecks.map(({ childStatuses, location, status, timestamp }: CondensedCheck) => ( - - - - - - - - - - - - - - ip ? ( - - - - - {ip} - {moment(parseInt(condensedTimestamp, 10)).fromNow()} - - ) : null - )} - > - {`${childStatuses.length} checks`} - - - - ))} - -); +export const CondensedCheckList = ({ condensedChecks }: CondensedCheckListProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); + + return ( + + {condensedChecks.map(({ childStatuses, location, status, timestamp }: CondensedCheck) => ( + + + + + + + + + + + + + + ip ? ( + + + + + {ip} + + {moment(parseInt(condensedTimestamp, 10)).fromNow()} + + + ) : null + )} + > + {`${childStatuses.length} checks`} + + + + ))} + + ); +}; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx index 4d4a30b852c700..d7c618c1f5848d 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx @@ -21,7 +21,6 @@ import { MonitorListStatusColumn } from './monitor_list_status_column'; import { formatUptimeGraphQLErrorList } from '../../../lib/helper/format_error_list'; import { ExpandedRowMap } from './types'; import { MonitorListDrawer } from './monitor_list_drawer'; -import { CLIENT_DEFAULTS } from '../../../../common/constants'; import { MonitorBarSeries } from '../charts'; import { MonitorPageLink } from '../monitor_page_link'; import { MonitorListActionsPopover } from './monitor_list_actions_popover'; @@ -54,7 +53,6 @@ export const MonitorListComponent = (props: Props) => { absoluteStartDate, absoluteEndDate, dangerColor, - successColor, data, errors, hasActiveFilters, @@ -92,6 +90,21 @@ export const MonitorListComponent = (props: Props) => { // }, // }; + const getExpandedRowMap = () => { + return drawerIds.reduce((map: ExpandedRowMap, id: string) => { + return { + ...map, + [id]: ( + monitorId === id) : undefined + } + /> + ), + }; + }, {}); + }; + return ( @@ -110,21 +123,7 @@ export const MonitorListComponent = (props: Props) => { isExpandable={true} hasActions={true} itemId="monitor_id" - itemIdToExpandedRowMap={drawerIds.reduce((map: ExpandedRowMap, id: string) => { - return { - ...map, - [id]: ( - monitorId === id) : undefined - } - successColor={successColor} - dangerColor={dangerColor} - /> - ), - }; - }, {})} + itemIdToExpandedRowMap={getExpandedRowMap()} items={items} // TODO: not needed without sorting and pagination // onChange={onChange} diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index ac54518b6f49f3..521a4059add4c5 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -4,44 +4,55 @@ * you may not use this file except in compliance with the Elastic License. */ -import React from 'react'; -import { MonitorSummary } from '../../../../common/graphql/types'; +import React, { useContext } from 'react'; +import { EuiText, EuiHealth, EuiLink } from '@elastic/eui'; +import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; import { CheckList } from './check_list'; import { toCondensedCheck } from './to_condensed_check'; import { CondensedCheckList } from './condensed_check_list'; +import { CLIENT_DEFAULTS } from '../../../../common/constants'; +import { UptimeSettingsContext } from '../../../contexts'; interface MonitorListDrawerProps { summary?: MonitorSummary; - dangerColor: string; - successColor: string; - /** - * The number of checks the component should fully render - * before squashing them to single rows with condensed details. - */ - condensedCheckLimit: number; } /** * The elements shown when the user expands the monitor list rows. */ -export const MonitorListDrawer = ({ - condensedCheckLimit, - dangerColor, - successColor, - summary, -}: MonitorListDrawerProps) => { +export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); if (!summary || !summary.state.checks) { return null; } - if (summary.state.checks.length < condensedCheckLimit) { - return ; - } else { + const upLocations: CheckMonitor[] = []; + const downLocations: CheckMonitor[] = []; + summary.state.checks.forEach(check => { + if (check.monitor.status === 'up') { + upLocations.push(check.monitor); + } + if (check.monitor.status === 'down') { + downLocations.push(check.monitor); + } + }); + if (summary.state.checks.length < CLIENT_DEFAULTS.CONDENSED_CHECK_LIMIT) { return ( - + <> + {summary.state.url.full} + + + Down in {upLocations.map(location => (location.name || location.ip) + ',')} + + + + Up in {upLocations.map(location => (location.name || location.ip) + ',')} + + + ); + } else { + return ; } }; From 03d188027dbe21c7a513a42a4c3ccd7bc94b69d7 Mon Sep 17 00:00:00 2001 From: shahzad Date: Fri, 20 Sep 2019 17:43:17 +0500 Subject: [PATCH 03/35] updated expand comp --- .../functional/monitor_list/monitor_list_drawer.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index 521a4059add4c5..b42dfc4fde8b80 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -5,7 +5,7 @@ */ import React, { useContext } from 'react'; -import { EuiText, EuiHealth, EuiLink } from '@elastic/eui'; +import { EuiText, EuiHealth, EuiLink, EuiSpacer } from '@elastic/eui'; import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; import { CheckList } from './check_list'; import { toCondensedCheck } from './to_condensed_check'; @@ -40,16 +40,18 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { if (summary.state.checks.length < CLIENT_DEFAULTS.CONDENSED_CHECK_LIMIT) { return ( <> - {summary.state.url.full} + {summary.state.url.full} + - Down in {upLocations.map(location => (location.name || location.ip) + ',')} + Down in {downLocations.map(location => (location.name || location.ip) + ',')} + Up in {upLocations.map(location => (location.name || location.ip) + ',')} - + {/* */} ); } else { From 7c612b1f364f4e84843ee4a38e686b56675f19fe Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 23 Sep 2019 15:48:59 +0500 Subject: [PATCH 04/35] update expander row --- .../monitor_list/monitor_list_drawer.tsx | 52 ++++++++++++++----- 1 file changed, 39 insertions(+), 13 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index b42dfc4fde8b80..ac678f2c61ba99 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -5,14 +5,27 @@ */ import React, { useContext } from 'react'; -import { EuiText, EuiHealth, EuiLink, EuiSpacer } from '@elastic/eui'; +import { + EuiText, + EuiHealth, + EuiLink, + EuiSpacer, + EuiFlexGroup, + EuiFlexItem, + EuiButton, +} from '@elastic/eui'; +import { get } from 'lodash'; +import styled from 'styled-components'; import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; -import { CheckList } from './check_list'; import { toCondensedCheck } from './to_condensed_check'; import { CondensedCheckList } from './condensed_check_list'; import { CLIENT_DEFAULTS } from '../../../../common/constants'; import { UptimeSettingsContext } from '../../../contexts'; +const ContainerDiv = styled.div` + padding: 10px; +`; + interface MonitorListDrawerProps { summary?: MonitorSummary; } @@ -37,23 +50,36 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { downLocations.push(check.monitor); } }); - if (summary.state.checks.length < CLIENT_DEFAULTS.CONDENSED_CHECK_LIMIT) { + const displayMonitorStatus = (locations: CheckMonitor[], color: string) => { return ( <> - {summary.state.url.full} - - - - Down in {downLocations.map(location => (location.name || location.ip) + ',')} + + + Up in{' '} + {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} - - - Up in {upLocations.map(location => (location.name || location.ip) + ',')} - - {/* */} ); + }; + if (summary.state.checks.length < CLIENT_DEFAULTS.CONDENSED_CHECK_LIMIT) { + const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); + + return ( + + + + {monitorUrl} + + + Actions + + + + {downLocations.length > 0 && displayMonitorStatus(downLocations, danger)} + {upLocations.length > 0 && displayMonitorStatus(upLocations, success)} + + ); } else { return ; } From 7f7da690704a15093feca1d563fb95544482b20c Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 24 Sep 2019 11:55:11 +0500 Subject: [PATCH 05/35] update expanded row --- .../functional/monitor_list/monitor_list_drawer.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index ac678f2c61ba99..93d53bb5f66195 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -13,6 +13,7 @@ import { EuiFlexGroup, EuiFlexItem, EuiButton, + EuiIcon, } from '@elastic/eui'; import { get } from 'lodash'; import styled from 'styled-components'; @@ -69,9 +70,12 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { - {monitorUrl} + + {monitorUrl} + + - + Actions From 88fcba207aa204c4a2ee73d5cd480884c9ca9d4d Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 25 Sep 2019 00:16:25 +0500 Subject: [PATCH 06/35] update graphql schema --- .../plugins/uptime/common/graphql/introspection.json | 8 ++++++++ x-pack/legacy/plugins/uptime/common/graphql/types.ts | 2 ++ .../functional/monitor_list/monitor_list_drawer.tsx | 8 ++++---- .../plugins/uptime/public/queries/monitor_states_query.ts | 4 ++++ .../uptime/server/graphql/monitor_states/schema.gql.ts | 1 + .../elasticsearch_monitor_states_adapter.ts | 6 +++++- 6 files changed, 24 insertions(+), 5 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/common/graphql/introspection.json b/x-pack/legacy/plugins/uptime/common/graphql/introspection.json index 8da0597c393da9..6749ac9e36dbe9 100644 --- a/x-pack/legacy/plugins/uptime/common/graphql/introspection.json +++ b/x-pack/legacy/plugins/uptime/common/graphql/introspection.json @@ -2772,6 +2772,14 @@ "type": { "kind": "OBJECT", "name": "StateUrl", "ofType": null }, "isDeprecated": false, "deprecationReason": null + }, + { + "name": "error", + "description": "", + "args": [], + "type": { "kind": "OBJECT", "name": "Error", "ofType": null }, + "isDeprecated": false, + "deprecationReason": null } ], "inputFields": null, diff --git a/x-pack/legacy/plugins/uptime/common/graphql/types.ts b/x-pack/legacy/plugins/uptime/common/graphql/types.ts index a5b55526ffdac5..84be7f4d1b2e61 100644 --- a/x-pack/legacy/plugins/uptime/common/graphql/types.ts +++ b/x-pack/legacy/plugins/uptime/common/graphql/types.ts @@ -529,6 +529,8 @@ export interface State { tls?: (StateTls | null)[] | null; url?: StateUrl | null; + + error?: Error | null; } export interface Agent { diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index 93d53bb5f66195..352fb9f890c1e3 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -51,12 +51,12 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { downLocations.push(check.monitor); } }); - const displayMonitorStatus = (locations: CheckMonitor[], color: string) => { + const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { return ( <> - Up in{' '} + {titleTxt} in{' '} {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} @@ -80,8 +80,8 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { - {downLocations.length > 0 && displayMonitorStatus(downLocations, danger)} - {upLocations.length > 0 && displayMonitorStatus(upLocations, success)} + {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} + {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} ); } else { diff --git a/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts b/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts index 48e7adad4cc9c4..5d34608d97d2fe 100644 --- a/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts +++ b/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts @@ -97,6 +97,10 @@ query MonitorStates($dateRangeStart: String!, $dateRangeEnd: String!, $filters: domain } timestamp + error { + type + message + } } } } diff --git a/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts b/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts index f92a2edf6d9e5f..d9e2fa5ba87408 100644 --- a/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts +++ b/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts @@ -136,6 +136,7 @@ export const monitorStatesSchema = gql` "Transport encryption information." tls: [StateTLS] url: StateUrl + error: Error } "Represents the current state and associated data for an Uptime monitor." diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitor_states/elasticsearch_monitor_states_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitor_states/elasticsearch_monitor_states_adapter.ts index 3ee25001445a5b..2ecd4a353eabde 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitor_states/elasticsearch_monitor_states_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitor_states/elasticsearch_monitor_states_adapter.ts @@ -306,6 +306,7 @@ export class ElasticsearchMonitorStatesAdapter implements UMMonitorStatesAdapter Collection podUids = new HashSet(); Collection containerIds = new HashSet(); Collection tls = new HashSet(); + Map error = new HashMap(); String name = null; for (state in states) { result.putAll(state.globals); @@ -339,6 +340,9 @@ export class ElasticsearchMonitorStatesAdapter implements UMMonitorStatesAdapter if (check.tls != null) { tls.add(check.tls); } + if(check.error != null){ + error = check.error; + } } } @@ -379,7 +383,7 @@ export class ElasticsearchMonitorStatesAdapter implements UMMonitorStatesAdapter result.tls = new HashMap(); result.tls = tls; } - + result.error = error; return result; `, }, From 437071e2604ea1b978a9e51598863ff6dfabe856 Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 30 Sep 2019 19:13:49 +0500 Subject: [PATCH 07/35] update styling --- .../functional/monitor_list/monitor_list_drawer.tsx | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index eff80e4fca77af..059e898a0d99ba 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -6,7 +6,6 @@ import React, { useContext } from 'react'; import { - EuiText, EuiHealth, EuiLink, EuiSpacer, @@ -22,6 +21,7 @@ import { UptimeSettingsContext } from '../../../contexts'; const ContainerDiv = styled.div` padding: 10px; + width: 100%; `; interface MonitorListDrawerProps { @@ -51,11 +51,10 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { return ( <> - - + {titleTxt} in{' '} {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} - + ); From 702f37d38699d8c931f87e16fbcc50b3d9f06cb2 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 1 Oct 2019 17:18:12 +0500 Subject: [PATCH 08/35] added monitor detail route --- .../index_pattern/get_index_pattern.ts | 7 +++++ .../lib/adapters/monitors/adapter_types.ts | 1 + .../elasticsearch_monitors_adapter.ts | 6 +++++ .../plugins/uptime/server/rest_api/index.ts | 2 ++ .../uptime/server/rest_api/monitors/index.ts | 7 +++++ .../rest_api/monitors/monitors_details.ts | 27 +++++++++++++++++++ 6 files changed, 50 insertions(+) create mode 100644 x-pack/legacy/plugins/uptime/server/rest_api/monitors/index.ts create mode 100644 x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts diff --git a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts index fd4161b35f7ddb..6082cfa332872d 100644 --- a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts +++ b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts @@ -16,6 +16,13 @@ import { getApiPath } from '../../helper'; export const getIndexPattern = async (basePath?: string, setter?: (data: unknown) => void) => { try { const { data } = await axios.get(getApiPath('/api/uptime/index_pattern', basePath)); + const { data2 } = await axios.get( + getApiPath( + `/api/uptime/monitor/details?monitorId=bad-ssl&checkGroup=8f9a37fb-573a-4fdc-9895-440a5b39c250`, + basePath + ) + ); + if (setter) { setter(data); } diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts index 8c184c3356989d..6aa1fda1e1a017 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts @@ -23,4 +23,5 @@ export interface UMMonitorsAdapter { ): Promise; getFilterBar(request: any, dateRangeStart: string, dateRangeEnd: string): Promise; getMonitorPageTitle(request: any, monitorId: string): Promise; + getMonitorDetails(request: any, monitorId: string, checkGroup: string): Promise; } diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts index 8bfe1eb01524c8..f55795be1140e9 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts @@ -427,4 +427,10 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { name: get(pageTitle, 'monitor.name', null), }; } + + getMonitorDetails(request: any, monitorId: string, checkGroup: string): Promise { + return { + data: monitorId, + }; + } } diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/index.ts b/x-pack/legacy/plugins/uptime/server/rest_api/index.ts index 53ed7da4779a4e..cc702362a57a83 100644 --- a/x-pack/legacy/plugins/uptime/server/rest_api/index.ts +++ b/x-pack/legacy/plugins/uptime/server/rest_api/index.ts @@ -9,6 +9,7 @@ import { createGetAllRoute } from './pings'; import { createGetIndexPatternRoute } from './index_pattern'; import { createLogMonitorPageRoute, createLogOverviewPageRoute } from './telemetry'; import { UMRestApiRouteCreator } from './types'; +import { createGetMonitorDetailsRoute } from './monitors'; export * from './types'; export { createRouteWithAuth } from './create_route_with_auth'; @@ -18,4 +19,5 @@ export const restApiRoutes: UMRestApiRouteCreator[] = [ createLogMonitorPageRoute, createLogOverviewPageRoute, createGetIndexPatternRoute, + createGetMonitorDetailsRoute, ]; diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/index.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/index.ts new file mode 100644 index 00000000000000..2c4b9e9fb1f3e1 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/index.ts @@ -0,0 +1,7 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +export { createGetMonitorDetailsRoute } from './monitors_details'; diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts new file mode 100644 index 00000000000000..0f86064dd1ec34 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts @@ -0,0 +1,27 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import Joi from 'joi'; +import { PingResults } from '../../../common/graphql/types'; +import { UMServerLibs } from '../../lib/lib'; + +export const createGetMonitorDetailsRoute = (libs: UMServerLibs) => ({ + method: 'GET', + path: '/api/uptime/monitor/details', + options: { + validate: { + query: Joi.object({ + monitorId: Joi.string(), + checkGroup: Joi.string(), + }), + }, + tags: ['access:uptime'], + }, + handler: async (request: any): Promise => { + const { monitorId, checkGroup } = request.query; + return await libs.monitors.getMonitorDetails(request, monitorId, checkGroup); + }, +}); From 30c4dff6b51518bc19f250fee8f3849d48db41eb Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 2 Oct 2019 02:12:30 +0500 Subject: [PATCH 09/35] added monitor state --- .../monitor_list/monitor_list_drawer.tsx | 15 +++++++- .../uptime/public/state/actions/monitor.ts | 26 ++++++++++++++ .../uptime/public/state/reducers/monitor.ts | 31 ++++++++++++++++ .../elasticsearch_monitors_adapter.ts | 36 +++++++++++++++++-- 4 files changed, 105 insertions(+), 3 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts create mode 100644 x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index 059e898a0d99ba..a555e86baa001f 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -16,8 +16,10 @@ import { } from '@elastic/eui'; import { get } from 'lodash'; import styled from 'styled-components'; +import { connect } from 'react-redux'; import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../contexts'; +import { AppState } from '../../../state'; const ContainerDiv = styled.div` padding: 10px; @@ -31,7 +33,7 @@ interface MonitorListDrawerProps { /** * The elements shown when the user expands the monitor list rows. */ -export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { +export const MonitorListDrawerComponent = ({ summary }: MonitorListDrawerProps) => { const { colors: { success, danger }, } = useContext(UptimeSettingsContext); @@ -80,3 +82,14 @@ export const MonitorListDrawer = ({ summary }: MonitorListDrawerProps) => { ); }; + +const mapStateToProps = (state: AppState) => ({ + // monitorDetails: getMonitorDetails(state), +}); + +const mapDispatchToProps = (dispatch: any) => ({}); + +export const MonitorListDrawer = connect( + mapStateToProps, + mapDispatchToProps +)(MonitorListDrawerComponent); diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts new file mode 100644 index 00000000000000..401595e3d8428e --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts @@ -0,0 +1,26 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +export const GET_MONITOR_DETAILS = 'GET_MONITOR_DETAILS'; + +export interface MonitorState { + id: string; + open: boolean; +} + +interface SetIntegrationPopoverAction { + type: typeof GET_MONITOR_DETAILS; + payload: MonitorState; +} + +export function toggleIntegrationsPopover(popoverState: MonitorState): SetIntegrationPopoverAction { + return { + type: GET_MONITOR_DETAILS, + payload: popoverState, + }; +} + +export type UiActionTypes = SetIntegrationPopoverAction; diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts new file mode 100644 index 00000000000000..f4cfdf6de33aca --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -0,0 +1,31 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { UiActionTypes, MonitorState, GET_MONITOR_DETAILS } from '../actions/monitor'; + +export interface UiState { + integrationsPopoverOpen: MonitorState | null; +} + +const initialState: UiState = { + integrationsPopoverOpen: null, +}; + +export function uiReducer(state = initialState, action: UiActionTypes): UiState { + switch (action.type) { + case GET_MONITOR_DETAILS: + const popoverState = action.payload; + return { + ...state, + integrationsPopoverOpen: { + id: popoverState.id, + open: popoverState.open, + }, + }; + default: + return state; + } +} diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts index f55795be1140e9..90c6d72807b287 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts @@ -12,6 +12,7 @@ import { MonitorPageTitle, Ping, LocationDurationLine, + Error, } from '../../../../common/graphql/types'; import { dropLatestBucket, @@ -428,9 +429,40 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { }; } - getMonitorDetails(request: any, monitorId: string, checkGroup: string): Promise { + public async getMonitorDetails( + request: any, + monitorId: string, + checkGroup: string + ): Promise { + const params = { + index: INDEX_NAMES.HEARTBEAT, + body: { + size: 1, + query: { + bool: { + filter: [ + { + term: { + 'monitor.id': monitorId, + }, + }, + { + term: { + 'monitor.check_group': checkGroup, + }, + }, + ], + }, + }, + }, + }; + + const result = await this.database.search(request, params); + + const monitorError: Error | null = get(result, 'hits.hits[0]._source.error', null); + return { - data: monitorId, + monitorError, }; } } From e53c96ecd2bc6e9a62d13142d67b93355a85eb36 Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 2 Oct 2019 13:54:05 +0500 Subject: [PATCH 10/35] added monitor details state --- .../monitor_list/monitor_list_drawer.tsx | 17 +++++++- .../index_pattern/get_index_pattern.ts | 6 --- .../uptime/public/state/actions/monitor.ts | 43 ++++++++++++++----- .../plugins/uptime/public/state/api/index.ts | 5 +++ .../uptime/public/state/api/monitor.ts | 27 ++++++++++++ .../plugins/uptime/public/state/index.ts | 10 ++++- .../uptime/public/state/reducers/monitor.ts | 35 +++++++++------ .../uptime/public/state/sagas/index.ts | 9 ++-- .../uptime/public/state/sagas/monitor.ts | 26 +++++++++++ .../uptime/public/state/selectors/index.ts | 2 + 10 files changed, 143 insertions(+), 37 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/state/api/index.ts create mode 100644 x-pack/legacy/plugins/uptime/public/state/api/monitor.ts create mode 100644 x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx index a555e86baa001f..71aa09f231faa7 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx @@ -20,6 +20,7 @@ import { connect } from 'react-redux'; import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../contexts'; import { AppState } from '../../../state'; +import { fetchMonitorDetails, MonitorDetailsRequest } from '../../../state/actions/monitor'; const ContainerDiv = styled.div` padding: 10px; @@ -28,12 +29,16 @@ const ContainerDiv = styled.div` interface MonitorListDrawerProps { summary?: MonitorSummary; + loadMonitorDetails: typeof fetchMonitorDetails; } /** * The elements shown when the user expands the monitor list rows. */ -export const MonitorListDrawerComponent = ({ summary }: MonitorListDrawerProps) => { +export const MonitorListDrawerComponent = ({ + summary, + loadMonitorDetails, +}: MonitorListDrawerProps) => { const { colors: { success, danger }, } = useContext(UptimeSettingsContext); @@ -50,6 +55,12 @@ export const MonitorListDrawerComponent = ({ summary }: MonitorListDrawerProps) downLocations.push(check.monitor); } }); + + const checkGroup: string = get(summary, 'state.checks[0].agent.id'); + loadMonitorDetails({ + checkGroup, + monitorId: summary.monitor_id, + }); const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { return ( <> @@ -87,7 +98,9 @@ const mapStateToProps = (state: AppState) => ({ // monitorDetails: getMonitorDetails(state), }); -const mapDispatchToProps = (dispatch: any) => ({}); +const mapDispatchToProps = (dispatch: any) => ({ + loadMonitorDetails: (data: MonitorDetailsRequest) => dispatch(fetchMonitorDetails(data)), +}); export const MonitorListDrawer = connect( mapStateToProps, diff --git a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts index 6082cfa332872d..b5d41e1bf7e300 100644 --- a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts +++ b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts @@ -16,12 +16,6 @@ import { getApiPath } from '../../helper'; export const getIndexPattern = async (basePath?: string, setter?: (data: unknown) => void) => { try { const { data } = await axios.get(getApiPath('/api/uptime/index_pattern', basePath)); - const { data2 } = await axios.get( - getApiPath( - `/api/uptime/monitor/details?monitorId=bad-ssl&checkGroup=8f9a37fb-573a-4fdc-9895-440a5b39c250`, - basePath - ) - ); if (setter) { setter(data); diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts index 401595e3d8428e..41308688f08d4c 100644 --- a/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts @@ -4,23 +4,44 @@ * you may not use this file except in compliance with the Elastic License. */ -export const GET_MONITOR_DETAILS = 'GET_MONITOR_DETAILS'; +export const FETCH_MONITOR_DETAILS = 'FETCH_MONITOR_DETAILS'; +export const FETCH_MONITOR_DETAILS_SUCCESS = 'FETCH_MONITOR_DETAILS_SUCCESS'; +export const FETCH_MONITOR_DETAILS_FAIL = 'FETCH_MONITOR_DETAILS_FAIL'; -export interface MonitorState { - id: string; - open: boolean; +export interface MonitorDetailsState { + error: Error; } -interface SetIntegrationPopoverAction { - type: typeof GET_MONITOR_DETAILS; - payload: MonitorState; +export interface MonitorDetailsRequest { + monitorId: string; + checkGroup: string; } -export function toggleIntegrationsPopover(popoverState: MonitorState): SetIntegrationPopoverAction { +interface GetMonitorDetailsAction { + type: typeof FETCH_MONITOR_DETAILS; + payload: MonitorDetailsRequest; +} + +interface GetMonitorDetailsSuccessAction { + type: typeof FETCH_MONITOR_DETAILS_SUCCESS; + payload: MonitorDetailsState; +} + +interface GetMonitorDetailsFailAction { + type: typeof FETCH_MONITOR_DETAILS_FAIL; + payload: any; +} + +export function fetchMonitorDetails( + monitorDetailsState: MonitorDetailsRequest +): GetMonitorDetailsAction { return { - type: GET_MONITOR_DETAILS, - payload: popoverState, + type: FETCH_MONITOR_DETAILS, + payload: monitorDetailsState, }; } -export type UiActionTypes = SetIntegrationPopoverAction; +export type MonitorActionTypes = + | GetMonitorDetailsAction + | GetMonitorDetailsSuccessAction + | GetMonitorDetailsFailAction; diff --git a/x-pack/legacy/plugins/uptime/public/state/api/index.ts b/x-pack/legacy/plugins/uptime/public/state/api/index.ts new file mode 100644 index 00000000000000..41bc2aa2588073 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/api/index.ts @@ -0,0 +1,5 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ diff --git a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts new file mode 100644 index 00000000000000..fae4ae1964d343 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts @@ -0,0 +1,27 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { useContext } from 'react'; +import { MonitorDetailsRequest, MonitorDetailsState } from '../actions/monitor'; +import { getApiPath } from '../../lib/helper'; +import { UptimeSettingsContext } from '../../contexts'; + +export const fetchMonitorDetails = async ( + data: MonitorDetailsRequest +): Promise => { + const { basePath } = useContext(UptimeSettingsContext); + const { monitorId, checkGroup } = data; + + const url = getApiPath( + `/api/uptime/monitor/details?monitorId=${monitorId}&checkGroup=${checkGroup}`, + basePath + ); + const response = await fetch(url); + if (!response.ok) { + throw new Error(response.statusText); + } + return response.json(); +}; diff --git a/x-pack/legacy/plugins/uptime/public/state/index.ts b/x-pack/legacy/plugins/uptime/public/state/index.ts index 4ef3d26776a7e2..2e9e80e731d097 100644 --- a/x-pack/legacy/plugins/uptime/public/state/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/index.ts @@ -3,12 +3,18 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ -import { compose, createStore } from 'redux'; +import { compose, createStore, applyMiddleware } from 'redux'; +import createSagaMiddleware from 'redux-saga'; import { rootReducer } from './reducers'; +import { rootSaga } from './sagas'; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; -export const store = createStore(rootReducer, composeEnhancers()); +const sagaMW = createSagaMiddleware(); + +export const store = createStore(rootReducer, composeEnhancers(applyMiddleware(sagaMW))); export type AppState = ReturnType; + +sagaMW.run(rootSaga); diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts index f4cfdf6de33aca..bc71623f33e74e 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -4,26 +4,37 @@ * you may not use this file except in compliance with the Elastic License. */ -import { UiActionTypes, MonitorState, GET_MONITOR_DETAILS } from '../actions/monitor'; +import { + MonitorActionTypes, + MonitorDetailsState, + FETCH_MONITOR_DETAILS, + FETCH_MONITOR_DETAILS_SUCCESS, + FETCH_MONITOR_DETAILS_FAIL, +} from '../actions/monitor'; -export interface UiState { - integrationsPopoverOpen: MonitorState | null; +export interface MonitorState { + monitorDetails: MonitorDetailsState[] | []; } -const initialState: UiState = { - integrationsPopoverOpen: null, +const initialState: MonitorState = { + monitorDetails: [], }; -export function uiReducer(state = initialState, action: UiActionTypes): UiState { +export function uiReducer(state = initialState, action: MonitorActionTypes): MonitorState { switch (action.type) { - case GET_MONITOR_DETAILS: - const popoverState = action.payload; + case FETCH_MONITOR_DETAILS: + return { + ...state, + }; + case FETCH_MONITOR_DETAILS_SUCCESS: + const monitorDetails = action.payload; + return { + ...state, + monitorDetails: [...state.monitorDetails, monitorDetails], + }; + case FETCH_MONITOR_DETAILS_FAIL: return { ...state, - integrationsPopoverOpen: { - id: popoverState.id, - open: popoverState.open, - }, }; default: return state; diff --git a/x-pack/legacy/plugins/uptime/public/state/sagas/index.ts b/x-pack/legacy/plugins/uptime/public/state/sagas/index.ts index 7bb3c694f5120b..e9b15e010c2bbc 100644 --- a/x-pack/legacy/plugins/uptime/public/state/sagas/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/sagas/index.ts @@ -4,8 +4,9 @@ * you may not use this file except in compliance with the Elastic License. */ -// import { fork } from 'redux-saga/effects'; +import { fork } from 'redux-saga/effects'; +import { fetchMonitorDetailsSaga } from './monitor'; -// export function* rootSaga() { -// yield fork(); -// } +export function* rootSaga() { + yield fork(fetchMonitorDetailsSaga); +} diff --git a/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts new file mode 100644 index 00000000000000..3dfaa6465f3e18 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts @@ -0,0 +1,26 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { call, put, takeEvery } from 'redux-saga/effects'; +import { Action } from 'redux-actions'; + +import { MonitorActionTypes, FETCH_MONITOR_DETAILS } from '../actions/monitor'; +import { fetchMonitorDetails } from '../api/monitor'; + +function* monitorDetailsSaga(action: Action) { + const data: any = action.payload; + + try { + const response = yield call(fetchMonitorDetails, data); + yield put({ type: 'REQUEST_SUCCEEDED', payload: response }); + } catch (error) { + yield put({ type: 'REQUEST_FAILED', error }); + } +} + +export function* fetchMonitorDetailsSaga() { + yield takeEvery(FETCH_MONITOR_DETAILS, monitorDetailsSaga); +} diff --git a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts index 223e7c029cb1cb..eb263a9b696a9a 100644 --- a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts @@ -6,3 +6,5 @@ import { AppState } from '../../state'; export const isIntegrationsPopupOpen = (state: AppState) => state.ui.integrationsPopoverOpen; + +export const getMonitorDetails = (state: AppState) => state.ui.integrationsPopoverOpen; From c9c4694cc5613926e537227c743177334b6087d5 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 8 Oct 2019 01:42:28 +0500 Subject: [PATCH 11/35] update drawer --- .../functional/monitor_list/monitor_list.tsx | 14 +-- .../monitor_list_actions_popover.tsx | 16 ++- .../monitor_list/monitor_list_drawer.tsx | 108 ------------------ .../__tests__/monitor_list_drawer.test.tsx | 2 +- .../monitor_list/monitor_list_drawer/index.ts | 7 ++ .../monitor_list_drawer.tsx | 75 ++++++++++++ .../monitor_list_drawer/most_recent_error.tsx | 29 +++++ .../uptime/public/state/actions/monitor.ts | 28 +++-- .../uptime/public/state/api/monitor.ts | 12 +- .../public/state/{sagas => effects}/index.ts | 0 .../uptime/public/state/effects/monitor.ts | 31 +++++ .../plugins/uptime/public/state/index.ts | 2 +- .../uptime/public/state/reducers/index.ts | 3 +- .../uptime/public/state/reducers/monitor.ts | 10 +- .../uptime/public/state/sagas/monitor.ts | 26 ----- .../uptime/public/state/selectors/index.ts | 4 +- .../elasticsearch_monitors_adapter.ts | 20 +++- .../rest_api/monitors/monitors_details.ts | 1 - x-pack/package.json | 2 +- yarn.lock | 88 +++++++++++++- 20 files changed, 299 insertions(+), 179 deletions(-) delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx rename x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/{ => monitor_list_drawer}/__tests__/monitor_list_drawer.test.tsx (96%) create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx rename x-pack/legacy/plugins/uptime/public/state/{sagas => effects}/index.ts (100%) create mode 100644 x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts delete mode 100644 x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx index fc340317e5d0cc..aa5b4c44ff94d4 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx @@ -95,11 +95,11 @@ export const MonitorListComponent = (props: Props) => { return { ...map, [id]: ( - monitorId === id) : undefined - } - /> + <> + monitorId === id)} + /> + ), }; }, {}); @@ -250,9 +250,9 @@ export const MonitorListComponent = (props: Props) => { }, } )} - iconType={drawerIds.find(item => item === id) ? 'arrowUp' : 'arrowDown'} + iconType={drawerIds.includes(id) ? 'arrowUp' : 'arrowDown'} onClick={() => { - if (drawerIds.find(i => id === i)) { + if (drawerIds.includes(id)) { updateDrawerIds(drawerIds.filter(p => p !== id)); } else { updateDrawerIds([...drawerIds, id]); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx index 04f195d42531bc..7d42f0f05b2ba0 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx @@ -5,7 +5,7 @@ */ import { EuiButtonIcon, EuiPopover } from '@elastic/eui'; -import React, { useContext } from 'react'; +import React, { useContext, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; import { get } from 'lodash'; import { connect } from 'react-redux'; @@ -15,17 +15,20 @@ import { UptimeSettingsContext } from '../../../contexts'; import { isIntegrationsPopupOpen } from '../../../state/selectors'; import { AppState } from '../../../state'; import { toggleIntegrationsPopover, PopoverState } from '../../../state/actions'; +import { fetchMonitorDetails, FETCH_MONITOR_DETAILS } from '../../../state/actions/monitor'; interface MonitorListActionsPopoverProps { summary: MonitorSummary; popoverState: PopoverState | null; togglePopoverIsVisible: typeof toggleIntegrationsPopover; + loadMonitorDetails: any; } const MonitorListActionsPopoverComponent = ({ summary, popoverState, togglePopoverIsVisible, + loadMonitorDetails, }: MonitorListActionsPopoverProps) => { const popoverId = `${summary.monitor_id}_popover`; const { @@ -37,6 +40,11 @@ const MonitorListActionsPopoverComponent = ({ isLogsAvailable, } = useContext(UptimeSettingsContext); + useEffect(() => { + togglePopoverIsVisible({ id: '', open: false }); + loadMonitorDetails('bad-ssl'); + }, []); + const monitorUrl: string | undefined = get(summary, 'state.url.full', undefined); const isPopoverOpen: boolean = !!popoverState && popoverState.open && popoverState.id === popoverId; @@ -83,6 +91,12 @@ const mapDispatchToProps = (dispatch: any) => ({ togglePopoverIsVisible: (popoverState: PopoverState) => { return dispatch(toggleIntegrationsPopover(popoverState)); }, + loadMonitorDetails: (monitorId: string) => { + return dispatch({ + type: FETCH_MONITOR_DETAILS, + payload: monitorId, + }); + }, }); export const MonitorListActionsPopover = connect( diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx deleted file mode 100644 index 71aa09f231faa7..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer.tsx +++ /dev/null @@ -1,108 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import React, { useContext } from 'react'; -import { - EuiHealth, - EuiLink, - EuiSpacer, - EuiFlexGroup, - EuiFlexItem, - EuiButton, - EuiIcon, -} from '@elastic/eui'; -import { get } from 'lodash'; -import styled from 'styled-components'; -import { connect } from 'react-redux'; -import { MonitorSummary, CheckMonitor } from '../../../../common/graphql/types'; -import { UptimeSettingsContext } from '../../../contexts'; -import { AppState } from '../../../state'; -import { fetchMonitorDetails, MonitorDetailsRequest } from '../../../state/actions/monitor'; - -const ContainerDiv = styled.div` - padding: 10px; - width: 100%; -`; - -interface MonitorListDrawerProps { - summary?: MonitorSummary; - loadMonitorDetails: typeof fetchMonitorDetails; -} - -/** - * The elements shown when the user expands the monitor list rows. - */ -export const MonitorListDrawerComponent = ({ - summary, - loadMonitorDetails, -}: MonitorListDrawerProps) => { - const { - colors: { success, danger }, - } = useContext(UptimeSettingsContext); - if (!summary || !summary.state.checks) { - return null; - } - const upLocations: CheckMonitor[] = []; - const downLocations: CheckMonitor[] = []; - summary.state.checks.forEach(check => { - if (check.monitor.status === 'up') { - upLocations.push(check.monitor); - } - if (check.monitor.status === 'down') { - downLocations.push(check.monitor); - } - }); - - const checkGroup: string = get(summary, 'state.checks[0].agent.id'); - loadMonitorDetails({ - checkGroup, - monitorId: summary.monitor_id, - }); - const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { - return ( - <> - - {titleTxt} in{' '} - {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} - - - - ); - }; - const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); - - return ( - - - - - {monitorUrl} - - - - - Actions - - - - {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} - {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} - - ); -}; - -const mapStateToProps = (state: AppState) => ({ - // monitorDetails: getMonitorDetails(state), -}); - -const mapDispatchToProps = (dispatch: any) => ({ - loadMonitorDetails: (data: MonitorDetailsRequest) => dispatch(fetchMonitorDetails(data)), -}); - -export const MonitorListDrawer = connect( - mapStateToProps, - mapDispatchToProps -)(MonitorListDrawerComponent); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_list_drawer.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx similarity index 96% rename from x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_list_drawer.test.tsx rename to x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx index cd3511257bcaac..3389d18717eb9a 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_list_drawer.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import { MonitorSummary, Check } from '../../../../../common/graphql/types'; +import { MonitorSummary, Check } from '../../../../../../common/graphql/types'; import { shallowWithIntl } from 'test_utils/enzyme_helpers'; import React from 'react'; import { MonitorListDrawer } from '../monitor_list_drawer'; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts new file mode 100644 index 00000000000000..dc8e7bca865a85 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts @@ -0,0 +1,7 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +export { MonitorListDrawer } from './monitor_list_drawer'; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx new file mode 100644 index 00000000000000..62610dbb4eb035 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -0,0 +1,75 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React, { useContext, useEffect } from 'react'; +import { + EuiHealth, + EuiLink, + EuiSpacer, + EuiFlexGroup, + EuiFlexItem, + EuiButton, + EuiIcon, +} from '@elastic/eui'; +import { get } from 'lodash'; +import styled from 'styled-components'; +import { connect } from 'react-redux'; +import { MonitorSummary, CheckMonitor } from '../../../../../common/graphql/types'; +import { UptimeSettingsContext } from '../../../../contexts'; +import { AppState } from '../../../../state'; +import { MonitorDetailsRequest } from '../../../../state/actions/monitor'; +import { MostRecentError } from './most_recent_error'; +import { getMonitorDetails } from '../../../../state/selectors'; +import { fetchMonitorDetailsAction } from '../../../../state/effects/monitor'; + +const ContainerDiv = styled.div` + padding: 10px; + width: 100%; +`; + +interface MonitorListDrawerProps { + summary: MonitorSummary; + loadMonitorDetails: typeof fetchMonitorDetailsAction; +} + +/** + * The elements shown when the user expands the monitor list rows. + */ + +const WrapperComponent = props => { + return ; +}; +export function MonitorListDrawerComponent({ summary, loadMonitorDetails }) { + const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); + + return ( + + + + + {monitorUrl} + + + + + Actions + + + + + ); +} + +const mapStateToProps = (state: AppState, { summary }: any) => ({}); + +const mapDispatchToProps = (dispatch: any) => ({ + loadMonitorDetails: (data: MonitorDetailsRequest) => dispatch(fetchMonitorDetailsAction(data)), +}); + +export const MonitorListDrawer = connect( + mapStateToProps, + mapDispatchToProps +)(WrapperComponent); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx new file mode 100644 index 00000000000000..6e2a2260c39055 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx @@ -0,0 +1,29 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ +import React from 'react'; +import { EuiText, EuiLink } from '@elastic/eui'; + +interface RecentError { + message: string; + type: string; +} + +interface MostRecentErrorProps { + error: RecentError; +} + +export const MostRecentError = ({ error }: MostRecentErrorProps) => { + return ( + <> + +

Most recent error

+ + + {error.message} + + + ); +}; diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts index 41308688f08d4c..40738740e5841b 100644 --- a/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/actions/monitor.ts @@ -9,17 +9,13 @@ export const FETCH_MONITOR_DETAILS_SUCCESS = 'FETCH_MONITOR_DETAILS_SUCCESS'; export const FETCH_MONITOR_DETAILS_FAIL = 'FETCH_MONITOR_DETAILS_FAIL'; export interface MonitorDetailsState { - error: Error; -} - -export interface MonitorDetailsRequest { monitorId: string; - checkGroup: string; + error: Error; } interface GetMonitorDetailsAction { type: typeof FETCH_MONITOR_DETAILS; - payload: MonitorDetailsRequest; + payload: string; } interface GetMonitorDetailsSuccessAction { @@ -32,15 +28,29 @@ interface GetMonitorDetailsFailAction { payload: any; } -export function fetchMonitorDetails( - monitorDetailsState: MonitorDetailsRequest -): GetMonitorDetailsAction { +export function fetchMonitorDetails(monitorId: string): GetMonitorDetailsAction { return { type: FETCH_MONITOR_DETAILS, + payload: monitorId, + }; +} + +export function fetchMonitorDetailsSuccess( + monitorDetailsState: MonitorDetailsState +): GetMonitorDetailsSuccessAction { + return { + type: FETCH_MONITOR_DETAILS_SUCCESS, payload: monitorDetailsState, }; } +export function fetchMonitorDetailsFail(error: any): GetMonitorDetailsFailAction { + return { + type: FETCH_MONITOR_DETAILS_FAIL, + payload: error, + }; +} + export type MonitorActionTypes = | GetMonitorDetailsAction | GetMonitorDetailsSuccessAction diff --git a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts index fae4ae1964d343..ecfacfc881ba3b 100644 --- a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts @@ -5,20 +5,14 @@ */ import { useContext } from 'react'; -import { MonitorDetailsRequest, MonitorDetailsState } from '../actions/monitor'; +import { MonitorDetailsState } from '../actions/monitor'; import { getApiPath } from '../../lib/helper'; import { UptimeSettingsContext } from '../../contexts'; -export const fetchMonitorDetails = async ( - data: MonitorDetailsRequest -): Promise => { +export const fetchMonitorDetails = async (monitorId: string): Promise => { const { basePath } = useContext(UptimeSettingsContext); - const { monitorId, checkGroup } = data; - const url = getApiPath( - `/api/uptime/monitor/details?monitorId=${monitorId}&checkGroup=${checkGroup}`, - basePath - ); + const url = getApiPath(`/api/uptime/monitor/details?monitorId=${monitorId}`, basePath); const response = await fetch(url); if (!response.ok) { throw new Error(response.statusText); diff --git a/x-pack/legacy/plugins/uptime/public/state/sagas/index.ts b/x-pack/legacy/plugins/uptime/public/state/effects/index.ts similarity index 100% rename from x-pack/legacy/plugins/uptime/public/state/sagas/index.ts rename to x-pack/legacy/plugins/uptime/public/state/effects/index.ts diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts new file mode 100644 index 00000000000000..d5be21ad774dca --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts @@ -0,0 +1,31 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { call, put, takeLatest } from 'redux-saga/effects'; +import { Action } from 'redux-actions'; +import { + MonitorActionTypes, + FETCH_MONITOR_DETAILS, + FETCH_MONITOR_DETAILS_SUCCESS, + FETCH_MONITOR_DETAILS_FAIL, +} from '../actions/monitor'; +import { fetchMonitorDetails } from '../api/monitor'; + +function* monitorDetailsSaga(action: Action) { + const monitorId: any = action.payload; + // console.log(monitorId); + // try { + // const response = yield call(fetchMonitorDetails, monitorId); + yield put({ type: FETCH_MONITOR_DETAILS_SUCCESS, payload: { monitorId, error: {} } }); + // } catch (error) { + // console.log(error) + // yield put({ type: FETCH_MONITOR_DETAILS_FAIL, error }); + // } +} + +export function* fetchMonitorDetailsSaga() { + yield takeLatest(FETCH_MONITOR_DETAILS, monitorDetailsSaga); +} diff --git a/x-pack/legacy/plugins/uptime/public/state/index.ts b/x-pack/legacy/plugins/uptime/public/state/index.ts index 2e9e80e731d097..d33339e80b620e 100644 --- a/x-pack/legacy/plugins/uptime/public/state/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/index.ts @@ -7,7 +7,7 @@ import { compose, createStore, applyMiddleware } from 'redux'; import createSagaMiddleware from 'redux-saga'; import { rootReducer } from './reducers'; -import { rootSaga } from './sagas'; +import { rootSaga } from './effects'; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/index.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/index.ts index faa932a321cd17..186b02395b779b 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/index.ts @@ -5,9 +5,10 @@ */ import { combineReducers } from 'redux'; - import { uiReducer } from './ui'; +import { monitorReducer } from './monitor'; export const rootReducer = combineReducers({ ui: uiReducer, + monitor: monitorReducer, }); diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts index bc71623f33e74e..110243038cbb0f 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -13,14 +13,14 @@ import { } from '../actions/monitor'; export interface MonitorState { - monitorDetails: MonitorDetailsState[] | []; + monitorDetailsList: Map; } const initialState: MonitorState = { - monitorDetails: [], + monitorDetailsList: new Map(), }; -export function uiReducer(state = initialState, action: MonitorActionTypes): MonitorState { +export function monitorReducer(state = initialState, action: MonitorActionTypes): MonitorState { switch (action.type) { case FETCH_MONITOR_DETAILS: return { @@ -28,9 +28,11 @@ export function uiReducer(state = initialState, action: MonitorActionTypes): Mon }; case FETCH_MONITOR_DETAILS_SUCCESS: const monitorDetails = action.payload; + const currMonitorDetailsList = new Map(state.monitorDetailsList); + currMonitorDetailsList.set(monitorDetails.monitorId, monitorDetails); return { ...state, - monitorDetails: [...state.monitorDetails, monitorDetails], + monitorDetailsList: currMonitorDetailsList, }; case FETCH_MONITOR_DETAILS_FAIL: return { diff --git a/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts deleted file mode 100644 index 3dfaa6465f3e18..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/state/sagas/monitor.ts +++ /dev/null @@ -1,26 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import { call, put, takeEvery } from 'redux-saga/effects'; -import { Action } from 'redux-actions'; - -import { MonitorActionTypes, FETCH_MONITOR_DETAILS } from '../actions/monitor'; -import { fetchMonitorDetails } from '../api/monitor'; - -function* monitorDetailsSaga(action: Action) { - const data: any = action.payload; - - try { - const response = yield call(fetchMonitorDetails, data); - yield put({ type: 'REQUEST_SUCCEEDED', payload: response }); - } catch (error) { - yield put({ type: 'REQUEST_FAILED', error }); - } -} - -export function* fetchMonitorDetailsSaga() { - yield takeEvery(FETCH_MONITOR_DETAILS, monitorDetailsSaga); -} diff --git a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts index eb263a9b696a9a..e453be9b12e828 100644 --- a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts @@ -7,4 +7,6 @@ import { AppState } from '../../state'; export const isIntegrationsPopupOpen = (state: AppState) => state.ui.integrationsPopoverOpen; -export const getMonitorDetails = (state: AppState) => state.ui.integrationsPopoverOpen; +export const getMonitorDetails = (state: AppState, summary: any) => { + return state.monitor.monitorDetailsList.get(summary.monitor_id); +}; diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts index 90c6d72807b287..ffc3e5d6ea1d4c 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts @@ -440,20 +440,29 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { size: 1, query: { bool: { - filter: [ + must: [ { - term: { - 'monitor.id': monitorId, + exists: { + field: 'error', }, }, + ], + filter: [ { term: { - 'monitor.check_group': checkGroup, + 'monitor.id': monitorId, }, }, ], }, }, + sort: [ + { + '@timestamp': { + order: 'desc', + }, + }, + ], }, }; @@ -462,7 +471,8 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { const monitorError: Error | null = get(result, 'hits.hits[0]._source.error', null); return { - monitorError, + monitorId, + error: monitorError, }; } } diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts index 0f86064dd1ec34..b723d3f08f659e 100644 --- a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts +++ b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts @@ -5,7 +5,6 @@ */ import Joi from 'joi'; -import { PingResults } from '../../../common/graphql/types'; import { UMServerLibs } from '../../lib/lib'; export const createGetMonitorDetailsRoute = (libs: UMServerLibs) => ({ diff --git a/x-pack/package.json b/x-pack/package.json index 90383d901a18fc..fc307734a7a056 100644 --- a/x-pack/package.json +++ b/x-pack/package.json @@ -335,7 +335,7 @@ "redux": "4.0.0", "redux-actions": "2.2.1", "redux-observable": "^1.0.0", - "redux-saga": "^0.16.0", + "redux-saga": "^1.1.1", "redux-thunk": "2.3.0", "redux-thunks": "^1.0.0", "request": "^2.88.0", diff --git a/yarn.lock b/yarn.lock index 969fbe719a2b51..a8135ea38071dd 100644 --- a/yarn.lock +++ b/yarn.lock @@ -960,6 +960,13 @@ dependencies: regenerator-runtime "^0.13.2" +"@babel/runtime@^7.6.0": + version "7.6.2" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.6.2.tgz#c3d6e41b304ef10dcf13777a33e7694ec4a9a6dd" + integrity sha512-EXxN64agfUqqIGeEjI5dL5z0Sw0ZwWo1mLTi4mQowCZ42O59b7DRpZAnTC6OqdF28wMBMFKNb/4uFGrVaigSpg== + dependencies: + regenerator-runtime "^0.13.2" + "@babel/template@^7.0.0", "@babel/template@^7.1.0", "@babel/template@^7.4.0", "@babel/template@^7.4.4": version "7.4.4" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.4.4.tgz#f4b88d1225689a08f5bc3a17483545be9e4ed237" @@ -2391,6 +2398,50 @@ react-lifecycles-compat "^3.0.4" warning "^3.0.0" +"@redux-saga/core@^1.1.1": + version "1.1.1" + resolved "https://registry.yarnpkg.com/@redux-saga/core/-/core-1.1.1.tgz#72432130630cca08260086ffc564c2aa5488a0a2" + integrity sha512-WKXfj2cYkP0eh74dE1ueMjVDoGJIkppXiMFgx0buVRkXENeZmRxIjM4lh9LEWWFqay7I/Qkw7+cMossa7xXoAQ== + dependencies: + "@babel/runtime" "^7.6.0" + "@redux-saga/deferred" "^1.1.0" + "@redux-saga/delay-p" "^1.1.0" + "@redux-saga/is" "^1.1.0" + "@redux-saga/symbols" "^1.1.0" + "@redux-saga/types" "^1.1.0" + redux "^4.0.4" + typescript-tuple "^2.2.1" + +"@redux-saga/deferred@^1.1.0": + version "1.1.0" + resolved "https://registry.yarnpkg.com/@redux-saga/deferred/-/deferred-1.1.0.tgz#aff018f64a936c288c18bd64ddf9ccfa143db6b4" + integrity sha512-wOCJCby3hx14bvrEeFLJ1JJTjJdXDJyC+B3JQ6eiqgzNghylbf969lIYmS2Arf2QuALfUtRBNPXBIMDKG9km4g== + +"@redux-saga/delay-p@^1.1.0": + version "1.1.0" + resolved "https://registry.yarnpkg.com/@redux-saga/delay-p/-/delay-p-1.1.0.tgz#4024f979d0f78763d2e90233be8c922781ae4400" + integrity sha512-BcRwXs20kKjgiYEwZARkpVoRIe/hHftW3iwPhdeW4/jPyR9gLv/vG8VsJMF5NDEch+/w/mJtdgSubq+wtOS47g== + dependencies: + "@redux-saga/symbols" "^1.1.0" + +"@redux-saga/is@^1.1.0": + version "1.1.0" + resolved "https://registry.yarnpkg.com/@redux-saga/is/-/is-1.1.0.tgz#d74358364ebde160bf1b8bd94903ff7684b12d41" + integrity sha512-0uFXWGSvDCfNBdROHwEVixNhFbI3S+UGBQfcPXQiYL+CjIjyR3DTg2Z+NFH9xzP+H4Oh/yGtTHDhC0GxYp7HQQ== + dependencies: + "@redux-saga/symbols" "^1.1.0" + "@redux-saga/types" "^1.1.0" + +"@redux-saga/symbols@^1.1.0": + version "1.1.0" + resolved "https://registry.yarnpkg.com/@redux-saga/symbols/-/symbols-1.1.0.tgz#676b277cb5deb48ce723b2b394cbae97f82e8319" + integrity sha512-Fzw1wV3j4hbac3MYmgNE18Z53URmQZeilTHZLF7Lm4SQ1jG4fcU47v2kElsEbQXUSaFqj+uJqdRzmDGNb6pRwQ== + +"@redux-saga/types@^1.1.0": + version "1.1.0" + resolved "https://registry.yarnpkg.com/@redux-saga/types/-/types-1.1.0.tgz#0e81ce56b4883b4b2a3001ebe1ab298b84237204" + integrity sha512-afmTuJrylUU/0OtqzaRkbyYFFNgCF73Bvel/sw90pvGrWIZ+vyoIJqA6eMSoA6+nb443kTmulmBtC9NerXboNg== + "@samverschueren/stream-to-observable@^0.3.0": version "0.3.0" resolved "https://registry.yarnpkg.com/@samverschueren/stream-to-observable/-/stream-to-observable-0.3.0.tgz#ecdf48d532c58ea477acfcab80348424f8d0662f" @@ -23809,10 +23860,12 @@ redux-observable@^1.0.0: resolved "https://registry.yarnpkg.com/redux-observable/-/redux-observable-1.0.0.tgz#780ff2455493eedcef806616fe286b454fd15d91" integrity sha512-6bXnpqWTBeLaLQjXHyN1giXq4nLxCmv+SUkdmiwBgvmVxvDbdmydvL1Z7DGo0WItyzI/kqXQKiucUuTxnrPRkA== -redux-saga@^0.16.0: - version "0.16.2" - resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-0.16.2.tgz#993662e86bc945d8509ac2b8daba3a8c615cc971" - integrity sha512-iIjKnRThI5sKPEASpUvySemjzwqwI13e3qP7oLub+FycCRDysLSAOwt958niZW6LhxfmS6Qm1BzbU70w/Koc4w== +redux-saga@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-1.1.1.tgz#7e02879beb02c92030b5fbe746fd70e8bda97dfb" + integrity sha512-guSnGJ/uEF8yL8Mn4aNa7HxRGCpVUALCkec9iTTD0fOhQqkF6bRQkBLeS+7/cAH3nFnr299bi/DOurTi1apcCA== + dependencies: + "@redux-saga/core" "^1.1.1" redux-test-utils@0.2.2: version "0.2.2" @@ -23860,6 +23913,14 @@ redux@^4.0.1: loose-envify "^1.4.0" symbol-observable "^1.2.0" +redux@^4.0.4: + version "4.0.4" + resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" + integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q== + dependencies: + loose-envify "^1.4.0" + symbol-observable "^1.2.0" + reflect.ownkeys@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460" @@ -28045,6 +28106,13 @@ typedarray@^0.0.6, typedarray@~0.0.5: resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= +typescript-compare@^0.0.2: + version "0.0.2" + resolved "https://registry.yarnpkg.com/typescript-compare/-/typescript-compare-0.0.2.tgz#7ee40a400a406c2ea0a7e551efd3309021d5f425" + integrity sha512-8ja4j7pMHkfLJQO2/8tut7ub+J3Lw2S3061eJLFQcvs3tsmJKp8KG5NtpLn7KcY2w08edF74BSVN7qJS0U6oHA== + dependencies: + typescript-logic "^0.0.0" + typescript-fsa-reducers@^0.4.5: version "0.4.5" resolved "https://registry.yarnpkg.com/typescript-fsa-reducers/-/typescript-fsa-reducers-0.4.5.tgz#58fffb2f6eeca6817c2f656b7e7df2cb1c9d1f84" @@ -28057,6 +28125,18 @@ typescript-fsa@^2.0.0, typescript-fsa@^2.5.0: resolved "https://registry.yarnpkg.com/typescript-fsa/-/typescript-fsa-2.5.0.tgz#1baec01b5e8f5f34c322679d1327016e9e294faf" integrity sha1-G67AG16PXzTDImedEycBbp4pT68= +typescript-logic@^0.0.0: + version "0.0.0" + resolved "https://registry.yarnpkg.com/typescript-logic/-/typescript-logic-0.0.0.tgz#66ebd82a2548f2b444a43667bec120b496890196" + integrity sha512-zXFars5LUkI3zP492ls0VskH3TtdeHCqu0i7/duGt60i5IGPIpAHE/DWo5FqJ6EjQ15YKXrt+AETjv60Dat34Q== + +typescript-tuple@^2.2.1: + version "2.2.1" + resolved "https://registry.yarnpkg.com/typescript-tuple/-/typescript-tuple-2.2.1.tgz#7d9813fb4b355f69ac55032e0363e8bb0f04dad2" + integrity sha512-Zcr0lbt8z5ZdEzERHAMAniTiIKerFCMgd7yjq1fPnDJ43et/k9twIFQMUYff9k5oXcsQ0WpvFcgzK2ZKASoW6Q== + dependencies: + typescript-compare "^0.0.2" + typescript@3.5.1, typescript@3.5.3, typescript@^3.0.1, typescript@^3.0.3, typescript@^3.2.2, typescript@^3.3.3333, typescript@^3.4.5, typescript@~3.3.3333, typescript@~3.5.3: version "3.5.3" resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.5.3.tgz#c830f657f93f1ea846819e929092f5fe5983e977" From bcb96a691a789942b208e3abf8f0afa202df1497 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 8 Oct 2019 03:48:21 +0500 Subject: [PATCH 12/35] update drawer --- .../monitor_list_actions_popover.tsx | 14 +---- .../monitor_list_drawer.tsx | 63 ++++++++++++++++--- .../plugins/uptime/public/state/actions/ui.ts | 15 ++++- .../uptime/public/state/api/monitor.ts | 12 ++-- .../uptime/public/state/effects/monitor.ts | 20 +++--- .../uptime/public/state/reducers/monitor.ts | 16 +++-- .../uptime/public/state/reducers/ui.ts | 15 ++++- .../uptime/public/state/selectors/index.ts | 4 +- .../plugins/uptime/public/uptime_app.tsx | 3 + 9 files changed, 117 insertions(+), 45 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx index 7d42f0f05b2ba0..e726210612b943 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx @@ -5,7 +5,7 @@ */ import { EuiButtonIcon, EuiPopover } from '@elastic/eui'; -import React, { useContext, useEffect } from 'react'; +import React, { useContext } from 'react'; import { i18n } from '@kbn/i18n'; import { get } from 'lodash'; import { connect } from 'react-redux'; @@ -15,7 +15,6 @@ import { UptimeSettingsContext } from '../../../contexts'; import { isIntegrationsPopupOpen } from '../../../state/selectors'; import { AppState } from '../../../state'; import { toggleIntegrationsPopover, PopoverState } from '../../../state/actions'; -import { fetchMonitorDetails, FETCH_MONITOR_DETAILS } from '../../../state/actions/monitor'; interface MonitorListActionsPopoverProps { summary: MonitorSummary; @@ -40,11 +39,6 @@ const MonitorListActionsPopoverComponent = ({ isLogsAvailable, } = useContext(UptimeSettingsContext); - useEffect(() => { - togglePopoverIsVisible({ id: '', open: false }); - loadMonitorDetails('bad-ssl'); - }, []); - const monitorUrl: string | undefined = get(summary, 'state.url.full', undefined); const isPopoverOpen: boolean = !!popoverState && popoverState.open && popoverState.id === popoverId; @@ -91,12 +85,6 @@ const mapDispatchToProps = (dispatch: any) => ({ togglePopoverIsVisible: (popoverState: PopoverState) => { return dispatch(toggleIntegrationsPopover(popoverState)); }, - loadMonitorDetails: (monitorId: string) => { - return dispatch({ - type: FETCH_MONITOR_DETAILS, - payload: monitorId, - }); - }, }); export const MonitorListActionsPopover = connect( diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 62610dbb4eb035..0f8e6170253797 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -20,10 +20,9 @@ import { connect } from 'react-redux'; import { MonitorSummary, CheckMonitor } from '../../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../../contexts'; import { AppState } from '../../../../state'; -import { MonitorDetailsRequest } from '../../../../state/actions/monitor'; +import { fetchMonitorDetails } from '../../../../state/actions/monitor'; import { MostRecentError } from './most_recent_error'; import { getMonitorDetails } from '../../../../state/selectors'; -import { fetchMonitorDetailsAction } from '../../../../state/effects/monitor'; const ContainerDiv = styled.div` padding: 10px; @@ -32,18 +31,57 @@ const ContainerDiv = styled.div` interface MonitorListDrawerProps { summary: MonitorSummary; - loadMonitorDetails: typeof fetchMonitorDetailsAction; + monitorDetails: any; + loadMonitorDetails: typeof fetchMonitorDetails; } /** * The elements shown when the user expands the monitor list rows. */ -const WrapperComponent = props => { - return ; -}; -export function MonitorListDrawerComponent({ summary, loadMonitorDetails }) { +export function MonitorListDrawerComponent({ + summary, + loadMonitorDetails, + monitorDetails, +}: MonitorListDrawerProps) { + if (!summary || !summary.state.checks) { + return null; + } + useEffect(() => { + loadMonitorDetails(summary.monitor_id); + }, []); + const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); + if (!summary || !summary.state.checks) { + return null; + } + + const upLocations: CheckMonitor[] = []; + const downLocations: CheckMonitor[] = []; + + summary.state.checks.forEach(check => { + if (check.monitor.status === 'up') { + upLocations.push(check.monitor); + } + if (check.monitor.status === 'down') { + downLocations.push(check.monitor); + } + }); + + const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { + return ( + <> + + {titleTxt} in{' '} + {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} + + + + ); + }; return ( @@ -59,17 +97,22 @@ export function MonitorListDrawerComponent({ summary, loadMonitorDetails }) { + {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} + {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} + {monitorDetails && } ); } -const mapStateToProps = (state: AppState, { summary }: any) => ({}); +const mapStateToProps = (state: AppState, { summary }: any) => ({ + monitorDetails: getMonitorDetails(state, summary), +}); const mapDispatchToProps = (dispatch: any) => ({ - loadMonitorDetails: (data: MonitorDetailsRequest) => dispatch(fetchMonitorDetailsAction(data)), + loadMonitorDetails: (monitorId: string) => dispatch(fetchMonitorDetails(monitorId)), }); export const MonitorListDrawer = connect( mapStateToProps, mapDispatchToProps -)(WrapperComponent); +)(MonitorListDrawerComponent); diff --git a/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts b/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts index 7c18774e1d67de..f0234f903d3d8d 100644 --- a/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts +++ b/x-pack/legacy/plugins/uptime/public/state/actions/ui.ts @@ -5,6 +5,7 @@ */ export const SET_INTEGRATION_POPOVER_STATE = 'SET_INTEGRATION_POPOVER_STATE'; +export const SET_BASE_PATH = 'SET_BASE_PATH'; export interface PopoverState { id: string; @@ -16,6 +17,11 @@ interface SetIntegrationPopoverAction { payload: PopoverState; } +interface SetBasePathAction { + type: typeof SET_BASE_PATH; + payload: string; +} + export function toggleIntegrationsPopover(popoverState: PopoverState): SetIntegrationPopoverAction { return { type: SET_INTEGRATION_POPOVER_STATE, @@ -23,4 +29,11 @@ export function toggleIntegrationsPopover(popoverState: PopoverState): SetIntegr }; } -export type UiActionTypes = SetIntegrationPopoverAction; +export function setBasePath(basePath: string): SetBasePathAction { + return { + type: SET_BASE_PATH, + payload: basePath, + }; +} + +export type UiActionTypes = SetIntegrationPopoverAction | SetBasePathAction; diff --git a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts index ecfacfc881ba3b..d504a4af6b0685 100644 --- a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts @@ -4,14 +4,18 @@ * you may not use this file except in compliance with the Elastic License. */ -import { useContext } from 'react'; import { MonitorDetailsState } from '../actions/monitor'; import { getApiPath } from '../../lib/helper'; -import { UptimeSettingsContext } from '../../contexts'; -export const fetchMonitorDetails = async (monitorId: string): Promise => { - const { basePath } = useContext(UptimeSettingsContext); +interface ApiRequest { + monitorId: string; + basePath: string; +} +export const fetchMonitorDetails = async ({ + monitorId, + basePath, +}: ApiRequest): Promise => { const url = getApiPath(`/api/uptime/monitor/details?monitorId=${monitorId}`, basePath); const response = await fetch(url); if (!response.ok) { diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts index d5be21ad774dca..3ea2ea546e4118 100644 --- a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import { call, put, takeLatest } from 'redux-saga/effects'; +import { call, put, takeLatest, select } from 'redux-saga/effects'; import { Action } from 'redux-actions'; import { MonitorActionTypes, @@ -13,17 +13,17 @@ import { FETCH_MONITOR_DETAILS_FAIL, } from '../actions/monitor'; import { fetchMonitorDetails } from '../api/monitor'; +import { getBasePath } from '../selectors'; function* monitorDetailsSaga(action: Action) { - const monitorId: any = action.payload; - // console.log(monitorId); - // try { - // const response = yield call(fetchMonitorDetails, monitorId); - yield put({ type: FETCH_MONITOR_DETAILS_SUCCESS, payload: { monitorId, error: {} } }); - // } catch (error) { - // console.log(error) - // yield put({ type: FETCH_MONITOR_DETAILS_FAIL, error }); - // } + const monitorId = action.payload; + try { + const basePath = yield select(getBasePath); + const response = yield call(fetchMonitorDetails, { monitorId, basePath }); + yield put({ type: FETCH_MONITOR_DETAILS_SUCCESS, payload: response }); + } catch (error) { + yield put({ type: FETCH_MONITOR_DETAILS_FAIL, error }); + } } export function* fetchMonitorDetailsSaga() { diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts index 110243038cbb0f..e0a724619bb234 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -13,11 +13,13 @@ import { } from '../actions/monitor'; export interface MonitorState { - monitorDetailsList: Map; + monitorDetailsList: MonitorDetailsState[]; + loading: boolean; } const initialState: MonitorState = { - monitorDetailsList: new Map(), + monitorDetailsList: [], + loading: false, }; export function monitorReducer(state = initialState, action: MonitorActionTypes): MonitorState { @@ -25,14 +27,18 @@ export function monitorReducer(state = initialState, action: MonitorActionTypes) case FETCH_MONITOR_DETAILS: return { ...state, + loading: true, }; case FETCH_MONITOR_DETAILS_SUCCESS: const monitorDetails = action.payload; - const currMonitorDetailsList = new Map(state.monitorDetailsList); - currMonitorDetailsList.set(monitorDetails.monitorId, monitorDetails); + const { monitorId } = monitorDetails; return { ...state, - monitorDetailsList: currMonitorDetailsList, + monitorDetailsList: { + ...state.monitorDetailsList, + [monitorId]: monitorDetails, + }, + loading: false, }; case FETCH_MONITOR_DETAILS_FAIL: return { diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts index 1550b6c9936c30..d095d6ba961ca7 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/ui.ts @@ -4,14 +4,21 @@ * you may not use this file except in compliance with the Elastic License. */ -import { UiActionTypes, PopoverState, SET_INTEGRATION_POPOVER_STATE } from '../actions/ui'; +import { + UiActionTypes, + PopoverState, + SET_INTEGRATION_POPOVER_STATE, + SET_BASE_PATH, +} from '../actions/ui'; export interface UiState { integrationsPopoverOpen: PopoverState | null; + basePath: string; } const initialState: UiState = { integrationsPopoverOpen: null, + basePath: '', }; export function uiReducer(state = initialState, action: UiActionTypes): UiState { @@ -25,6 +32,12 @@ export function uiReducer(state = initialState, action: UiActionTypes): UiState open: popoverState.open, }, }; + case SET_BASE_PATH: + const basePath = action.payload; + return { + ...state, + basePath, + }; default: return state; } diff --git a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts index e453be9b12e828..59c3f0c31539fd 100644 --- a/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/selectors/index.ts @@ -7,6 +7,8 @@ import { AppState } from '../../state'; export const isIntegrationsPopupOpen = (state: AppState) => state.ui.integrationsPopoverOpen; +export const getBasePath = (state: AppState) => state.ui.basePath; + export const getMonitorDetails = (state: AppState, summary: any) => { - return state.monitor.monitorDetailsList.get(summary.monitor_id); + return state.monitor.monitorDetailsList[summary.monitor_id]; }; diff --git a/x-pack/legacy/plugins/uptime/public/uptime_app.tsx b/x-pack/legacy/plugins/uptime/public/uptime_app.tsx index 4255fdf99aa5cc..105e09d8ca6c7f 100644 --- a/x-pack/legacy/plugins/uptime/public/uptime_app.tsx +++ b/x-pack/legacy/plugins/uptime/public/uptime_app.tsx @@ -22,6 +22,7 @@ import { UptimeDatePicker } from './components/functional/uptime_date_picker'; import { useUrlParams } from './hooks'; import { getTitle } from './lib/helper/get_title'; import { store } from './state'; +import { setBasePath } from './state/actions'; export interface UptimeAppColors { danger: string; @@ -136,6 +137,8 @@ const Application = (props: UptimeAppProps) => { }; }; + store.dispatch(setBasePath(basePath)); + return ( From 1670728be646a3dadc505b746165929aea81b9b9 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 8 Oct 2019 04:43:49 +0500 Subject: [PATCH 13/35] updated drawer components --- .../monitor_list_drawer.tsx | 58 ++++++------------- .../monitor_status_list.tsx | 52 +++++++++++++++++ .../monitor_list/to_condensed_check.ts | 47 --------------- 3 files changed, 69 insertions(+), 88 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/to_condensed_check.ts diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 0f8e6170253797..4d88015a66125d 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -4,25 +4,17 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { useContext, useEffect } from 'react'; -import { - EuiHealth, - EuiLink, - EuiSpacer, - EuiFlexGroup, - EuiFlexItem, - EuiButton, - EuiIcon, -} from '@elastic/eui'; +import React, { useEffect } from 'react'; +import { EuiLink, EuiSpacer, EuiFlexGroup, EuiFlexItem, EuiButton, EuiIcon } from '@elastic/eui'; import { get } from 'lodash'; import styled from 'styled-components'; import { connect } from 'react-redux'; -import { MonitorSummary, CheckMonitor } from '../../../../../common/graphql/types'; -import { UptimeSettingsContext } from '../../../../contexts'; +import { MonitorSummary } from '../../../../../common/graphql/types'; import { AppState } from '../../../../state'; import { fetchMonitorDetails } from '../../../../state/actions/monitor'; import { MostRecentError } from './most_recent_error'; import { getMonitorDetails } from '../../../../state/selectors'; +import { MonitorStatusList } from './monitor_status_list'; const ContainerDiv = styled.div` padding: 10px; @@ -30,8 +22,19 @@ const ContainerDiv = styled.div` `; interface MonitorListDrawerProps { + /** + * Monitor Summary + */ summary: MonitorSummary; + + /** + * Monitor details to be fetched from rest api using monitorId + */ monitorDetails: any; + + /** + * Redux action to trigger , loading monitor details + */ loadMonitorDetails: typeof fetchMonitorDetails; } @@ -52,37 +55,11 @@ export function MonitorListDrawerComponent({ }, []); const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); - const { - colors: { success, danger }, - } = useContext(UptimeSettingsContext); + if (!summary || !summary.state.checks) { return null; } - const upLocations: CheckMonitor[] = []; - const downLocations: CheckMonitor[] = []; - - summary.state.checks.forEach(check => { - if (check.monitor.status === 'up') { - upLocations.push(check.monitor); - } - if (check.monitor.status === 'down') { - downLocations.push(check.monitor); - } - }); - - const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { - return ( - <> - - {titleTxt} in{' '} - {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} - - - - ); - }; - return ( @@ -97,8 +74,7 @@ export function MonitorListDrawerComponent({ - {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} - {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} + {monitorDetails && } ); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx new file mode 100644 index 00000000000000..dc482b563ace9a --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -0,0 +1,52 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React, { useContext } from 'react'; +import { EuiHealth, EuiSpacer } from '@elastic/eui'; +import { CheckMonitor, Check } from '../../../../../common/graphql/types'; +import { UptimeSettingsContext } from '../../../../contexts'; + +interface MonitorStatusListProps { + /** + * Recent List of checks performed on monitor + */ + checks: Check[]; +} + +export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); + + const upLocations: CheckMonitor[] = []; + const downLocations: CheckMonitor[] = []; + + checks.forEach((check: Check) => { + if (check.monitor.status === 'up') { + upLocations.push(check.monitor); + } + if (check.monitor.status === 'down') { + downLocations.push(check.monitor); + } + }); + const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { + return ( + <> + + {titleTxt} in{' '} + {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} + + + + ); + }; + return ( + <> + {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} + {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} + + ); +}; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/to_condensed_check.ts b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/to_condensed_check.ts deleted file mode 100644 index 18bfe19f2fd5f6..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/to_condensed_check.ts +++ /dev/null @@ -1,47 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import { get } from 'lodash'; -import { Check } from '../../../../common/graphql/types'; -import { CondensedCheck } from './types'; - -const inferCondensedFields = ( - check: CondensedCheck, - currentStatus: string, - currentTimestamp: string -) => { - const { status: condensedStatus, timestamp } = check; - if (condensedStatus !== currentStatus && condensedStatus !== 'mixed') { - check.status = 'mixed'; - } - if (timestamp < currentTimestamp) { - check.timestamp = currentTimestamp; - } -}; - -export const toCondensedCheck = (checks: Check[]) => { - const condensedChecks: Map = new Map(); - checks.forEach((check: Check) => { - const location = get(check, 'observer.geo.name', null); - const { - monitor: { ip, status }, - timestamp, - } = check; - let condensedCheck: CondensedCheck | undefined; - if ((condensedCheck = condensedChecks.get(location))) { - condensedCheck.childStatuses.push({ ip, status, timestamp }); - inferCondensedFields(condensedCheck, status, timestamp); - } else { - condensedChecks.set(location, { - childStatuses: [{ ip, status, timestamp }], - location, - status, - timestamp, - }); - } - }); - return Array.from(condensedChecks.values()); -}; From ca11b4437632868ad23edb52cfb4d7e84288653f Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 9 Oct 2019 12:43:25 +0500 Subject: [PATCH 14/35] update monitor drawer --- tsconfig.json | 3 +- .../monitor_list_drawer.test.tsx.snap | 50 -- .../monitor_list_actions_popover.tsx | 2 - .../monitor_status_list.test.tsx.snap | 34 + .../monitor_list_drawer/__tests__/data.json | 623 ++++++++++++++++++ .../__tests__/monitor_list_drawer.test.tsx | 6 +- .../__tests__/monitor_status_list.test.tsx | 142 ++++ .../__tests__/most_recent_error.test.tsx} | 0 .../monitor_list_drawer.tsx | 2 +- 9 files changed, 804 insertions(+), 58 deletions(-) delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/data.json create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx rename x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/{__tests__/condensed_check_list.test.tsx => monitor_list_drawer/__tests__/most_recent_error.test.tsx} (100%) diff --git a/tsconfig.json b/tsconfig.json index a2da9c127e7ba6..6baa5f18ac7bcc 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -61,7 +61,8 @@ "test_utils/**/*" ], "exclude": [ - "src/**/__fixtures__/**/*" + "src/**/__fixtures__/**/*", + "e2e" // In the build we actually exclude **/public/**/* from this config so that // we can run the TSC on both this and the .browser version of this config // file, but if we did it during development IDEs would not be able to find diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap deleted file mode 100644 index 3b0f76dfb10883..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ /dev/null @@ -1,50 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`MonitorListDrawer component renders a Checklist when there is only one check 1`] = ` - -`; - -exports[`MonitorListDrawer component renders a CondensedCheckList when there are many checks 1`] = ` - -`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx index e726210612b943..04f195d42531bc 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_actions_popover.tsx @@ -20,14 +20,12 @@ interface MonitorListActionsPopoverProps { summary: MonitorSummary; popoverState: PopoverState | null; togglePopoverIsVisible: typeof toggleIntegrationsPopover; - loadMonitorDetails: any; } const MonitorListActionsPopoverComponent = ({ summary, popoverState, togglePopoverIsVisible, - loadMonitorDetails, }: MonitorListActionsPopoverProps) => { const popoverId = `${summary.monitor_id}_popover`; const { diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap new file mode 100644 index 00000000000000..97b0815f09f180 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap @@ -0,0 +1,34 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`CondensedCheckList component renders checks 1`] = ` + + + Down + in + + elastic + , elastic + , elastic + , elastic + + + + Up + in + + elastic + , elastic + , elastic + , elastic + + + +`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/data.json b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/data.json new file mode 100644 index 00000000000000..64adf3642fb228 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/data.json @@ -0,0 +1,623 @@ +{ + "data": { + "monitorStates": { + "prevPagePagination": null, + "nextPagePagination": null, + "totalSummaryCount": { "count": 147428, "__typename": "DocCount" }, + "summaries": [ + { + "monitor_id": "andrewvc-com", + "histogram": { + "count": 60, + "points": [ + { + "timestamp": 1570538088000, + "up": 8, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 16, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 12, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 16, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 8, + "down": 0, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": [ + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.108.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.109.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.110.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.111.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + } + ], + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": null, + "status": "up", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 4, "down": 0, "geo": null, "__typename": "Summary" }, + "url": { + "full": "http://blog.andrewvc.com", + "domain": "blog.andrewvc.com", + "__typename": "StateUrl" + }, + "timestamp": 1570538246145, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + }, + { + "monitor_id": "bad-ssl", + "histogram": { + "count": 16, + "points": [ + { + "timestamp": 1570538088000, + "up": 0, + "down": 3, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 0, + "down": 4, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 0, + "down": 3, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 0, + "down": 4, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 0, + "down": 2, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": [ + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "104.154.89.105", + "name": "", + "status": "down", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246144", + "__typename": "Check" + } + ], + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": null, + "status": "down", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 0, "down": 1, "geo": null, "__typename": "Summary" }, + "url": { + "full": "https://expired.badssl.com", + "domain": "expired.badssl.com", + "__typename": "StateUrl" + }, + "timestamp": 1570538246144, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + }, + { + "monitor_id": "elastic-co", + "histogram": { + "count": 72, + "points": [ + { + "timestamp": 1570538088000, + "up": 4, + "down": 4, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 8, + "down": 8, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 8, + "down": 8, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 12, + "down": 12, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 4, + "down": 4, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": , + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": "elastic", + "status": "mixed", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 4, "down": 4, "geo": null, "__typename": "Summary" }, + "url": { + "full": "https://www.elastic.co", + "domain": "www.elastic.co", + "__typename": "StateUrl" + }, + "timestamp": 1570538236414, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + }, + { + "monitor_id": "kibana-local", + "histogram": { + "count": 66, + "points": [ + { + "timestamp": 1570538052000, + "up": 1, + "down": 1, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538088000, + "up": 7, + "down": 7, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 7, + "down": 7, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 7, + "down": 7, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 8, + "down": 8, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 3, + "down": 3, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": [ + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "127.0.0.1", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246144", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "::1", + "name": "", + "status": "down", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + } + ], + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": null, + "status": "mixed", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 1, "down": 1, "geo": null, "__typename": "Summary" }, + "url": { + "full": "http://localhost:5601/", + "domain": "localhost", + "__typename": "StateUrl" + }, + "timestamp": 1570538246145, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + }, + { + "monitor_id": "localhost", + "histogram": { + "count": 28, + "points": [ + { + "timestamp": 1570538052000, + "up": 12, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538088000, + "up": 3, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 4, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 3, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 4, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 2, + "down": 0, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": [ + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "127.0.0.1", + "name": "localhost", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246143", + "__typename": "Check" + } + ], + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": "localhost", + "status": "up", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 1, "down": 0, "geo": null, "__typename": "Summary" }, + "url": { + "full": "http://localhost:9200", + "domain": "localhost", + "__typename": "StateUrl" + }, + "timestamp": 1570538246143, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + }, + { + "monitor_id": "secure-avc", + "histogram": { + "count": 64, + "points": [ + { + "timestamp": 1570538088000, + "up": 12, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538124000, + "up": 16, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538160000, + "up": 12, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538196000, + "up": 16, + "down": 0, + "__typename": "SummaryHistogramPoint" + }, + { + "timestamp": 1570538232000, + "up": 8, + "down": 0, + "__typename": "SummaryHistogramPoint" + } + ], + "__typename": "SummaryHistogram" + }, + "state": { + "agent": null, + "checks": [ + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.108.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.109.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.110.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + }, + { + "agent": { "id": "8f9a37fb-573a-4fdc-9895-440a5b39c250", "__typename": "Agent" }, + "container": null, + "kubernetes": null, + "monitor": { + "ip": "185.199.111.153", + "name": "", + "status": "up", + "__typename": "CheckMonitor" + }, + "observer": { + "geo": { "name": null, "location": null, "__typename": "CheckGeo" }, + "__typename": "CheckObserver" + }, + "timestamp": "1570538246145", + "__typename": "Check" + } + ], + "geo": null, + "observer": { + "geo": { "name": [], "location": null, "__typename": "StateGeo" }, + "__typename": "StateObserver" + }, + "monitor": { + "id": null, + "name": null, + "status": "up", + "type": null, + "__typename": "MonitorState" + }, + "summary": { "up": 4, "down": 0, "geo": null, "__typename": "Summary" }, + "url": { + "full": "https://blog.andrewvc.com", + "domain": "blog.andrewvc.com", + "__typename": "StateUrl" + }, + "timestamp": 1570538246145, + "error": null, + "__typename": "State" + }, + "__typename": "MonitorSummary" + } + ], + "__typename": "MonitorSummaryResult" + } + } +} diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx index 3389d18717eb9a..f45a810b351b33 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx @@ -3,7 +3,7 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ - +import { expect } from 'jest'; import { MonitorSummary, Check } from '../../../../../../common/graphql/types'; import { shallowWithIntl } from 'test_utils/enzyme_helpers'; import React from 'react'; @@ -35,9 +35,7 @@ describe('MonitorListDrawer component', () => { }); it('renders nothing when no summary data is present', () => { - const component = shallowWithIntl( - - ); + const component = shallowWithIntl(); expect(component).toEqual({}); }); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx new file mode 100644 index 00000000000000..c086fe1e088c7c --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx @@ -0,0 +1,142 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { shallowWithIntl } from 'test_utils/enzyme_helpers'; +import React from 'react'; +import moment from 'moment'; +import { MonitorStatusList } from '../monitor_status_list'; +import { Check } from '../../../../../../common/graphql/types'; + +describe('CondensedCheckList component', () => { + let checks: Check[]; + + beforeAll(() => { + moment.prototype.toLocaleString = jest.fn(() => '2019-06-21 15:29:26'); + moment.prototype.from = jest.fn(() => 'a few moments ago'); + }); + + beforeEach(() => { + checks = [ + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + monitor: { + ip: '151.101.130.217', + name: 'elastic', + status: 'up', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + monitor: { + ip: '151.101.194.217', + name: 'elastic', + status: 'up', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + monitor: { + ip: '151.101.2.217', + name: 'elastic', + status: 'up', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + container: null, + kubernetes: null, + monitor: { + ip: '151.101.66.217', + name: 'elastic', + status: 'up', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + container: null, + kubernetes: null, + monitor: { + ip: '2a04:4e42:200::729', + name: 'elastic', + status: 'down', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + container: null, + kubernetes: null, + monitor: { + ip: '2a04:4e42:400::729', + name: 'elastic', + status: 'down', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + container: null, + kubernetes: null, + monitor: { + ip: '2a04:4e42:600::729', + name: 'elastic', + status: 'down', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + { + agent: { id: '8f9a37fb-573a-4fdc-9895-440a5b39c250' }, + container: null, + kubernetes: null, + monitor: { + ip: '2a04:4e42::729', + name: 'elastic', + status: 'down', + }, + observer: { + geo: { name: null, location: null }, + }, + timestamp: '1570538236414', + }, + ]; + }); + + it('renders checks', () => { + const component = shallowWithIntl(); + expect(component).toMatchSnapshot(); + }); + + it('renders null in place of child status with missing ip', () => { + checks[0].childStatuses[0].ip = undefined; + const component = shallowWithIntl(); + expect(component).toMatchSnapshot(); + }); +}); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/condensed_check_list.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx similarity index 100% rename from x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/condensed_check_list.test.tsx rename to x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 4d88015a66125d..d01a8555426591 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -64,7 +64,7 @@ export function MonitorListDrawerComponent({ - + {monitorUrl} From ca831990934bc836b9aa6bf8398032bc530c424e Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 9 Oct 2019 23:28:06 +0500 Subject: [PATCH 15/35] update tests --- .../uptime/common/graphql/introspection.json | 8 - .../plugins/uptime/common/graphql/types.ts | 2 - .../condensed_check_list.test.tsx.snap | 253 ------------------ .../to_condensed_check.test.ts.snap | 104 ------- .../__tests__/to_condensed_check.test.ts | 178 ------------ .../monitor_list_drawer.test.tsx.snap | 105 ++++++++ .../monitor_status_list.test.tsx.snap | 35 ++- .../most_recent_error.test.tsx.snap | 41 +++ .../__tests__/monitor_list_drawer.test.tsx | 48 ++-- .../__tests__/monitor_status_list.test.tsx | 3 +- .../__tests__/most_recent_error.test.tsx | 70 ++--- .../monitor_list_drawer.tsx | 4 - .../uptime/public/state/effects/monitor.ts | 5 +- 13 files changed, 229 insertions(+), 627 deletions(-) delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/condensed_check_list.test.tsx.snap delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/to_condensed_check.test.ts.snap delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/to_condensed_check.test.ts create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/most_recent_error.test.tsx.snap diff --git a/x-pack/legacy/plugins/uptime/common/graphql/introspection.json b/x-pack/legacy/plugins/uptime/common/graphql/introspection.json index c00ada62ec01b0..4d1993233e9ca6 100644 --- a/x-pack/legacy/plugins/uptime/common/graphql/introspection.json +++ b/x-pack/legacy/plugins/uptime/common/graphql/introspection.json @@ -2794,14 +2794,6 @@ "type": { "kind": "OBJECT", "name": "StateUrl", "ofType": null }, "isDeprecated": false, "deprecationReason": null - }, - { - "name": "error", - "description": "", - "args": [], - "type": { "kind": "OBJECT", "name": "Error", "ofType": null }, - "isDeprecated": false, - "deprecationReason": null } ], "inputFields": null, diff --git a/x-pack/legacy/plugins/uptime/common/graphql/types.ts b/x-pack/legacy/plugins/uptime/common/graphql/types.ts index b416bf9f201840..ed7c9ef19f484f 100644 --- a/x-pack/legacy/plugins/uptime/common/graphql/types.ts +++ b/x-pack/legacy/plugins/uptime/common/graphql/types.ts @@ -533,8 +533,6 @@ export interface State { tls?: (StateTls | null)[] | null; url?: StateUrl | null; - - error?: Error | null; } export interface Agent { diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/condensed_check_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/condensed_check_list.test.tsx.snap deleted file mode 100644 index 58b0887c29b32e..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/condensed_check_list.test.tsx.snap +++ /dev/null @@ -1,253 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CondensedCheckList component renders checks 1`] = ` - - - - - - - - - - - - - - - - - - 127.0.0.1 - - - a few moments ago - - , - - - - - - 127.0.0.2 - - - a few moments ago - - , - ] - } - delay="regular" - position="right" - title="Check statuses" - > - - 2 checks - - - - - - - - - - - - - - - - - - - - 127.0.0.1 - - - a few moments ago - - , - - - - - - 127.0.0.2 - - - a few moments ago - - , - ] - } - delay="regular" - position="right" - title="Check statuses" - > - - 2 checks - - - - -`; - -exports[`CondensedCheckList component renders null in place of child status with missing ip 1`] = ` - - - - - - - - - - - - - - - - - - 127.0.0.2 - - - a few moments ago - - , - ] - } - delay="regular" - position="right" - title="Check statuses" - > - - 2 checks - - - - - - - - - - - - - - - - - - - - 127.0.0.1 - - - a few moments ago - - , - - - - - - 127.0.0.2 - - - a few moments ago - - , - ] - } - delay="regular" - position="right" - title="Check statuses" - > - - 2 checks - - - - -`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/to_condensed_check.test.ts.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/to_condensed_check.test.ts.snap deleted file mode 100644 index 44c284d5518410..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/to_condensed_check.test.ts.snap +++ /dev/null @@ -1,104 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`toCondensedCheck condenses checks across location 1`] = ` -Array [ - Object { - "childStatuses": Array [ - Object { - "ip": "192.178.123.21", - "status": "up", - "timestamp": "123", - }, - Object { - "ip": "192.178.123.22", - "status": "down", - "timestamp": "124", - }, - Object { - "ip": "192.178.123.23", - "status": "up", - "timestamp": "113", - }, - ], - "location": "us-east-1", - "status": "mixed", - "timestamp": "124", - }, -] -`; - -exports[`toCondensedCheck creates the correct number of condensed checks for multiple locations 1`] = ` -Array [ - Object { - "childStatuses": Array [ - Object { - "ip": "192.178.123.21", - "status": "up", - "timestamp": "123", - }, - Object { - "ip": "192.178.123.22", - "status": "down", - "timestamp": "124", - }, - Object { - "ip": "192.178.123.23", - "status": "up", - "timestamp": "113", - }, - ], - "location": "us-east-1", - "status": "mixed", - "timestamp": "124", - }, - Object { - "childStatuses": Array [ - Object { - "ip": "192.178.123.21", - "status": "up", - "timestamp": "121", - }, - Object { - "ip": "192.178.123.22", - "status": "down", - "timestamp": "132", - }, - Object { - "ip": "192.178.123.23", - "status": "up", - "timestamp": "115", - }, - ], - "location": "us-west-1", - "status": "mixed", - "timestamp": "132", - }, -] -`; - -exports[`toCondensedCheck infers an "up" status for a series of "up" checks 1`] = ` -Array [ - Object { - "childStatuses": Array [ - Object { - "ip": "192.178.123.21", - "status": "up", - "timestamp": "123", - }, - Object { - "ip": "192.178.123.22", - "status": "up", - "timestamp": "124", - }, - Object { - "ip": "192.178.123.23", - "status": "up", - "timestamp": "113", - }, - ], - "location": "us-east-1", - "status": "up", - "timestamp": "124", - }, -] -`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/to_condensed_check.test.ts b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/to_condensed_check.test.ts deleted file mode 100644 index 6b8a2fd3c0e787..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/to_condensed_check.test.ts +++ /dev/null @@ -1,178 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import { Check } from '../../../../../common/graphql/types'; -import { toCondensedCheck } from '../to_condensed_check'; - -describe('toCondensedCheck', () => { - let checks: Check[]; - beforeEach(() => { - checks = [ - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '123', - monitor: { - ip: '192.178.123.21', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '124', - monitor: { - ip: '192.178.123.22', - status: 'down', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '113', - monitor: { - ip: '192.178.123.23', - status: 'up', - }, - }, - ]; - }); - - it('condenses checks across location', () => { - expect(toCondensedCheck(checks)).toMatchSnapshot(); - }); - - it('infers an "up" status for a series of "up" checks', () => { - checks = [ - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '123', - monitor: { - ip: '192.178.123.21', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '124', - monitor: { - ip: '192.178.123.22', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '113', - monitor: { - ip: '192.178.123.23', - status: 'up', - }, - }, - ]; - const result = toCondensedCheck(checks); - expect(result).toMatchSnapshot(); - }); - - it('creates the correct number of condensed checks for multiple locations', () => { - checks = [ - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '123', - monitor: { - ip: '192.178.123.21', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '124', - monitor: { - ip: '192.178.123.22', - status: 'down', - }, - }, - { - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: '113', - monitor: { - ip: '192.178.123.23', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-west-1', - }, - }, - timestamp: '121', - monitor: { - ip: '192.178.123.21', - status: 'up', - }, - }, - { - observer: { - geo: { - name: 'us-west-1', - }, - }, - timestamp: '132', - monitor: { - ip: '192.178.123.22', - status: 'down', - }, - }, - { - observer: { - geo: { - name: 'us-west-1', - }, - }, - timestamp: '115', - monitor: { - ip: '192.178.123.23', - status: 'up', - }, - }, - ]; - const result = toCondensedCheck(checks); - expect(result).toMatchSnapshot(); - }); -}); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap new file mode 100644 index 00000000000000..07c59a03e78b63 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -0,0 +1,105 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`MonitorListDrawer component renders a MonitorListDrawer when there are many checks 1`] = ` + + + + + + + + + + Actions + + + + + + +`; + +exports[`MonitorListDrawer component renders a MonitorListDrawer when there is only one check 1`] = ` + + + + + + + + + + Actions + + + + + + +`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap index 97b0815f09f180..a0a16c7b7c8236 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap @@ -1,6 +1,39 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`CondensedCheckList component renders checks 1`] = ` +exports[`MonitorStatusList component renders checks 1`] = ` + + + Down + in + + elastic + , elastic + , elastic + , elastic + + + + Up + in + + elastic + , elastic + , elastic + , elastic + + + +`; + +exports[`MonitorStatusList component renders null in place of child status with missing ip 1`] = ` +

+ Most recent error +

+ , + + Get https://expired.badssl.com: x509: certificate has expired or is not yet valid + , +] +`; + +exports[`MostRecentError component validates props with shallow render 1`] = ` + + +

+ Most recent error +

+ + + Get https://expired.badssl.com: x509: certificate has expired or is not yet valid + + +`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx index f45a810b351b33..09ad3a8ffdc73e 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx @@ -3,14 +3,16 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ -import { expect } from 'jest'; +import 'jest'; import { MonitorSummary, Check } from '../../../../../../common/graphql/types'; import { shallowWithIntl } from 'test_utils/enzyme_helpers'; import React from 'react'; -import { MonitorListDrawer } from '../monitor_list_drawer'; +import { MonitorListDrawerComponent } from '../monitor_list_drawer'; describe('MonitorListDrawer component', () => { let summary: MonitorSummary; + let loadMonitorDetails: any; + let monitorDetails: any; beforeEach(() => { summary = { @@ -32,39 +34,52 @@ describe('MonitorListDrawer component', () => { timestamp: '123', }, }; + monitorDetails = { + monitorId: 'bad-ssl', + error: { + type: 'io', + message: + 'Get https://expired.badssl.com: x509: certificate has expired or is not yet valid', + }, + }; + loadMonitorDetails = () => null; }); it('renders nothing when no summary data is present', () => { - const component = shallowWithIntl(); + const component = shallowWithIntl( + + ); expect(component).toEqual({}); }); it('renders nothing when no check data is present', () => { delete summary.state.checks; const component = shallowWithIntl( - ); expect(component).toEqual({}); }); - it('renders a Checklist when there is only one check', () => { + it('renders a MonitorListDrawer when there is only one check', () => { const component = shallowWithIntl( - ); expect(component).toMatchSnapshot(); }); - it('renders a CondensedCheckList when there are many checks', () => { + it('renders a MonitorListDrawer when there are many checks', () => { const checks: Check[] = [ { monitor: { @@ -90,11 +105,10 @@ describe('MonitorListDrawer component', () => { ]; summary.state.checks = checks; const component = shallowWithIntl( - ); expect(component).toMatchSnapshot(); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx index c086fe1e088c7c..8c07d0b1a7d224 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_list.test.tsx @@ -10,7 +10,7 @@ import moment from 'moment'; import { MonitorStatusList } from '../monitor_status_list'; import { Check } from '../../../../../../common/graphql/types'; -describe('CondensedCheckList component', () => { +describe('MonitorStatusList component', () => { let checks: Check[]; beforeAll(() => { @@ -135,7 +135,6 @@ describe('CondensedCheckList component', () => { }); it('renders null in place of child status with missing ip', () => { - checks[0].childStatuses[0].ip = undefined; const component = shallowWithIntl(); expect(component).toMatchSnapshot(); }); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx index 378167b6e5b05a..d1f54c6431e642 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx @@ -4,71 +4,31 @@ * you may not use this file except in compliance with the Elastic License. */ -import { shallowWithIntl } from 'test_utils/enzyme_helpers'; +import { shallowWithIntl, renderWithIntl } from 'test_utils/enzyme_helpers'; import React from 'react'; -import moment from 'moment'; -import { CondensedCheck } from '../types'; -import { CondensedCheckList } from '../condensed_check_list'; +import { MostRecentError } from '../most_recent_error'; -describe('CondensedCheckList component', () => { - let checks: CondensedCheck[]; - - beforeAll(() => { - moment.prototype.toLocaleString = jest.fn(() => '2019-06-21 15:29:26'); - moment.prototype.from = jest.fn(() => 'a few moments ago'); - }); +describe('MostRecentError component', () => { + let monitorDetails: any; beforeEach(() => { - checks = [ - { - childStatuses: [ - { - ip: '127.0.0.1', - status: 'up', - timestamp: '123', - }, - { - ip: '127.0.0.2', - status: 'down', - timestamp: '122', - }, - ], - location: 'us-east-1', - status: 'mixed', - timestamp: '123', - }, - { - childStatuses: [ - { - ip: '127.0.0.1', - status: 'up', - timestamp: '120', - }, - { - ip: '127.0.0.2', - status: 'up', - timestamp: '121', - }, - ], - location: 'us-west-1', - status: 'up', - timestamp: '125', + monitorDetails = { + monitorId: 'bad-ssl', + error: { + type: 'io', + message: + 'Get https://expired.badssl.com: x509: certificate has expired or is not yet valid', }, - ]; + }; }); - it('renders checks', () => { - const component = shallowWithIntl( - - ); + it('validates props with shallow render', () => { + const component = shallowWithIntl(); expect(component).toMatchSnapshot(); }); - it('renders null in place of child status with missing ip', () => { - checks[0].childStatuses[0].ip = undefined; - const component = shallowWithIntl( - - ); + it('renders properly with empty data', () => { + const component = renderWithIntl(); expect(component).toMatchSnapshot(); }); }); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index d01a8555426591..5bc73fb7166545 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -56,10 +56,6 @@ export function MonitorListDrawerComponent({ const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); - if (!summary || !summary.state.checks) { - return null; - } - return ( diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts index 3ea2ea546e4118..865427e78b845e 100644 --- a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts @@ -7,7 +7,6 @@ import { call, put, takeLatest, select } from 'redux-saga/effects'; import { Action } from 'redux-actions'; import { - MonitorActionTypes, FETCH_MONITOR_DETAILS, FETCH_MONITOR_DETAILS_SUCCESS, FETCH_MONITOR_DETAILS_FAIL, @@ -15,8 +14,8 @@ import { import { fetchMonitorDetails } from '../api/monitor'; import { getBasePath } from '../selectors'; -function* monitorDetailsSaga(action: Action) { - const monitorId = action.payload; +function* monitorDetailsSaga(action: Action) { + const monitorId: string = action.payload; try { const basePath = yield select(getBasePath); const response = yield call(fetchMonitorDetails, { monitorId, basePath }); From 0f71baf957c61a55f20e6200adc25d2f0a80726d Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 9 Oct 2019 23:36:42 +0500 Subject: [PATCH 16/35] revert some changes --- .../public/queries/monitor_states_query.ts | 4 - .../elasticsearch_monitors_adapter.ts | 6 +- .../rest_api/monitors/monitors_details.ts | 4 +- x-pack/package.json | 2 +- yarn.lock | 100 +----------------- 5 files changed, 8 insertions(+), 108 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts b/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts index 6c40f6c9e50722..76f62ad453bd91 100644 --- a/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts +++ b/x-pack/legacy/plugins/uptime/public/queries/monitor_states_query.ts @@ -100,10 +100,6 @@ query MonitorStates($dateRangeStart: String!, $dateRangeEnd: String!, $paginatio domain } timestamp - error { - type - message - } } } } diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts index 92234b0a6bead7..744436cc8a1dfd 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts @@ -430,11 +430,7 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { }; } - public async getMonitorDetails( - request: any, - monitorId: string, - checkGroup: string - ): Promise { + public async getMonitorDetails(request: any, monitorId: string): Promise { const params = { index: INDEX_NAMES.HEARTBEAT, body: { diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts index b723d3f08f659e..d1c43c9e16f18b 100644 --- a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts +++ b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts @@ -20,7 +20,7 @@ export const createGetMonitorDetailsRoute = (libs: UMServerLibs) => ({ tags: ['access:uptime'], }, handler: async (request: any): Promise => { - const { monitorId, checkGroup } = request.query; - return await libs.monitors.getMonitorDetails(request, monitorId, checkGroup); + const { monitorId } = request.query; + return await libs.monitors.getMonitorDetails(request, monitorId); }, }); diff --git a/x-pack/package.json b/x-pack/package.json index e777f6ebf38537..33916df4d0698b 100644 --- a/x-pack/package.json +++ b/x-pack/package.json @@ -340,7 +340,7 @@ "redux": "4.0.0", "redux-actions": "2.2.1", "redux-observable": "^1.0.0", - "redux-saga": "^1.1.1", + "redux-saga": "^0.16.0", "redux-thunk": "2.3.0", "redux-thunks": "^1.0.0", "request": "^2.88.0", diff --git a/yarn.lock b/yarn.lock index 93f2864a5f3445..d0dba42de5fb0e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -960,13 +960,6 @@ dependencies: regenerator-runtime "^0.13.2" -"@babel/runtime@^7.6.0": - version "7.6.2" - resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.6.2.tgz#c3d6e41b304ef10dcf13777a33e7694ec4a9a6dd" - integrity sha512-EXxN64agfUqqIGeEjI5dL5z0Sw0ZwWo1mLTi4mQowCZ42O59b7DRpZAnTC6OqdF28wMBMFKNb/4uFGrVaigSpg== - dependencies: - regenerator-runtime "^0.13.2" - "@babel/template@^7.0.0", "@babel/template@^7.1.0", "@babel/template@^7.4.0", "@babel/template@^7.4.4": version "7.4.4" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.4.4.tgz#f4b88d1225689a08f5bc3a17483545be9e4ed237" @@ -1125,18 +1118,6 @@ once "^1.4.0" pump "^3.0.0" -"@elastic/elasticsearch@^7.4.0": - version "7.4.0" - resolved "https://registry.yarnpkg.com/@elastic/elasticsearch/-/elasticsearch-7.4.0.tgz#57f4066acf25e9d4e9b4f6376088433aae6f25d4" - integrity sha512-HpEKHH6mHQRvea3lw4NNJw9ZUS1KmkpwWKHucaHi1svDn+/fEAwY0wD8egL1vZJo4ZmWfCQMjVqGL+Hoy1HYRw== - dependencies: - debug "^4.1.1" - decompress-response "^4.2.0" - into-stream "^5.1.0" - ms "^2.1.1" - once "^1.4.0" - pump "^3.0.0" - "@elastic/eslint-plugin-eui@0.0.2": version "0.0.2" resolved "https://registry.yarnpkg.com/@elastic/eslint-plugin-eui/-/eslint-plugin-eui-0.0.2.tgz#56b9ef03984a05cc213772ae3713ea8ef47b0314" @@ -2387,50 +2368,6 @@ react-lifecycles-compat "^3.0.4" warning "^3.0.0" -"@redux-saga/core@^1.1.1": - version "1.1.1" - resolved "https://registry.yarnpkg.com/@redux-saga/core/-/core-1.1.1.tgz#72432130630cca08260086ffc564c2aa5488a0a2" - integrity sha512-WKXfj2cYkP0eh74dE1ueMjVDoGJIkppXiMFgx0buVRkXENeZmRxIjM4lh9LEWWFqay7I/Qkw7+cMossa7xXoAQ== - dependencies: - "@babel/runtime" "^7.6.0" - "@redux-saga/deferred" "^1.1.0" - "@redux-saga/delay-p" "^1.1.0" - "@redux-saga/is" "^1.1.0" - "@redux-saga/symbols" "^1.1.0" - "@redux-saga/types" "^1.1.0" - redux "^4.0.4" - typescript-tuple "^2.2.1" - -"@redux-saga/deferred@^1.1.0": - version "1.1.0" - resolved "https://registry.yarnpkg.com/@redux-saga/deferred/-/deferred-1.1.0.tgz#aff018f64a936c288c18bd64ddf9ccfa143db6b4" - integrity sha512-wOCJCby3hx14bvrEeFLJ1JJTjJdXDJyC+B3JQ6eiqgzNghylbf969lIYmS2Arf2QuALfUtRBNPXBIMDKG9km4g== - -"@redux-saga/delay-p@^1.1.0": - version "1.1.0" - resolved "https://registry.yarnpkg.com/@redux-saga/delay-p/-/delay-p-1.1.0.tgz#4024f979d0f78763d2e90233be8c922781ae4400" - integrity sha512-BcRwXs20kKjgiYEwZARkpVoRIe/hHftW3iwPhdeW4/jPyR9gLv/vG8VsJMF5NDEch+/w/mJtdgSubq+wtOS47g== - dependencies: - "@redux-saga/symbols" "^1.1.0" - -"@redux-saga/is@^1.1.0": - version "1.1.0" - resolved "https://registry.yarnpkg.com/@redux-saga/is/-/is-1.1.0.tgz#d74358364ebde160bf1b8bd94903ff7684b12d41" - integrity sha512-0uFXWGSvDCfNBdROHwEVixNhFbI3S+UGBQfcPXQiYL+CjIjyR3DTg2Z+NFH9xzP+H4Oh/yGtTHDhC0GxYp7HQQ== - dependencies: - "@redux-saga/symbols" "^1.1.0" - "@redux-saga/types" "^1.1.0" - -"@redux-saga/symbols@^1.1.0": - version "1.1.0" - resolved "https://registry.yarnpkg.com/@redux-saga/symbols/-/symbols-1.1.0.tgz#676b277cb5deb48ce723b2b394cbae97f82e8319" - integrity sha512-Fzw1wV3j4hbac3MYmgNE18Z53URmQZeilTHZLF7Lm4SQ1jG4fcU47v2kElsEbQXUSaFqj+uJqdRzmDGNb6pRwQ== - -"@redux-saga/types@^1.1.0": - version "1.1.0" - resolved "https://registry.yarnpkg.com/@redux-saga/types/-/types-1.1.0.tgz#0e81ce56b4883b4b2a3001ebe1ab298b84237204" - integrity sha512-afmTuJrylUU/0OtqzaRkbyYFFNgCF73Bvel/sw90pvGrWIZ+vyoIJqA6eMSoA6+nb443kTmulmBtC9NerXboNg== - "@samverschueren/stream-to-observable@^0.3.0": version "0.3.0" resolved "https://registry.yarnpkg.com/@samverschueren/stream-to-observable/-/stream-to-observable-0.3.0.tgz#ecdf48d532c58ea477acfcab80348424f8d0662f" @@ -23966,12 +23903,10 @@ redux-observable@^1.0.0: resolved "https://registry.yarnpkg.com/redux-observable/-/redux-observable-1.0.0.tgz#780ff2455493eedcef806616fe286b454fd15d91" integrity sha512-6bXnpqWTBeLaLQjXHyN1giXq4nLxCmv+SUkdmiwBgvmVxvDbdmydvL1Z7DGo0WItyzI/kqXQKiucUuTxnrPRkA== -redux-saga@^1.1.1: - version "1.1.1" - resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-1.1.1.tgz#7e02879beb02c92030b5fbe746fd70e8bda97dfb" - integrity sha512-guSnGJ/uEF8yL8Mn4aNa7HxRGCpVUALCkec9iTTD0fOhQqkF6bRQkBLeS+7/cAH3nFnr299bi/DOurTi1apcCA== - dependencies: - "@redux-saga/core" "^1.1.1" +redux-saga@^0.16.0: + version "0.16.2" + resolved "https://registry.yarnpkg.com/redux-saga/-/redux-saga-0.16.2.tgz#993662e86bc945d8509ac2b8daba3a8c615cc971" + integrity sha512-iIjKnRThI5sKPEASpUvySemjzwqwI13e3qP7oLub+FycCRDysLSAOwt958niZW6LhxfmS6Qm1BzbU70w/Koc4w== redux-test-utils@0.2.2: version "0.2.2" @@ -24019,14 +23954,6 @@ redux@^4.0.1: loose-envify "^1.4.0" symbol-observable "^1.2.0" -redux@^4.0.4: - version "4.0.4" - resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" - integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q== - dependencies: - loose-envify "^1.4.0" - symbol-observable "^1.2.0" - reflect.ownkeys@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460" @@ -28263,13 +28190,6 @@ typedarray@^0.0.6, typedarray@~0.0.5: resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= -typescript-compare@^0.0.2: - version "0.0.2" - resolved "https://registry.yarnpkg.com/typescript-compare/-/typescript-compare-0.0.2.tgz#7ee40a400a406c2ea0a7e551efd3309021d5f425" - integrity sha512-8ja4j7pMHkfLJQO2/8tut7ub+J3Lw2S3061eJLFQcvs3tsmJKp8KG5NtpLn7KcY2w08edF74BSVN7qJS0U6oHA== - dependencies: - typescript-logic "^0.0.0" - typescript-fsa-reducers@^0.4.5: version "0.4.5" resolved "https://registry.yarnpkg.com/typescript-fsa-reducers/-/typescript-fsa-reducers-0.4.5.tgz#58fffb2f6eeca6817c2f656b7e7df2cb1c9d1f84" @@ -28282,18 +28202,6 @@ typescript-fsa@^2.0.0, typescript-fsa@^2.5.0: resolved "https://registry.yarnpkg.com/typescript-fsa/-/typescript-fsa-2.5.0.tgz#1baec01b5e8f5f34c322679d1327016e9e294faf" integrity sha1-G67AG16PXzTDImedEycBbp4pT68= -typescript-logic@^0.0.0: - version "0.0.0" - resolved "https://registry.yarnpkg.com/typescript-logic/-/typescript-logic-0.0.0.tgz#66ebd82a2548f2b444a43667bec120b496890196" - integrity sha512-zXFars5LUkI3zP492ls0VskH3TtdeHCqu0i7/duGt60i5IGPIpAHE/DWo5FqJ6EjQ15YKXrt+AETjv60Dat34Q== - -typescript-tuple@^2.2.1: - version "2.2.1" - resolved "https://registry.yarnpkg.com/typescript-tuple/-/typescript-tuple-2.2.1.tgz#7d9813fb4b355f69ac55032e0363e8bb0f04dad2" - integrity sha512-Zcr0lbt8z5ZdEzERHAMAniTiIKerFCMgd7yjq1fPnDJ43et/k9twIFQMUYff9k5oXcsQ0WpvFcgzK2ZKASoW6Q== - dependencies: - typescript-compare "^0.0.2" - typescript@3.5.1, typescript@3.5.3, typescript@^3.0.1, typescript@^3.0.3, typescript@^3.2.2, typescript@^3.3.3333, typescript@^3.4.5, typescript@~3.3.3333, typescript@~3.5.3: version "3.5.3" resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.5.3.tgz#c830f657f93f1ea846819e929092f5fe5983e977" From 6493df349da7f5abc2bf7f077e22f367e954d847 Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 9 Oct 2019 23:42:12 +0500 Subject: [PATCH 17/35] revert some changes --- tsconfig.json | 3 +-- .../public/lib/adapters/index_pattern/get_index_pattern.ts | 1 - .../plugins/uptime/server/graphql/monitor_states/schema.gql.ts | 1 - .../uptime/server/lib/adapters/monitors/adapter_types.ts | 2 +- 4 files changed, 2 insertions(+), 5 deletions(-) diff --git a/tsconfig.json b/tsconfig.json index 6baa5f18ac7bcc..a2da9c127e7ba6 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -61,8 +61,7 @@ "test_utils/**/*" ], "exclude": [ - "src/**/__fixtures__/**/*", - "e2e" + "src/**/__fixtures__/**/*" // In the build we actually exclude **/public/**/* from this config so that // we can run the TSC on both this and the .browser version of this config // file, but if we did it during development IDEs would not be able to find diff --git a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts index b5d41e1bf7e300..fd4161b35f7ddb 100644 --- a/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts +++ b/x-pack/legacy/plugins/uptime/public/lib/adapters/index_pattern/get_index_pattern.ts @@ -16,7 +16,6 @@ import { getApiPath } from '../../helper'; export const getIndexPattern = async (basePath?: string, setter?: (data: unknown) => void) => { try { const { data } = await axios.get(getApiPath('/api/uptime/index_pattern', basePath)); - if (setter) { setter(data); } diff --git a/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts b/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts index 7a774db6228c19..198f97eab96524 100644 --- a/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts +++ b/x-pack/legacy/plugins/uptime/server/graphql/monitor_states/schema.gql.ts @@ -136,7 +136,6 @@ export const monitorStatesSchema = gql` "Transport encryption information." tls: [StateTLS] url: StateUrl - error: Error } "Represents the current state and associated data for an Uptime monitor." diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts index 6aa1fda1e1a017..996e80d2c8613b 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/adapter_types.ts @@ -23,5 +23,5 @@ export interface UMMonitorsAdapter { ): Promise; getFilterBar(request: any, dateRangeStart: string, dateRangeEnd: string): Promise; getMonitorPageTitle(request: any, monitorId: string): Promise; - getMonitorDetails(request: any, monitorId: string, checkGroup: string): Promise; + getMonitorDetails(request: any, monitorId: string): Promise; } From 1ce39b1c388480442e906ea7fd2c95339d3f1779 Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 9 Oct 2019 23:46:10 +0500 Subject: [PATCH 18/35] revert some changes --- .../plugins/uptime/common/constants/client_defaults.ts | 5 ----- .../components/functional/monitor_list/monitor_list.tsx | 8 +++----- 2 files changed, 3 insertions(+), 10 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/common/constants/client_defaults.ts b/x-pack/legacy/plugins/uptime/common/constants/client_defaults.ts index 66ac571e2b7a5e..e991e0c6b82e11 100644 --- a/x-pack/legacy/plugins/uptime/common/constants/client_defaults.ts +++ b/x-pack/legacy/plugins/uptime/common/constants/client_defaults.ts @@ -18,11 +18,6 @@ export const CLIENT_DEFAULTS = { { start: 'now/M', end: 'now', label: 'Month to date' }, { start: 'now/y', end: 'now', label: 'Year to date' }, ], - /** - * Designate how many checks a monitor summary can have - * before condensing them. - */ - CONDENSED_CHECK_LIMIT: 12, DATE_RANGE_START: 'now-15m', DATE_RANGE_END: 'now', FILTERS: '', diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx index 64b606001971ea..36638dff9d5c78 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx @@ -72,11 +72,9 @@ export const MonitorListComponent = (props: Props) => { return { ...map, [id]: ( - <> - monitorId === id)} - /> - + monitorId === id)} + /> ), }; }, {}); From 40c6f86aa5b3e338c3822e4ea93ddb891bfd56fb Mon Sep 17 00:00:00 2001 From: shahzad Date: Thu, 10 Oct 2019 02:14:32 +0500 Subject: [PATCH 19/35] update test --- .../monitor_list_drawer.test.tsx.snap | 20 +++++++++++++++++++ .../__tests__/monitor_list_drawer.test.tsx | 4 ++++ 2 files changed, 24 insertions(+) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap index 07c59a03e78b63..cca30efb570e9b 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -6,9 +6,11 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there are + https://expired.badssl.com + `; @@ -65,9 +75,11 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there is o + https://expired.badssl.com + `; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx index 09ad3a8ffdc73e..aca43f550aa146 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_list_drawer.test.tsx @@ -32,6 +32,10 @@ describe('MonitorListDrawer component', () => { down: 0, }, timestamp: '123', + url: { + domain: 'expired.badssl.com', + full: 'https://expired.badssl.com', + }, }, }; monitorDetails = { From 355c5382da7387f737d71e79d40bcba56273ed4a Mon Sep 17 00:00:00 2001 From: shahzad Date: Thu, 10 Oct 2019 15:02:35 +0500 Subject: [PATCH 20/35] update drawer --- .../public/components/functional/index.ts | 1 - .../monitor_page_link.test.tsx.snap | 27 ++++++++ .../__tests__/monitor_page_link.test.tsx | 26 ++++++++ .../functional/monitor_list/monitor_list.tsx | 8 +-- .../monitor_list_drawer.test.tsx.snap | 2 + .../most_recent_error.test.tsx.snap | 64 ++++++++++++------- .../__tests__/most_recent_error.test.tsx | 13 +++- .../monitor_list_drawer.tsx | 4 +- .../monitor_list_drawer/most_recent_error.tsx | 32 ++++++++-- .../monitor_list/monitor_page_link.tsx | 40 ++++++++++++ .../functional/monitor_page_link.tsx | 36 ----------- 11 files changed, 179 insertions(+), 74 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_page_link.test.tsx create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_page_link.tsx delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_page_link.tsx diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/index.ts b/x-pack/legacy/plugins/uptime/public/components/functional/index.ts index 5b74f8d92c5e4a..2de22e23e8bc01 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/index.ts +++ b/x-pack/legacy/plugins/uptime/public/components/functional/index.ts @@ -11,7 +11,6 @@ export { KueryBar } from './kuery_bar'; export { IntegrationLink } from './integration_link'; export { MonitorCharts } from './monitor_charts'; export { MonitorList } from './monitor_list'; -export { MonitorPageLink } from './monitor_page_link'; export { MonitorPageTitle } from './monitor_page_title'; export { MonitorStatusBar } from './monitor_status_bar'; export { OverviewPageParsingErrorCallout } from './overview_page_parsing_error_callout'; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap new file mode 100644 index 00000000000000..571c81f20551af --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap @@ -0,0 +1,27 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`MonitorPageLink component renders a help link when link parameters present 1`] = ` + + + +`; + +exports[`MonitorPageLink component renders the link properly 1`] = ` + + + +`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_page_link.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_page_link.test.tsx new file mode 100644 index 00000000000000..dd6e9c66d395bd --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/monitor_page_link.test.tsx @@ -0,0 +1,26 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { shallowWithIntl } from 'test_utils/enzyme_helpers'; +import React from 'react'; +import { MonitorPageLink } from '../monitor_page_link'; + +describe('MonitorPageLink component', () => { + it('renders the link properly', () => { + const component = shallowWithIntl( + + ); + expect(component).toMatchSnapshot(); + }); + + it('renders a help link when link parameters present', () => { + const linkParameters = 'selectedPingStatus=down'; + const component = shallowWithIntl( + + ); + expect(component).toMatchSnapshot(); + }); +}); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx index 36638dff9d5c78..eb75b1fe6a3e1c 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list.tsx @@ -31,7 +31,7 @@ import { formatUptimeGraphQLErrorList } from '../../../lib/helper/format_error_l import { ExpandedRowMap } from './types'; import { MonitorListDrawer } from './monitor_list_drawer'; import { MonitorBarSeries } from '../charts'; -import { MonitorPageLink } from '../monitor_page_link'; +import { MonitorPageLink } from './monitor_page_link'; import { MonitorListActionsPopover } from './monitor_list_actions_popover'; import { OverviewPageLink } from '../overview_page_link'; @@ -145,11 +145,7 @@ export const MonitorListComponent = (props: Props) => { defaultMessage: 'Name', }), render: (name: string, summary: MonitorSummary) => ( - + {name ? name : `Unnamed - ${summary.monitor_id}`} ), diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap index cca30efb570e9b..daf8d64c8da431 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -65,6 +65,7 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there are "type": "io", } } + monitorId="foo" /> `; @@ -120,6 +121,7 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there is o "type": "io", } } + monitorId="foo" /> `; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/most_recent_error.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/most_recent_error.test.tsx.snap index e67bb43cf4c9c6..cdda21b75770ab 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/most_recent_error.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/most_recent_error.test.tsx.snap @@ -9,33 +9,51 @@ Array [ Most recent error , - - Get https://expired.badssl.com: x509: certificate has expired or is not yet valid - , + + Get https://expired.badssl.com: x509: certificate has expired or is not yet valid + + , ] `; exports[`MostRecentError component validates props with shallow render 1`] = ` - - -

- Most recent error -

- - - Get https://expired.badssl.com: x509: certificate has expired or is not yet valid - - + + + `; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx index d1f54c6431e642..71eab73cd52d6f 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/most_recent_error.test.tsx @@ -6,6 +6,7 @@ import { shallowWithIntl, renderWithIntl } from 'test_utils/enzyme_helpers'; import React from 'react'; +import { BrowserRouter as Router } from 'react-router-dom'; import { MostRecentError } from '../most_recent_error'; describe('MostRecentError component', () => { @@ -23,12 +24,20 @@ describe('MostRecentError component', () => { }); it('validates props with shallow render', () => { - const component = shallowWithIntl(); + const component = shallowWithIntl( + + + + ); expect(component).toMatchSnapshot(); }); it('renders properly with empty data', () => { - const component = renderWithIntl(); + const component = renderWithIntl( + + + + ); expect(component).toMatchSnapshot(); }); }); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 5bc73fb7166545..c3925a547a3aba 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -71,7 +71,9 @@ export function MonitorListDrawerComponent({ - {monitorDetails && } + {monitorDetails && ( + + )} ); } diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx index 6e2a2260c39055..12ea8c52adeb07 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/most_recent_error.tsx @@ -4,7 +4,11 @@ * you may not use this file except in compliance with the Elastic License. */ import React from 'react'; -import { EuiText, EuiLink } from '@elastic/eui'; +import { EuiText } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; +import { MonitorPageLink } from '../monitor_page_link'; +import { useUrlParams } from '../../../../hooks'; +import { stringifyUrlParams } from '../../../../lib/helper/stringify_url_params'; interface RecentError { message: string; @@ -12,18 +16,36 @@ interface RecentError { } interface MostRecentErrorProps { + /** + * error returned from API for monitor details + */ error: RecentError; + + /** + * monitorId to be used for link to detail page + */ + monitorId: string; } -export const MostRecentError = ({ error }: MostRecentErrorProps) => { +export const MostRecentError = ({ error, monitorId }: MostRecentErrorProps) => { + const [getUrlParams] = useUrlParams(); + const { absoluteDateRangeStart, absoluteDateRangeEnd, ...params } = getUrlParams(); + params.selectedPingStatus = 'down'; + const linkParameters = stringifyUrlParams(params); + return ( <> -

Most recent error

+

+ {i18n.translate('xpack.uptime.monitorList.mostRecentError.title', { + defaultMessage: 'Most recent error', + description: 'Most Recent Error title in Monitor List Expanded row', + })} +

- + {error.message} - + ); }; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_page_link.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_page_link.tsx new file mode 100644 index 00000000000000..803b399810508b --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_page_link.tsx @@ -0,0 +1,40 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { EuiLink } from '@elastic/eui'; +import { Link } from 'react-router-dom'; +import React, { FunctionComponent } from 'react'; + +interface DetailPageLinkProps { + /** + * MonitorId to be used to redirect to detail page + */ + monitorId: string; + /** + * Link parameters usually filter states + */ + linkParameters: string | undefined; +} + +export const MonitorPageLink: FunctionComponent = ({ + children, + monitorId, + linkParameters, +}) => { + const getLocationTo = () => { + // encode monitorId param as 64 base string to make it a valid URL, since it can be a url + return linkParameters + ? `/monitor/${btoa(monitorId)}/${linkParameters}` + : `/monitor/${btoa(monitorId)}`; + }; + return ( + + + {children} + + + ); +}; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_page_link.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_page_link.tsx deleted file mode 100644 index 4bfa2f95c3f770..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_page_link.tsx +++ /dev/null @@ -1,36 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import { EuiLink } from '@elastic/eui'; -import { Link } from 'react-router-dom'; -import React, { FunctionComponent } from 'react'; - -interface DetailPageLinkProps { - id: string; - location: string | undefined; - linkParameters: string | undefined; -} - -export const MonitorPageLink: FunctionComponent = ({ - children, - id, - location, - linkParameters, -}) => ( - - - {children} - - -); From d833e343ccbbda3fc2d8a63f124f3e3f912fb0b9 Mon Sep 17 00:00:00 2001 From: shahzad Date: Fri, 11 Oct 2019 17:01:26 +0500 Subject: [PATCH 21/35] added run time validation --- .../uptime/common/runtime_types/index.ts | 7 +++++++ .../runtime_types/monitor/monitor_details.ts | 20 +++++++++++++++++++ .../monitor_list_drawer.tsx | 2 +- .../uptime/public/state/api/monitor.ts | 10 +++++++--- .../uptime/public/state/effects/monitor.ts | 2 +- .../uptime/public/state/reducers/monitor.ts | 4 ++++ .../elasticsearch_monitors_adapter.ts | 6 +++--- .../rest_api/monitors/monitors_details.ts | 5 ++--- 8 files changed, 45 insertions(+), 11 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/common/runtime_types/index.ts create mode 100644 x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts diff --git a/x-pack/legacy/plugins/uptime/common/runtime_types/index.ts b/x-pack/legacy/plugins/uptime/common/runtime_types/index.ts new file mode 100644 index 00000000000000..3a5d0549c5d45f --- /dev/null +++ b/x-pack/legacy/plugins/uptime/common/runtime_types/index.ts @@ -0,0 +1,7 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +export * from './monitor/monitor_details'; diff --git a/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts b/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts new file mode 100644 index 00000000000000..93948e6d4ebe7c --- /dev/null +++ b/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts @@ -0,0 +1,20 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ +import * as t from 'io-ts'; + +export const ErrorType = t.partial({ + code: t.number, + message: t.string, + type: t.string, +}); + +export type Error = t.TypeOf; + +export const MonitorDetailsType = t.intersection([ + t.type({ monitorId: t.string }), + t.partial({ error: ErrorType }), +]); +export type MonitorDetails = t.TypeOf; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index c3925a547a3aba..da2a28eb195966 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -71,7 +71,7 @@ export function MonitorListDrawerComponent({ - {monitorDetails && ( + {monitorDetails && monitorDetails.error && ( )} diff --git a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts index d504a4af6b0685..d043cf71194720 100644 --- a/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/api/monitor.ts @@ -4,8 +4,9 @@ * you may not use this file except in compliance with the Elastic License. */ -import { MonitorDetailsState } from '../actions/monitor'; +import { ThrowReporter } from 'io-ts/lib/ThrowReporter'; import { getApiPath } from '../../lib/helper'; +import { MonitorDetailsType, MonitorDetails } from '../../../common/runtime_types'; interface ApiRequest { monitorId: string; @@ -15,11 +16,14 @@ interface ApiRequest { export const fetchMonitorDetails = async ({ monitorId, basePath, -}: ApiRequest): Promise => { +}: ApiRequest): Promise => { const url = getApiPath(`/api/uptime/monitor/details?monitorId=${monitorId}`, basePath); const response = await fetch(url); if (!response.ok) { throw new Error(response.statusText); } - return response.json(); + return response.json().then(data => { + ThrowReporter.report(MonitorDetailsType.decode(data)); + return data; + }); }; diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts index 865427e78b845e..a842a0cb69c982 100644 --- a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts @@ -21,7 +21,7 @@ function* monitorDetailsSaga(action: Action) { const response = yield call(fetchMonitorDetails, { monitorId, basePath }); yield put({ type: FETCH_MONITOR_DETAILS_SUCCESS, payload: response }); } catch (error) { - yield put({ type: FETCH_MONITOR_DETAILS_FAIL, error }); + yield put({ type: FETCH_MONITOR_DETAILS_FAIL, payload: error.message }); } } diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts index e0a724619bb234..310ab2a97d4836 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -15,11 +15,13 @@ import { export interface MonitorState { monitorDetailsList: MonitorDetailsState[]; loading: boolean; + errors: any[]; } const initialState: MonitorState = { monitorDetailsList: [], loading: false, + errors: [], }; export function monitorReducer(state = initialState, action: MonitorActionTypes): MonitorState { @@ -41,8 +43,10 @@ export function monitorReducer(state = initialState, action: MonitorActionTypes) loading: false, }; case FETCH_MONITOR_DETAILS_FAIL: + const error = action.payload; return { ...state, + errors: [...state.errors, error], }; default: return state; diff --git a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts index 744436cc8a1dfd..000351ec6c6c66 100644 --- a/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts +++ b/x-pack/legacy/plugins/uptime/server/lib/adapters/monitors/elasticsearch_monitors_adapter.ts @@ -12,7 +12,6 @@ import { MonitorPageTitle, Ping, LocationDurationLine, - Error, } from '../../../../common/graphql/types'; import { dropLatestBucket, @@ -22,6 +21,7 @@ import { } from '../../helper'; import { DatabaseAdapter } from '../database'; import { UMMonitorsAdapter } from './adapter_types'; +import { MonitorDetails, Error } from '../../../../common/runtime_types'; const formatStatusBuckets = (time: any, buckets: any, docCount: any) => { let up = null; @@ -430,7 +430,7 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { }; } - public async getMonitorDetails(request: any, monitorId: string): Promise { + public async getMonitorDetails(request: any, monitorId: string): Promise { const params = { index: INDEX_NAMES.HEARTBEAT, body: { @@ -465,7 +465,7 @@ export class ElasticsearchMonitorsAdapter implements UMMonitorsAdapter { const result = await this.database.search(request, params); - const monitorError: Error | null = get(result, 'hits.hits[0]._source.error', null); + const monitorError: Error | undefined = get(result, 'hits.hits[0]._source.error', undefined); return { monitorId, diff --git a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts index d1c43c9e16f18b..1440b55c1c1378 100644 --- a/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts +++ b/x-pack/legacy/plugins/uptime/server/rest_api/monitors/monitors_details.ts @@ -3,9 +3,9 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ - import Joi from 'joi'; import { UMServerLibs } from '../../lib/lib'; +import { MonitorDetails } from '../../../common/runtime_types/monitor/monitor_details'; export const createGetMonitorDetailsRoute = (libs: UMServerLibs) => ({ method: 'GET', @@ -14,12 +14,11 @@ export const createGetMonitorDetailsRoute = (libs: UMServerLibs) => ({ validate: { query: Joi.object({ monitorId: Joi.string(), - checkGroup: Joi.string(), }), }, tags: ['access:uptime'], }, - handler: async (request: any): Promise => { + handler: async (request: any): Promise => { const { monitorId } = request.query; return await libs.monitors.getMonitorDetails(request, monitorId); }, From 40091fe203a683c1885787bbd9ab30a2db81fb02 Mon Sep 17 00:00:00 2001 From: shahzad Date: Sat, 12 Oct 2019 02:52:03 +0500 Subject: [PATCH 22/35] update monitor status --- .../__tests__/location_link.test.tsx | 0 .../{ => monitor_list_drawer}/location_link.tsx | 0 .../monitor_list_drawer/monitor_list_drawer.tsx | 7 ++++++- .../monitor_list_drawer/monitor_status_list.tsx | 16 ++++++++-------- 4 files changed, 14 insertions(+), 9 deletions(-) rename x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/{ => monitor_list_drawer}/__tests__/location_link.test.tsx (100%) rename x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/{ => monitor_list_drawer}/location_link.tsx (100%) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/location_link.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/location_link.test.tsx similarity index 100% rename from x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/location_link.test.tsx rename to x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/location_link.test.tsx diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/location_link.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx similarity index 100% rename from x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/location_link.tsx rename to x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index da2a28eb195966..06f1362eeb9e48 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -15,6 +15,7 @@ import { fetchMonitorDetails } from '../../../../state/actions/monitor'; import { MostRecentError } from './most_recent_error'; import { getMonitorDetails } from '../../../../state/selectors'; import { MonitorStatusList } from './monitor_status_list'; +import { LocationLink } from './location_link'; const ContainerDiv = styled.div` padding: 10px; @@ -55,16 +56,20 @@ export function MonitorListDrawerComponent({ }, []); const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); + const location = get(summary.state, 'observer.geo.name', null); return ( - + {monitorUrl} + + + Actions diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index dc482b563ace9a..6292d245fdbd04 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -21,23 +21,23 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { colors: { success, danger }, } = useContext(UptimeSettingsContext); - const upLocations: CheckMonitor[] = []; - const downLocations: CheckMonitor[] = []; + const upChecks: CheckMonitor[] = []; + const downChecks: CheckMonitor[] = []; checks.forEach((check: Check) => { if (check.monitor.status === 'up') { - upLocations.push(check.monitor); + upChecks.push(check.monitor); } if (check.monitor.status === 'down') { - downLocations.push(check.monitor); + downChecks.push(check.monitor); } }); - const displayMonitorStatus = (locations: CheckMonitor[], color: string, titleTxt: string) => { + const displayMonitorStatus = (checksList: CheckMonitor[], color: string, titleTxt: string) => { return ( <> {titleTxt} in{' '} - {locations.map((location, index) => (index ? ', ' : '') + (location.name || location.ip))} + {checksList.map((check, index) => (index ? ', ' : '') + (check.ip || check.name))} @@ -45,8 +45,8 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { }; return ( <> - {downLocations.length > 0 && displayMonitorStatus(downLocations, danger, 'Down')} - {upLocations.length > 0 && displayMonitorStatus(upLocations, success, 'Up')} + {downChecks.length > 0 && displayMonitorStatus(downChecks, danger, 'Down')} + {upChecks.length > 0 && displayMonitorStatus(upChecks, success, 'Up')} ); }; From 4352171c0f10c228efb3b450efc3724e7fa34a66 Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 21 Oct 2019 15:29:54 +0300 Subject: [PATCH 23/35] added location icon --- .../monitor_list/monitor_list_drawer/location_link.tsx | 4 +++- .../monitor_list/monitor_list_drawer/monitor_list_drawer.tsx | 1 + 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx index 70aaebc4d358e0..72c1dbfd856041 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/location_link.tsx @@ -22,7 +22,9 @@ const locationDocsLink = */ export const LocationLink = ({ location, textSize }: LocationLinkProps) => { return location ? ( - {location} + + {location} + ) : ( {i18n.translate('xpack.uptime.monitorList.geoName.helpLinkAnnotation', { diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 06f1362eeb9e48..271c0135d7fefd 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -68,6 +68,7 @@ export function MonitorListDrawerComponent({ + From b3d6eab6c9905f2be278faef26521ce3beef1bb6 Mon Sep 17 00:00:00 2001 From: shahzad Date: Fri, 25 Oct 2019 17:18:11 +0500 Subject: [PATCH 24/35] update locations --- .../monitor_list_drawer.tsx | 6 +----- .../monitor_status_list.tsx | 19 +++++++++++-------- 2 files changed, 12 insertions(+), 13 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index 271c0135d7fefd..f77db0e89d2bf3 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -61,16 +61,12 @@ export function MonitorListDrawerComponent({ return ( - + {monitorUrl} - - - - Actions diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index 6292d245fdbd04..eaf771056cc902 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -5,8 +5,9 @@ */ import React, { useContext } from 'react'; +import { get } from 'lodash'; import { EuiHealth, EuiSpacer } from '@elastic/eui'; -import { CheckMonitor, Check } from '../../../../../common/graphql/types'; +import { Check } from '../../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../../contexts'; interface MonitorStatusListProps { @@ -21,23 +22,25 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { colors: { success, danger }, } = useContext(UptimeSettingsContext); - const upChecks: CheckMonitor[] = []; - const downChecks: CheckMonitor[] = []; + const upChecks: string[] = []; + const downChecks: string[] = []; checks.forEach((check: Check) => { + const location = get(check, 'observer.geo.name', 'unnamed-location'); + if (check.monitor.status === 'up') { - upChecks.push(check.monitor); + upChecks.push(location); } if (check.monitor.status === 'down') { - downChecks.push(check.monitor); + downChecks.push(location); } }); - const displayMonitorStatus = (checksList: CheckMonitor[], color: string, titleTxt: string) => { + + const displayMonitorStatus = (checksList: string[], color: string, titleTxt: string) => { return ( <> - {titleTxt} in{' '} - {checksList.map((check, index) => (index ? ', ' : '') + (check.ip || check.name))} + {titleTxt} in {checksList.map((location, index) => (index ? ', ' : '') + location)} From 9dc864bef23af7fcc19f0e2e76593a1a2fd46f8b Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 11 Nov 2019 15:50:09 +0100 Subject: [PATCH 25/35] fix relative path --- .../components/functional/filter_group/filter_popover.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx index 4f12af75815e8b..6bb6e51fe59bb3 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx @@ -9,7 +9,7 @@ import React, { useState, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; import { UptimeFilterButton } from './uptime_filter_button'; import { toggleSelectedItems } from './toggle_selected_item'; -import { LocationLink } from '../monitor_list/location_link'; +import { LocationLink } from '../monitor_list/monitor_list_drawer/location_link'; export interface FilterPopoverProps { fieldName: string; From 8ab893a3413ac4162535c5ac925e21987da96735 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 12 Nov 2019 01:49:22 +0100 Subject: [PATCH 26/35] update unamelocation --- .../monitor_list_drawer.tsx | 2 - .../monitor_status_list.tsx | 49 ++++++++++++++----- 2 files changed, 37 insertions(+), 14 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index f77db0e89d2bf3..cb882e76503769 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -15,7 +15,6 @@ import { fetchMonitorDetails } from '../../../../state/actions/monitor'; import { MostRecentError } from './most_recent_error'; import { getMonitorDetails } from '../../../../state/selectors'; import { MonitorStatusList } from './monitor_status_list'; -import { LocationLink } from './location_link'; const ContainerDiv = styled.div` padding: 10px; @@ -56,7 +55,6 @@ export function MonitorListDrawerComponent({ }, []); const monitorUrl: string | undefined = get(summary.state.url, 'full', undefined); - const location = get(summary.state, 'observer.geo.name', null); return ( diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index eaf771056cc902..9f3451bbcfe831 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -6,9 +6,10 @@ import React, { useContext } from 'react'; import { get } from 'lodash'; -import { EuiHealth, EuiSpacer } from '@elastic/eui'; +import { EuiHealth, EuiSpacer, EuiCallOut } from '@elastic/eui'; import { Check } from '../../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../../contexts'; +import { LocationLink } from './location_link'; interface MonitorStatusListProps { /** @@ -22,25 +23,41 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { colors: { success, danger }, } = useContext(UptimeSettingsContext); - const upChecks: string[] = []; - const downChecks: string[] = []; + const upChecks: Set = new Set(); + const downChecks: Set = new Set(); + + const UN_NAMED_LOCATION = 'unnamed-location'; checks.forEach((check: Check) => { - const location = get(check, 'observer.geo.name', 'unnamed-location'); + let location = get(check, 'observer.geo.name', UN_NAMED_LOCATION); - if (check.monitor.status === 'up') { - upChecks.push(location); + if (location === null) { + location = UN_NAMED_LOCATION; } - if (check.monitor.status === 'down') { - downChecks.push(location); + + if (check.monitor.status === 'up') { + upChecks.add(location); + } else if (check.monitor.status === 'down') { + downChecks.add(location); } }); - const displayMonitorStatus = (checksList: string[], color: string, titleTxt: string) => { + // if monitor is down in one dns, it will be considered down so removing it from up list + + const absUpChecks: Set = new Set([...upChecks].filter(item => !downChecks.has(item))); + + const displayMonitorStatus = (checksList: Set, color: string, titleTxt: string) => { + let checkListArray = [...checksList]; + // If un-named location exists, move it to end + if (checksList.has(UN_NAMED_LOCATION)) { + checkListArray = checkListArray.filter(item => item !== UN_NAMED_LOCATION); + checkListArray.push(UN_NAMED_LOCATION); + } + return ( <> - {titleTxt} in {checksList.map((location, index) => (index ? ', ' : '') + location)} + {titleTxt} in {checkListArray.map((location, index) => (index ? ', ' : '') + location)} @@ -48,8 +65,16 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { }; return ( <> - {downChecks.length > 0 && displayMonitorStatus(downChecks, danger, 'Down')} - {upChecks.length > 0 && displayMonitorStatus(upChecks, success, 'Up')} + {downChecks.size > 0 && displayMonitorStatus(downChecks, danger, 'Down')} + {absUpChecks.size > 0 && displayMonitorStatus(upChecks, success, 'Up')} + {(downChecks.has(UN_NAMED_LOCATION) || upChecks.has(UN_NAMED_LOCATION)) && ( + +

+ Some heartbeat instances do not have a location defined. to your + heartbeat configuration. +

+ + )} ); }; From f83a6259defe1ec8647cd3e48c0e6e3140090072 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 12 Nov 2019 02:12:08 +0100 Subject: [PATCH 27/35] updated snaps --- .../__snapshots__/check_list.test.tsx.snap | 64 ------------------- .../monitor_page_link.test.tsx.snap | 10 +-- .../__tests__/check_list.test.tsx | 49 -------------- .../functional/monitor_list/check_list.tsx | 43 ------------- .../__snapshots__/location_link.test.tsx.snap | 1 + .../monitor_list_drawer.test.tsx.snap | 12 ++-- .../monitor_status_list.test.tsx.snap | 58 ++++++----------- 7 files changed, 29 insertions(+), 208 deletions(-) delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/check_list.test.tsx.snap delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/check_list.test.tsx delete mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/check_list.tsx rename x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/{ => monitor_list_drawer}/__tests__/__snapshots__/location_link.test.tsx.snap (96%) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/check_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/check_list.test.tsx.snap deleted file mode 100644 index 7aa77c7daf60f9..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/check_list.test.tsx.snap +++ /dev/null @@ -1,64 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`CheckList component renders a list of checks 1`] = ` - - - - - - - - - - 127.0.0.1 - - - - - - - - - - - 127.0.0.2 - - - -`; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap index 571c81f20551af..e52977749142d9 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/monitor_page_link.test.tsx.snap @@ -1,10 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`MonitorPageLink component renders a help link when link parameters present 1`] = ` - + + { - let checks: Check[]; - - beforeAll(() => { - moment.prototype.toLocaleString = jest.fn(() => '2019-06-21 15:29:26'); - moment.prototype.from = jest.fn(() => 'a few moments ago'); - }); - - beforeEach(() => { - checks = [ - { - monitor: { - ip: '127.0.0.1', - status: 'up', - }, - timestamp: '123', - }, - { - monitor: { - ip: '127.0.0.2', - status: 'up', - }, - observer: { - geo: { - name: 'us-east-1', - }, - }, - timestamp: 'up', - }, - ]; - }); - - it('renders a list of checks', () => { - const component = shallowWithIntl(); - expect(component).toMatchSnapshot(); - }); -}); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/check_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/check_list.tsx deleted file mode 100644 index 8beb3f7fa5a37e..00000000000000 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/check_list.tsx +++ /dev/null @@ -1,43 +0,0 @@ -/* - * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one - * or more contributor license agreements. Licensed under the Elastic License; - * you may not use this file except in compliance with the Elastic License. - */ - -import React, { Fragment } from 'react'; -import { EuiFlexGrid, EuiFlexItem, EuiText } from '@elastic/eui'; -import { get } from 'lodash'; -import { MonitorListStatusColumn } from './monitor_list_status_column'; -import { Check } from '../../../../common/graphql/types'; -import { LocationLink } from './location_link'; - -interface CheckListProps { - checks: Check[]; -} - -export const CheckList = ({ checks }: CheckListProps) => { - return ( - - {checks.map(check => { - const location = get(check, 'observer.geo.name', null); - const agentId = get(check, 'agent.id', 'null'); - const key = location + agentId + check.monitor.ip; - return ( - - - - - - - - - - {check.monitor.ip} - - - - ); - })} - - ); -}; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/location_link.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/location_link.test.tsx.snap similarity index 96% rename from x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/location_link.test.tsx.snap rename to x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/location_link.test.tsx.snap index 281372023ce29d..877f1fc6d7c85b 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/__tests__/__snapshots__/location_link.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/location_link.test.tsx.snap @@ -16,6 +16,7 @@ exports[`LocationLink component renders a help link when location not present 1` exports[`LocationLink component renders the location when present 1`] = ` us-east-1 diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap index daf8d64c8da431..5e7b59d42cf9da 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -3,12 +3,12 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there are many checks 1`] = ` - + https://expired.badssl.com - + https://expired.badssl.com Down - in - - elastic - , elastic - , elastic - , elastic + in + unnamed-location - - Up - in - - elastic - , elastic - , elastic - , elastic - - +

+ Some heartbeat instances do not have a location defined. + + to your heartbeat configuration. +

+ `; @@ -39,29 +30,20 @@ exports[`MonitorStatusList component renders null in place of child status with color="#bd271e" > Down - in - - elastic - , elastic - , elastic - , elastic + in + unnamed-location - - Up - in - - elastic - , elastic - , elastic - , elastic - - +

+ Some heartbeat instances do not have a location defined. + + to your heartbeat configuration. +

+ `; From ea04e554725927e4444b06cfcdd05bb078d13c0b Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 12 Nov 2019 13:14:57 +0100 Subject: [PATCH 28/35] update formatting --- .../common/runtime_types/monitor/monitor_details.ts | 2 ++ .../monitor_list_drawer/monitor_list_drawer.tsx | 9 ++++++++- .../monitor_list_drawer/monitor_status_list.tsx | 12 ++++++++---- .../legacy/plugins/uptime/public/state/api/index.ts | 1 + .../plugins/uptime/public/state/effects/index.ts | 6 +++--- .../plugins/uptime/public/state/effects/monitor.ts | 8 ++++---- x-pack/legacy/plugins/uptime/public/state/index.ts | 4 ++-- 7 files changed, 28 insertions(+), 14 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts b/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts index 93948e6d4ebe7c..246b9c22a08d71 100644 --- a/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts +++ b/x-pack/legacy/plugins/uptime/common/runtime_types/monitor/monitor_details.ts @@ -5,12 +5,14 @@ */ import * as t from 'io-ts'; +// IO type for validation export const ErrorType = t.partial({ code: t.number, message: t.string, type: t.string, }); +// Typescript type for type checking export type Error = t.TypeOf; export const MonitorDetailsType = t.intersection([ diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx index cb882e76503769..bd37d8407c57a2 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_list_drawer.tsx @@ -9,6 +9,7 @@ import { EuiLink, EuiSpacer, EuiFlexGroup, EuiFlexItem, EuiButton, EuiIcon } fro import { get } from 'lodash'; import styled from 'styled-components'; import { connect } from 'react-redux'; +import { FormattedMessage } from '@kbn/i18n/react'; import { MonitorSummary } from '../../../../../common/graphql/types'; import { AppState } from '../../../../state'; import { fetchMonitorDetails } from '../../../../state/actions/monitor'; @@ -66,7 +67,13 @@ export function MonitorListDrawerComponent({ - Actions + + + diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index 9f3451bbcfe831..a86db618bf4605 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -7,6 +7,7 @@ import React, { useContext } from 'react'; import { get } from 'lodash'; import { EuiHealth, EuiSpacer, EuiCallOut } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; import { Check } from '../../../../../common/graphql/types'; import { UptimeSettingsContext } from '../../../../contexts'; import { LocationLink } from './location_link'; @@ -69,10 +70,13 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { {absUpChecks.size > 0 && displayMonitorStatus(upChecks, success, 'Up')} {(downChecks.has(UN_NAMED_LOCATION) || upChecks.has(UN_NAMED_LOCATION)) && ( -

- Some heartbeat instances do not have a location defined. to your - heartbeat configuration. -

+ {i18n.translate('xpack.uptime.monitorList.drawer.missingLocation.description', { + defaultMessage: `Some heartbeat instances do not have a location defined.`, + })} + {' '} + {i18n.translate('xpack.uptime.monitorList.drawer.missingLocation.toLocationDocsLink', { + defaultMessage: `to your heartbeat configuration.`, + })} )} diff --git a/x-pack/legacy/plugins/uptime/public/state/api/index.ts b/x-pack/legacy/plugins/uptime/public/state/api/index.ts index 41bc2aa2588073..e9b8082b417ba6 100644 --- a/x-pack/legacy/plugins/uptime/public/state/api/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/api/index.ts @@ -3,3 +3,4 @@ * or more contributor license agreements. Licensed under the Elastic License; * you may not use this file except in compliance with the Elastic License. */ +export * from './monitor'; diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/index.ts b/x-pack/legacy/plugins/uptime/public/state/effects/index.ts index e9b15e010c2bbc..92802f2e0c84ad 100644 --- a/x-pack/legacy/plugins/uptime/public/state/effects/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/effects/index.ts @@ -5,8 +5,8 @@ */ import { fork } from 'redux-saga/effects'; -import { fetchMonitorDetailsSaga } from './monitor'; +import { fetchMonitorDetailsEffect } from './monitor'; -export function* rootSaga() { - yield fork(fetchMonitorDetailsSaga); +export function* rootEffect() { + yield fork(fetchMonitorDetailsEffect); } diff --git a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts index a842a0cb69c982..529b9041c90933 100644 --- a/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/effects/monitor.ts @@ -11,10 +11,10 @@ import { FETCH_MONITOR_DETAILS_SUCCESS, FETCH_MONITOR_DETAILS_FAIL, } from '../actions/monitor'; -import { fetchMonitorDetails } from '../api/monitor'; +import { fetchMonitorDetails } from '../api'; import { getBasePath } from '../selectors'; -function* monitorDetailsSaga(action: Action) { +function* monitorDetailsEffect(action: Action) { const monitorId: string = action.payload; try { const basePath = yield select(getBasePath); @@ -25,6 +25,6 @@ function* monitorDetailsSaga(action: Action) { } } -export function* fetchMonitorDetailsSaga() { - yield takeLatest(FETCH_MONITOR_DETAILS, monitorDetailsSaga); +export function* fetchMonitorDetailsEffect() { + yield takeLatest(FETCH_MONITOR_DETAILS, monitorDetailsEffect); } diff --git a/x-pack/legacy/plugins/uptime/public/state/index.ts b/x-pack/legacy/plugins/uptime/public/state/index.ts index d33339e80b620e..01cffb636d33ca 100644 --- a/x-pack/legacy/plugins/uptime/public/state/index.ts +++ b/x-pack/legacy/plugins/uptime/public/state/index.ts @@ -7,7 +7,7 @@ import { compose, createStore, applyMiddleware } from 'redux'; import createSagaMiddleware from 'redux-saga'; import { rootReducer } from './reducers'; -import { rootSaga } from './effects'; +import { rootEffect } from './effects'; const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose; @@ -17,4 +17,4 @@ export const store = createStore(rootReducer, composeEnhancers(applyMiddleware(s export type AppState = ReturnType; -sagaMW.run(rootSaga); +sagaMW.run(rootEffect); From 2e43ebfb7c9b70c27cd1fe8a78cf0ceab5f7fe61 Mon Sep 17 00:00:00 2001 From: shahzad Date: Tue, 12 Nov 2019 18:10:10 +0100 Subject: [PATCH 29/35] updated snaps --- .../monitor_list_drawer.test.tsx.snap | 14 ++++++++++++-- .../monitor_status_list.test.tsx.snap | 18 ++++++++---------- 2 files changed, 20 insertions(+), 12 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap index 5e7b59d42cf9da..627e7915de254f 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -24,7 +24,12 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there are - Actions + @@ -94,7 +99,12 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there is o - Actions + diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap index bede44c773c325..3c9fecd261bdc3 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap @@ -15,11 +15,10 @@ exports[`MonitorStatusList component renders checks 1`] = ` -

- Some heartbeat instances do not have a location defined. - - to your heartbeat configuration. -

+ Some heartbeat instances do not have a location defined. + + + to your heartbeat configuration. `; @@ -39,11 +38,10 @@ exports[`MonitorStatusList component renders null in place of child status with -

- Some heartbeat instances do not have a location defined. - - to your heartbeat configuration. -

+ Some heartbeat instances do not have a location defined. + + + to your heartbeat configuration. `; From 2565c7969499ffee952aa7e3e2d09114085283cb Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 13 Nov 2019 02:18:57 +0100 Subject: [PATCH 30/35] update snaps --- .../monitor_list_drawer.test.tsx.snap | 28 ------------------- .../monitor_list_drawer.tsx | 12 +------- 2 files changed, 1 insertion(+), 39 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap index 627e7915de254f..80e064e25e1a5e 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_list_drawer.test.tsx.snap @@ -18,20 +18,6 @@ exports[`MonitorListDrawer component renders a MonitorListDrawer when there are /> - - - - - - - - - - - - - - - From 3d5486f68137ca71faaab70fcf210820747a229c Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 18 Nov 2019 22:39:15 +0100 Subject: [PATCH 31/35] improve code formatting --- .../filter_group/filter_popover.tsx | 2 +- .../functional/monitor_list/index.ts | 1 + .../__tests__/monitor_status_row.test.tsx | 31 +++++++++++ .../monitor_list/monitor_list_drawer/index.ts | 1 + .../monitor_status_list.tsx | 51 +++++------------- .../monitor_status_row.tsx | 53 +++++++++++++++++++ .../uptime/public/state/reducers/monitor.ts | 5 +- 7 files changed, 103 insertions(+), 41 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_row.test.tsx create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx index 6bb6e51fe59bb3..6e73090782b042 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/filter_group/filter_popover.tsx @@ -9,7 +9,7 @@ import React, { useState, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; import { UptimeFilterButton } from './uptime_filter_button'; import { toggleSelectedItems } from './toggle_selected_item'; -import { LocationLink } from '../monitor_list/monitor_list_drawer/location_link'; +import { LocationLink } from '../monitor_list'; export interface FilterPopoverProps { fieldName: string; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/index.ts b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/index.ts index 717e66e4dbe1a5..a83330a7a3a0b9 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/index.ts +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/index.ts @@ -6,3 +6,4 @@ export { MonitorList } from './monitor_list'; export { Criteria, Pagination } from './types'; +export { LocationLink } from './monitor_list_drawer'; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_row.test.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_row.test.tsx new file mode 100644 index 00000000000000..0353d0197f7f70 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/monitor_status_row.test.tsx @@ -0,0 +1,31 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { shallowWithIntl } from 'test_utils/enzyme_helpers'; +import React from 'react'; +import { MonitorStatusRow } from '../monitor_status_row'; + +describe('MonitorStatusRow component', () => { + let locationNames: Set; + + beforeEach(() => { + locationNames = new Set(['Berlin', 'Islamabad', 'London']); + }); + + it('renders status row when status is up', () => { + const component = shallowWithIntl( + + ); + expect(component).toMatchSnapshot(); + }); + + it('renders status row when status is down', () => { + const component = shallowWithIntl( + + ); + expect(component).toMatchSnapshot(); + }); +}); diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts index dc8e7bca865a85..73fb07db60de8c 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/index.ts @@ -5,3 +5,4 @@ */ export { MonitorListDrawer } from './monitor_list_drawer'; +export { LocationLink } from './location_link'; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index a86db618bf4605..34ba6ecec8edbf 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -4,13 +4,13 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { useContext } from 'react'; +import React from 'react'; import { get } from 'lodash'; -import { EuiHealth, EuiSpacer, EuiCallOut } from '@elastic/eui'; +import { EuiCallOut } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { Check } from '../../../../../common/graphql/types'; -import { UptimeSettingsContext } from '../../../../contexts'; import { LocationLink } from './location_link'; +import { MonitorStatusRow } from './monitor_status_row'; interface MonitorStatusListProps { /** @@ -19,56 +19,33 @@ interface MonitorStatusListProps { checks: Check[]; } -export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { - const { - colors: { success, danger }, - } = useContext(UptimeSettingsContext); +export const UP = 'up'; +export const DOWN = 'down'; +export const UNNAMED_LOCATION = 'unnamed-location'; +export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { const upChecks: Set = new Set(); const downChecks: Set = new Set(); - const UN_NAMED_LOCATION = 'unnamed-location'; - checks.forEach((check: Check) => { - let location = get(check, 'observer.geo.name', UN_NAMED_LOCATION); - - if (location === null) { - location = UN_NAMED_LOCATION; - } + // Doing this way because name is either string or null, get() default value only works on undefined value + const location = get(check, 'observer.geo.name', null) || UNNAMED_LOCATION; - if (check.monitor.status === 'up') { + if (check.monitor.status === UP) { upChecks.add(location); - } else if (check.monitor.status === 'down') { + } else if (check.monitor.status === DOWN) { downChecks.add(location); } }); // if monitor is down in one dns, it will be considered down so removing it from up list - const absUpChecks: Set = new Set([...upChecks].filter(item => !downChecks.has(item))); - const displayMonitorStatus = (checksList: Set, color: string, titleTxt: string) => { - let checkListArray = [...checksList]; - // If un-named location exists, move it to end - if (checksList.has(UN_NAMED_LOCATION)) { - checkListArray = checkListArray.filter(item => item !== UN_NAMED_LOCATION); - checkListArray.push(UN_NAMED_LOCATION); - } - - return ( - <> - - {titleTxt} in {checkListArray.map((location, index) => (index ? ', ' : '') + location)} - - - - ); - }; return ( <> - {downChecks.size > 0 && displayMonitorStatus(downChecks, danger, 'Down')} - {absUpChecks.size > 0 && displayMonitorStatus(upChecks, success, 'Up')} - {(downChecks.has(UN_NAMED_LOCATION) || upChecks.has(UN_NAMED_LOCATION)) && ( + + + {(downChecks.has(UNNAMED_LOCATION) || upChecks.has(UNNAMED_LOCATION)) && ( {i18n.translate('xpack.uptime.monitorList.drawer.missingLocation.description', { defaultMessage: `Some heartbeat instances do not have a location defined.`, diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx new file mode 100644 index 00000000000000..5a20be266eef15 --- /dev/null +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx @@ -0,0 +1,53 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React, { useContext } from 'react'; +import { EuiHealth, EuiSpacer } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; +import { UptimeSettingsContext } from '../../../../contexts'; +import { UNNAMED_LOCATION, UP } from './monitor_status_list'; + +interface MonitorStatusRowProps { + /** + * Recent List of checks performed on monitor + */ + locationNames: Set; + /** + * Monitor status for this of locations + */ + status: string; +} + +export const MonitorStatusRow = ({ locationNames, status }: MonitorStatusRowProps) => { + const { + colors: { success, danger }, + } = useContext(UptimeSettingsContext); + + const color = status === UP ? success : danger; + + let checkListArray = [...locationNames]; + // If un-named location exists, move it to end + if (locationNames.has(UNNAMED_LOCATION)) { + checkListArray = checkListArray.filter(item => item !== UNNAMED_LOCATION); + checkListArray.push(UNNAMED_LOCATION); + } + + return locationNames.size > 0 ? ( + <> + + {status === UP + ? i18n.translate('xpack.uptime.monitorList.drawer.locations.statusUp', { + defaultMessage: `Up in `, + }) + : i18n.translate('xpack.uptime.monitorList.drawer.locations.statusDown', { + defaultMessage: `Down in `, + })} + {checkListArray.map((location, index) => (index ? ', ' : '') + location)} + + + + ) : null; +}; diff --git a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts index 310ab2a97d4836..4cacb6f8cab9e4 100644 --- a/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts +++ b/x-pack/legacy/plugins/uptime/public/state/reducers/monitor.ts @@ -32,13 +32,12 @@ export function monitorReducer(state = initialState, action: MonitorActionTypes) loading: true, }; case FETCH_MONITOR_DETAILS_SUCCESS: - const monitorDetails = action.payload; - const { monitorId } = monitorDetails; + const { monitorId } = action.payload; return { ...state, monitorDetailsList: { ...state.monitorDetailsList, - [monitorId]: monitorDetails, + [monitorId]: action.payload, }, loading: false, }; From 6b8e052ef3d9bdd2a701112ec0b04d72227ad55a Mon Sep 17 00:00:00 2001 From: shahzad Date: Mon, 18 Nov 2019 22:41:42 +0100 Subject: [PATCH 32/35] update snaps --- .../monitor_status_list.test.tsx.snap | 40 ++++++++++--------- .../monitor_status_row.test.tsx.snap | 33 +++++++++++++++ 2 files changed, 55 insertions(+), 18 deletions(-) create mode 100644 x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_row.test.tsx.snap diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap index 3c9fecd261bdc3..dbd7bf86ef3cae 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap @@ -2,15 +2,17 @@ exports[`MonitorStatusList component renders checks 1`] = ` - - Down - in - unnamed-location - - + - - Down - in - unnamed-location - - + + + Down in + Berlin + , Islamabad + , London + + + +`; + +exports[`MonitorStatusRow component renders status row when status is up 1`] = ` + + + Down in + Berlin + , Islamabad + , London + + + +`; From a523f496d565956092d9812e626a28c41972dcc4 Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 20 Nov 2019 16:24:18 +0100 Subject: [PATCH 33/35] updated translation formatting !! --- .../monitor_status_list.tsx | 14 ++++---- .../monitor_status_row.tsx | 32 ++++++++++++------- 2 files changed, 27 insertions(+), 19 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx index 34ba6ecec8edbf..82e415cd5e8aef 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_list.tsx @@ -7,7 +7,7 @@ import React from 'react'; import { get } from 'lodash'; import { EuiCallOut } from '@elastic/eui'; -import { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; import { Check } from '../../../../../common/graphql/types'; import { LocationLink } from './location_link'; import { MonitorStatusRow } from './monitor_status_row'; @@ -47,13 +47,11 @@ export const MonitorStatusList = ({ checks }: MonitorStatusListProps) => { {(downChecks.has(UNNAMED_LOCATION) || upChecks.has(UNNAMED_LOCATION)) && ( - {i18n.translate('xpack.uptime.monitorList.drawer.missingLocation.description', { - defaultMessage: `Some heartbeat instances do not have a location defined.`, - })} - {' '} - {i18n.translate('xpack.uptime.monitorList.drawer.missingLocation.toLocationDocsLink', { - defaultMessage: `to your heartbeat configuration.`, - })} + }} + /> )} diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx index 5a20be266eef15..abd42dd085ad8c 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx @@ -6,7 +6,7 @@ import React, { useContext } from 'react'; import { EuiHealth, EuiSpacer } from '@elastic/eui'; -import { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; import { UptimeSettingsContext } from '../../../../contexts'; import { UNNAMED_LOCATION, UP } from './monitor_status_list'; @@ -35,19 +35,29 @@ export const MonitorStatusRow = ({ locationNames, status }: MonitorStatusRowProp checkListArray.push(UNNAMED_LOCATION); } - return locationNames.size > 0 ? ( + if (locationNames.size === 0) { + return null; + } + + const locations = checkListArray.join(', '); + return ( <> - {status === UP - ? i18n.translate('xpack.uptime.monitorList.drawer.locations.statusUp', { - defaultMessage: `Up in `, - }) - : i18n.translate('xpack.uptime.monitorList.drawer.locations.statusDown', { - defaultMessage: `Down in `, - })} - {checkListArray.map((location, index) => (index ? ', ' : '') + location)} + {status === UP ? ( + + ) : ( + + )} - ) : null; + ); }; From 37332b075924167397a2c3ed0b543e006f20fc43 Mon Sep 17 00:00:00 2001 From: shahzad Date: Wed, 20 Nov 2019 22:55:34 +0100 Subject: [PATCH 34/35] update snaps --- .../monitor_status_list.test.tsx.snap | 26 +++++++++++++------ .../monitor_status_row.test.tsx.snap | 26 +++++++++++++------ 2 files changed, 36 insertions(+), 16 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap index dbd7bf86ef3cae..94162a19a2daac 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_list.test.tsx.snap @@ -17,10 +17,15 @@ exports[`MonitorStatusList component renders checks 1`] = ` - Some heartbeat instances do not have a location defined. - - - to your heartbeat configuration. + , + } + } + /> `; @@ -42,10 +47,15 @@ exports[`MonitorStatusList component renders null in place of child status with - Some heartbeat instances do not have a location defined. - - - to your heartbeat configuration. + , + } + } + /> `; diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_row.test.tsx.snap b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_row.test.tsx.snap index 61b40100c64861..e2caf6f718728e 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_row.test.tsx.snap +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/__tests__/__snapshots__/monitor_status_row.test.tsx.snap @@ -5,10 +5,15 @@ exports[`MonitorStatusRow component renders status row when status is down 1`] = - Down in - Berlin - , Islamabad - , London + - Down in - Berlin - , Islamabad - , London + Date: Thu, 21 Nov 2019 16:59:12 +0100 Subject: [PATCH 35/35] update i18n --- .../monitor_list/monitor_list_drawer/monitor_status_row.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx index abd42dd085ad8c..90aa887a783568 100644 --- a/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx +++ b/x-pack/legacy/plugins/uptime/public/components/functional/monitor_list/monitor_list_drawer/monitor_status_row.tsx @@ -46,13 +46,13 @@ export const MonitorStatusRow = ({ locationNames, status }: MonitorStatusRowProp {status === UP ? ( ) : ( )}