From 3436b35d2faeb9026a84fe3c778294214dd3f519 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Mon, 30 Aug 2021 16:07:25 +0900 Subject: [PATCH 01/22] Basic no-data page --- .../monitoring/public/application/index.tsx | 5 +--- .../public/application/pages/no_data.tsx | 29 +++++++++++++++++++ 2 files changed, 30 insertions(+), 4 deletions(-) create mode 100644 x-pack/plugins/monitoring/public/application/pages/no_data.tsx diff --git a/x-pack/plugins/monitoring/public/application/index.tsx b/x-pack/plugins/monitoring/public/application/index.tsx index ed74d342f7a8f..534081ea964c8 100644 --- a/x-pack/plugins/monitoring/public/application/index.tsx +++ b/x-pack/plugins/monitoring/public/application/index.tsx @@ -15,6 +15,7 @@ import { MonitoringStartPluginDependencies } from '../types'; import { GlobalStateProvider } from './global_state_context'; import { createPreserveQueryHistory } from './preserve_query_history'; import { RouteInit } from './route_init'; +import { NoData } from './pages/no_data'; export const renderApp = ( core: CoreStart, @@ -67,10 +68,6 @@ const MonitoringApp: React.FC<{ ); }; -const NoData: React.FC<{}> = () => { - return
No data page
; -}; - const Home: React.FC<{}> = () => { return
Home page (Cluster listing)
; }; diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data.tsx new file mode 100644 index 0000000000000..614cf16f85cf4 --- /dev/null +++ b/x-pack/plugins/monitoring/public/application/pages/no_data.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 + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +import React from 'react'; + +import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +// @ts-ignore +import { NoData as NoDataComponent } from '../../components/no_data'; + +export const NoData: React.FC = () => { + return ( +
+ + + +
HERE GOES THE TIMEPICKER
+ + + +
+ +
+
+ ); +}; From 9d8b938e5f003cf6c4aa1b1166e311c15fc502b7 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 31 Aug 2021 11:07:43 +0900 Subject: [PATCH 02/22] Rename to NoDataPage --- x-pack/plugins/monitoring/public/application/index.tsx | 4 ++-- .../application/pages/{no_data.tsx => no_data_page.tsx} | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) rename x-pack/plugins/monitoring/public/application/pages/{no_data.tsx => no_data_page.tsx} (82%) diff --git a/x-pack/plugins/monitoring/public/application/index.tsx b/x-pack/plugins/monitoring/public/application/index.tsx index 534081ea964c8..37def0c9e6b5a 100644 --- a/x-pack/plugins/monitoring/public/application/index.tsx +++ b/x-pack/plugins/monitoring/public/application/index.tsx @@ -15,7 +15,7 @@ import { MonitoringStartPluginDependencies } from '../types'; import { GlobalStateProvider } from './global_state_context'; import { createPreserveQueryHistory } from './preserve_query_history'; import { RouteInit } from './route_init'; -import { NoData } from './pages/no_data'; +import { NoDataPage } from './pages/no_data_page'; export const renderApp = ( core: CoreStart, @@ -40,7 +40,7 @@ const MonitoringApp: React.FC<{ - + { +export const NoDataPage: React.FC = () => { return (
@@ -22,7 +22,7 @@ export const NoData: React.FC = () => {
- +
); From fe56aafc487e5285c149ad6dc9ba3f01f2ab51bf Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Wed, 1 Sep 2021 23:40:37 +0900 Subject: [PATCH 03/22] Add getData property to pass into EuiSuperDatePicker from pages --- .../public/application/pages/page_template.tsx | 11 +++++++++-- .../monitoring/public/components/shared/toolbar.tsx | 8 ++++++-- 2 files changed, 15 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/page_template.tsx b/x-pack/plugins/monitoring/public/application/pages/page_template.tsx index f40c2d3ec5e50..b461c71112bf8 100644 --- a/x-pack/plugins/monitoring/public/application/pages/page_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/page_template.tsx @@ -22,9 +22,16 @@ interface PageTemplateProps { title: string; pageTitle?: string; tabs?: TabMenuItem[]; + getData?: () => void; } -export const PageTemplate: React.FC = ({ title, pageTitle, tabs, children }) => { +export const PageTemplate: React.FC = ({ + title, + pageTitle, + tabs, + getData, + children, +}) => { useTitle('', title); return ( @@ -53,7 +60,7 @@ export const PageTemplate: React.FC = ({ title, pageTitle, ta - + diff --git a/x-pack/plugins/monitoring/public/components/shared/toolbar.tsx b/x-pack/plugins/monitoring/public/components/shared/toolbar.tsx index 6e45d4d831ec9..a95dd5acf4129 100644 --- a/x-pack/plugins/monitoring/public/components/shared/toolbar.tsx +++ b/x-pack/plugins/monitoring/public/components/shared/toolbar.tsx @@ -9,7 +9,11 @@ import { EuiFlexGroup, EuiFlexItem, EuiSuperDatePicker, OnRefreshChangeProps } f import React, { useContext, useCallback } from 'react'; import { MonitoringTimeContainer } from '../../application/pages/use_monitoring_time'; -export const MonitoringToolbar = () => { +interface MonitoringToolbarProps { + getData?: () => void; +} + +export const MonitoringToolbar: React.FC = ({ getData }) => { const { currentTimerange, handleTimeChange, @@ -45,7 +49,7 @@ export const MonitoringToolbar = () => { start={currentTimerange.from} end={currentTimerange.to} onTimeChange={onTimeChange} - onRefresh={() => {}} + onRefresh={getData} isPaused={isPaused} refreshInterval={refreshInterval} onRefreshChange={onRefreshChange} From bcd68adb45467f17b975e298691ef1308d3a61bb Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Wed, 1 Sep 2021 23:42:08 +0900 Subject: [PATCH 04/22] Wire getData and redirect for no data page --- .../public/application/pages/no_data_page.tsx | 85 +++++++++++++++---- 1 file changed, 70 insertions(+), 15 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx index 4ed204376ee51..7273fa2dcb34b 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx @@ -5,25 +5,80 @@ * 2.0. */ -import React from 'react'; +import React, { useState } from 'react'; +import { Redirect } from 'react-router-dom'; -import { EuiFlexGroup, EuiFlexItem } from '@elastic/eui'; +import { i18n } from '@kbn/i18n'; // @ts-ignore import { NoData } from '../../components/no_data'; +import { PageTemplate } from './page_template'; +import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; +import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../common/constants'; + +export const NoDataPage = () => { + const { services } = useKibana<{ data: any }>(); + const [shouldRedirect, setShouldRedirect] = useState(false); + + const title = i18n.translate('xpack.monitoring.noData.routeTitle', { + defaultMessage: 'Setup Monitoring', + }); + + const url = '../api/monitoring/v1/clusters'; + + const getData = async () => { + const bounds = services.data?.query.timefilter.timefilter.getBounds(); + const min = bounds.min.toISOString(); + const max = bounds.max.toISOString(); + + const codePaths = [CODE_PATH_LICENSE]; + + let catchReason; + + try { + const response = await services.http?.fetch(url, { + method: 'POST', + body: JSON.stringify({ + css: undefined, + timeRange: { + min, + max, + }, + codePaths, + }), + }); + + const clusters = formatClusters(response); + + if (clusters && clusters.length) { + setShouldRedirect(true); + // TODO should this return? + // return clusters; + } + } catch (err) { + if (err && err.status === 503) { + // TODO something useful with the error reason + catchReason = { + property: 'custom', + message: err.message, + }; + } + } + }; -export const NoDataPage: React.FC = () => { return ( -
- - - -
HERE GOES THE TIMEPICKER
- - - -
- -
-
+ + {shouldRedirect ? : } + ); }; + +function formatClusters(clusters: any) { + return clusters.map(formatCluster); +} + +function formatCluster(cluster: any) { + if (cluster.cluster_uuid === STANDALONE_CLUSTER_CLUSTER_UUID) { + cluster.cluster_name = 'Standalone Cluster'; + } + return cluster; +} From 4cf97bf9b2dce7d0deceb1d818cc57498d000a50 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Wed, 8 Sep 2021 15:12:00 +0900 Subject: [PATCH 05/22] Draft port of isLoading & model updating --- .../public/application/pages/no_data_page.tsx | 137 +++++++++++++++--- 1 file changed, 117 insertions(+), 20 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx index 7273fa2dcb34b..256a6dfc36090 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useState } from 'react'; +import React, { useCallback, useContext, useState } from 'react'; import { Redirect } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; @@ -14,25 +14,45 @@ import { NoData } from '../../components/no_data'; import { PageTemplate } from './page_template'; import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../common/constants'; +import { Legacy } from '../../legacy_shims'; +import { GlobalStateContext } from '../global_state_context'; -export const NoDataPage = () => { - const { services } = useKibana<{ data: any }>(); - const [shouldRedirect, setShouldRedirect] = useState(false); +const CODE_PATHS = [CODE_PATH_LICENSE]; +export const NoDataPage = () => { const title = i18n.translate('xpack.monitoring.noData.routeTitle', { defaultMessage: 'Setup Monitoring', }); - const url = '../api/monitoring/v1/clusters'; + const { services } = useKibana<{ data: any }>(); + + const state = useContext(GlobalStateContext); + const clusterUuid = state.cluster_uuid; + const ccs = state.ccs; + + // TODO should we set these? + const [clusters, setClusters] = useState([] as any); + + const [shouldRedirect, setShouldRedirect] = useState(false); + const [isLoading, setIsLoading] = useState(true); + + const model = { + errors: [], // errors can happen from trying to check or set ES settings + checkMessage: null, // message to show while waiting for api response + isLoading: isLoading, // flag for in-progress state of checking for no data reason + isCollectionEnabledUpdating: false, // flags to indicate whether to show a spinner while waiting for ajax + isCollectionEnabledUpdated: false, + isCollectionIntervalUpdating: false, + isCollectionIntervalUpdated: false, + }; - const getData = async () => { + const getPageData = useCallback(async () => { + setIsLoading(true); const bounds = services.data?.query.timefilter.timefilter.getBounds(); const min = bounds.min.toISOString(); const max = bounds.max.toISOString(); - const codePaths = [CODE_PATH_LICENSE]; - - let catchReason; + const url = '../api/monitoring/v1/clusters'; try { const response = await services.http?.fetch(url, { @@ -43,11 +63,13 @@ export const NoDataPage = () => { min, max, }, - codePaths, + codePaths: CODE_PATHS, }), }); const clusters = formatClusters(response); + setIsLoading(false); + console.log('did a refresh from nodatapage'); if (clusters && clusters.length) { setShouldRedirect(true); @@ -55,19 +77,27 @@ export const NoDataPage = () => { // return clusters; } } catch (err) { - if (err && err.status === 503) { - // TODO something useful with the error reason - catchReason = { - property: 'custom', - message: err.message, - }; - } + // TODO something useful with the error reason + // if (err && err.status === 503) { + // catchReason = { + // property: 'custom', + // message: err.data.message, + // }; + // } + console.log(err); } - }; + }, [ccs, clusterUuid, services.data?.query.timefilter.timefilter, services.http, setIsLoading]); + + const { updateModel } = new ModelUpdater(model); + const enabler = new Enabler(updateModel); return ( - - {shouldRedirect ? : } + + {shouldRedirect ? ( + + ) : ( + + )} ); }; @@ -82,3 +112,70 @@ function formatCluster(cluster: any) { } return cluster; } + +// From x-pack/plugins/monitoring/public/lib/elasticsearch_settings/enabler.js +class Enabler { + updateModel: any; + + constructor(updateModel: (properties: any) => void) { + this.updateModel = updateModel; + } + + async enableCollectionInterval() { + try { + this.updateModel({ isCollectionIntervalUpdating: true }); + // TODO actually set it + // await this.$http.put('../api/monitoring/v1/elasticsearch_settings/set/collection_interval'); + this.updateModel({ + isCollectionIntervalUpdated: true, + isCollectionIntervalUpdating: false, + }); + } catch (err) { + this.updateModel({ + errors: err.data, + isCollectionIntervalUpdated: false, + isCollectionIntervalUpdating: false, + }); + } + } + + async enableCollectionEnabled() { + try { + this.updateModel({ isCollectionEnabledUpdating: true }); + // TODO actually set it + // await this.$http.put('../api/monitoring/v1/elasticsearch_settings/set/collection_enabled'); + this.updateModel({ + isCollectionEnabledUpdated: true, + isCollectionEnabledUpdating: false, + }); + } catch (err) { + this.updateModel({ + errors: err.data, + isCollectionEnabledUpdated: false, + isCollectionEnabledUpdating: false, + }); + } + } +} + +// From x-pack/plugins/monitoring/public/views/no_data/model_updater.js +class ModelUpdater { + model: any; + + constructor(model: any) { + this.model = model; + this.updateModel = this.updateModel.bind(this); + } + + updateModel(properties: any) { + const model = this.model; + const keys = Object.keys(properties); + keys.forEach((key) => { + if (Array.isArray(model[key])) { + model[key].push(properties[key]); + } else { + model[key] = properties[key]; + } + }); + } +} From 14cfc03de8c30614d23a512d1ca2dfdbba44a65a Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Wed, 8 Sep 2021 15:14:52 +0900 Subject: [PATCH 06/22] Add todo on handling checkers --- .../monitoring/public/application/pages/no_data_page.tsx | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx index 256a6dfc36090..c033780d4c82b 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx @@ -30,12 +30,13 @@ export const NoDataPage = () => { const clusterUuid = state.cluster_uuid; const ccs = state.ccs; - // TODO should we set these? - const [clusters, setClusters] = useState([] as any); - const [shouldRedirect, setShouldRedirect] = useState(false); const [isLoading, setIsLoading] = useState(true); + // TODO work on porting these checkers over + // const checkers = [new ClusterSettingsChecker($http), new NodeSettingsChecker($http)]; + // await startChecks(checkers, updateModel); + const model = { errors: [], // errors can happen from trying to check or set ES settings checkMessage: null, // message to show while waiting for api response @@ -73,8 +74,6 @@ export const NoDataPage = () => { if (clusters && clusters.length) { setShouldRedirect(true); - // TODO should this return? - // return clusters; } } catch (err) { // TODO something useful with the error reason From 01938a9e9f5dc6b56ffbfec20ba3da9a4c03eeef Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 11:22:24 +0900 Subject: [PATCH 07/22] Switch to model as state object --- .../public/application/pages/no_data_page.tsx | 63 ++++++++----------- 1 file changed, 27 insertions(+), 36 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx index c033780d4c82b..ef42406b23bdc 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx @@ -31,24 +31,38 @@ export const NoDataPage = () => { const ccs = state.ccs; const [shouldRedirect, setShouldRedirect] = useState(false); - const [isLoading, setIsLoading] = useState(true); - // TODO work on porting these checkers over - // const checkers = [new ClusterSettingsChecker($http), new NodeSettingsChecker($http)]; - // await startChecks(checkers, updateModel); - - const model = { + const [model, setModel] = useState({ errors: [], // errors can happen from trying to check or set ES settings checkMessage: null, // message to show while waiting for api response - isLoading: isLoading, // flag for in-progress state of checking for no data reason + isLoading: true, // flag for in-progress state of checking for no data reason isCollectionEnabledUpdating: false, // flags to indicate whether to show a spinner while waiting for ajax isCollectionEnabledUpdated: false, isCollectionIntervalUpdating: false, isCollectionIntervalUpdated: false, + } as any); + + // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js + const updateModel = (properties: any) => { + const updated = { ...model }; + const keys = Object.keys(properties); + + keys.forEach((key) => { + if (Array.isArray(updated[key])) { + updated[key].push(properties[key]); + } else { + updated[key] = properties[key]; + } + }); + setModel(updated); }; + // TODO work on porting these checkers over + // const checkers = [new ClusterSettingsChecker($http), new NodeSettingsChecker($http)]; + // await startChecks(checkers, updateModel); + const getPageData = useCallback(async () => { - setIsLoading(true); + updateModel({ isLoading: true }); const bounds = services.data?.query.timefilter.timefilter.getBounds(); const min = bounds.min.toISOString(); const max = bounds.max.toISOString(); @@ -69,8 +83,8 @@ export const NoDataPage = () => { }); const clusters = formatClusters(response); - setIsLoading(false); - console.log('did a refresh from nodatapage'); + updateModel({ isLoading: false }); + console.log('did a refresh from no data page'); if (clusters && clusters.length) { setShouldRedirect(true); @@ -85,9 +99,8 @@ export const NoDataPage = () => { // } console.log(err); } - }, [ccs, clusterUuid, services.data?.query.timefilter.timefilter, services.http, setIsLoading]); + }, [ccs, clusterUuid, services.data?.query.timefilter.timefilter, services.http]); - const { updateModel } = new ModelUpdater(model); const enabler = new Enabler(updateModel); return ( @@ -131,7 +144,7 @@ class Enabler { }); } catch (err) { this.updateModel({ - errors: err.data, + errors: (err as any).data, isCollectionIntervalUpdated: false, isCollectionIntervalUpdating: false, }); @@ -149,32 +162,10 @@ class Enabler { }); } catch (err) { this.updateModel({ - errors: err.data, + errors: (err as any).data, isCollectionEnabledUpdated: false, isCollectionEnabledUpdating: false, }); } } } - -// From x-pack/plugins/monitoring/public/views/no_data/model_updater.js -class ModelUpdater { - model: any; - - constructor(model: any) { - this.model = model; - this.updateModel = this.updateModel.bind(this); - } - - updateModel(properties: any) { - const model = this.model; - const keys = Object.keys(properties); - keys.forEach((key) => { - if (Array.isArray(model[key])) { - model[key].push(properties[key]); - } else { - model[key] = properties[key]; - } - }); - } -} From cfac638cc392e61231a12bdd20a40bf9eee08966 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 12:22:19 +0900 Subject: [PATCH 08/22] Add checkers --- .../public/application/pages/no_data_page.tsx | 146 ++++++++++++++---- 1 file changed, 120 insertions(+), 26 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx index ef42406b23bdc..a278ba3741012 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx @@ -19,12 +19,23 @@ import { GlobalStateContext } from '../global_state_context'; const CODE_PATHS = [CODE_PATH_LICENSE]; +interface NoDataPageSetupDeps { + http: any; + data: any; +} + +interface SettingsChecker { + message: string; + api: string; + next?: SettingsChecker; +} + export const NoDataPage = () => { const title = i18n.translate('xpack.monitoring.noData.routeTitle', { defaultMessage: 'Setup Monitoring', }); - const { services } = useKibana<{ data: any }>(); + const { services } = useKibana(); const state = useContext(GlobalStateContext); const clusterUuid = state.cluster_uuid; @@ -42,6 +53,17 @@ export const NoDataPage = () => { isCollectionIntervalUpdated: false, } as any); + const checkers: SettingsChecker[] = [ + { + message: 'Checking cluster settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', + }, + { + message: 'Checking nodes settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', + }, + ]; + // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js const updateModel = (properties: any) => { const updated = { ...model }; @@ -57,38 +79,20 @@ export const NoDataPage = () => { setModel(updated); }; - // TODO work on porting these checkers over - // const checkers = [new ClusterSettingsChecker($http), new NodeSettingsChecker($http)]; - // await startChecks(checkers, updateModel); - const getPageData = useCallback(async () => { updateModel({ isLoading: true }); - const bounds = services.data?.query.timefilter.timefilter.getBounds(); - const min = bounds.min.toISOString(); - const max = bounds.max.toISOString(); - - const url = '../api/monitoring/v1/clusters'; try { - const response = await services.http?.fetch(url, { - method: 'POST', - body: JSON.stringify({ - css: undefined, - timeRange: { - min, - max, - }, - codePaths: CODE_PATHS, - }), - }); - - const clusters = formatClusters(response); - updateModel({ isLoading: false }); + const clusters = await getClusters(services); console.log('did a refresh from no data page'); if (clusters && clusters.length) { + updateModel({ isLoading: false }); setShouldRedirect(true); + return; } + + await startChecks(checkers, services.http, updateModel); } catch (err) { // TODO something useful with the error reason // if (err && err.status === 503) { @@ -99,7 +103,7 @@ export const NoDataPage = () => { // } console.log(err); } - }, [ccs, clusterUuid, services.data?.query.timefilter.timefilter, services.http]); + }, [ccs, clusterUuid, services, services.http]); const enabler = new Enabler(updateModel); @@ -114,7 +118,97 @@ export const NoDataPage = () => { ); }; -function formatClusters(clusters: any) { +async function getClusters(services: NoDataPageSetupDeps): Promise { + const url = '../api/monitoring/v1/clusters'; + const bounds = services.data?.query.timefilter.timefilter.getBounds(); + const min = bounds.min.toISOString(); + const max = bounds.max.toISOString(); + + const response = await services.http?.fetch(url, { + method: 'POST', + body: JSON.stringify({ + css: undefined, + timeRange: { + min, + max, + }, + codePaths: CODE_PATHS, + }), + }); + + return formatClusters(response); +} + +// From x-pack/plugins/monitoring/public/lib/elasticsearch_settings/start_checks.js +const mapCheckers = (_checkers: SettingsChecker[]) => { + return _checkers.map((current, checkerIndex) => { + const next = _checkers[checkerIndex + 1]; + if (next !== undefined) { + current.next = next; + } + + return current; + }); +}; + +// From x-pack/plugins/monitoring/public/lib/elasticsearch_settings/start_checks.js +function startChecks( + checkers: SettingsChecker[], + http: { fetch: any }, + updateModel: (properties: any) => void +) { + const runCheck = async (currentChecker: SettingsChecker): Promise => { + updateModel({ checkMessage: currentChecker.message }); + + const { found, reason, error, errorReason } = await executeCheck(currentChecker, http); + + if (error) { + updateModel({ errors: errorReason }); + if (currentChecker.next) { + return runCheck(currentChecker.next); + } + } else if (found) { + return updateModel({ + reason, + isLoading: false, + checkMessage: null, + }); + } else if (currentChecker.next) { + return runCheck(currentChecker.next); + } + + // dead end + updateModel({ + reason: null, + isLoading: false, + checkMessage: null, + }); + }; + + const _checkers = mapCheckers(checkers); + return runCheck(_checkers[0]); +} + +async function executeCheck(checker: SettingsChecker, http: { fetch: any }): Promise { + try { + const response = await http.fetch(checker.api, { + method: 'GET', + }); + const { found, reason } = response; + + return { found, reason }; + } catch (err: any) { + const { data } = err; + + return { + error: true, + found: false, + errorReason: data, + }; + } +} + +function formatClusters(clusters: any): any[] { return clusters.map(formatCluster); } From bac926417a07c0651a12f73b42ed465c1f2bf393 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 14:06:45 +0900 Subject: [PATCH 09/22] Porting enabler --- .../monitoring/public/application/index.tsx | 2 +- .../application/pages/no_data/enabler.ts | 57 ++++++++++++++++++ .../public/application/pages/no_data/index.ts | 8 +++ .../pages/{ => no_data}/no_data_page.tsx | 60 +++---------------- 4 files changed, 74 insertions(+), 53 deletions(-) create mode 100644 x-pack/plugins/monitoring/public/application/pages/no_data/enabler.ts create mode 100644 x-pack/plugins/monitoring/public/application/pages/no_data/index.ts rename x-pack/plugins/monitoring/public/application/pages/{ => no_data}/no_data_page.tsx (77%) diff --git a/x-pack/plugins/monitoring/public/application/index.tsx b/x-pack/plugins/monitoring/public/application/index.tsx index 75be9e1c57e88..73120f5f8b8bd 100644 --- a/x-pack/plugins/monitoring/public/application/index.tsx +++ b/x-pack/plugins/monitoring/public/application/index.tsx @@ -19,7 +19,7 @@ import { ExternalConfigContext, ExternalConfig } from './external_config_context import { createPreserveQueryHistory } from './preserve_query_history'; import { RouteInit } from './route_init'; import { MonitoringTimeContainer } from './pages/use_monitoring_time'; -import { NoDataPage } from './pages/no_data_page'; +import { NoDataPage } from './pages/no_data'; export const renderApp = ( core: CoreStart, diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/enabler.ts b/x-pack/plugins/monitoring/public/application/pages/no_data/enabler.ts new file mode 100644 index 0000000000000..6225e3863b2f7 --- /dev/null +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/enabler.ts @@ -0,0 +1,57 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +// From x-pack/plugins/monitoring/public/lib/elasticsearch_settings/enabler.js +export class Enabler { + http: any; + updateModel: any; + + constructor(http: any, updateModel: (properties: any) => void) { + this.http = http; + this.updateModel = updateModel; + } + + async enableCollectionInterval() { + try { + this.updateModel({ isCollectionIntervalUpdating: true }); + + await this.http.fetch('../api/monitoring/v1/elasticsearch_settings/set/collection_interval', { + method: 'PUT', + }); + this.updateModel({ + isCollectionIntervalUpdated: true, + isCollectionIntervalUpdating: false, + }); + } catch (err) { + this.updateModel({ + errors: (err as any).data, + isCollectionIntervalUpdated: false, + isCollectionIntervalUpdating: false, + }); + } + } + + async enableCollectionEnabled() { + try { + this.updateModel({ isCollectionEnabledUpdating: true }); + await this.http.fetch('../api/monitoring/v1/elasticsearch_settings/set/collection_enabled', { + method: 'PUT', + }); + + this.updateModel({ + isCollectionEnabledUpdated: true, + isCollectionEnabledUpdating: false, + }); + } catch (err) { + this.updateModel({ + errors: (err as any).data, + isCollectionEnabledUpdated: false, + isCollectionEnabledUpdating: false, + }); + } + } +} diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/index.ts b/x-pack/plugins/monitoring/public/application/pages/no_data/index.ts new file mode 100644 index 0000000000000..7fa176d0e6adf --- /dev/null +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/index.ts @@ -0,0 +1,8 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License + * 2.0; you may not use this file except in compliance with the Elastic License + * 2.0. + */ + +export { NoDataPage } from './no_data_page'; diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx similarity index 77% rename from x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx rename to x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index a278ba3741012..59db65f47e60a 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -10,12 +10,13 @@ import { Redirect } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; // @ts-ignore -import { NoData } from '../../components/no_data'; -import { PageTemplate } from './page_template'; -import { useKibana } from '../../../../../../src/plugins/kibana_react/public'; -import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../common/constants'; -import { Legacy } from '../../legacy_shims'; -import { GlobalStateContext } from '../global_state_context'; +import { NoData } from '../../../components/no_data'; +import { PageTemplate } from '../page_template'; +import { useKibana } from '../../../../../../../src/plugins/kibana_react/public'; +import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../../common/constants'; +import { Legacy } from '../../../legacy_shims'; +import { GlobalStateContext } from '../../global_state_context'; +import { Enabler } from './enabler'; const CODE_PATHS = [CODE_PATH_LICENSE]; @@ -105,7 +106,7 @@ export const NoDataPage = () => { } }, [ccs, clusterUuid, services, services.http]); - const enabler = new Enabler(updateModel); + const enabler = new Enabler(services.http, updateModel); return ( @@ -218,48 +219,3 @@ function formatCluster(cluster: any) { } return cluster; } - -// From x-pack/plugins/monitoring/public/lib/elasticsearch_settings/enabler.js -class Enabler { - updateModel: any; - - constructor(updateModel: (properties: any) => void) { - this.updateModel = updateModel; - } - - async enableCollectionInterval() { - try { - this.updateModel({ isCollectionIntervalUpdating: true }); - // TODO actually set it - // await this.$http.put('../api/monitoring/v1/elasticsearch_settings/set/collection_interval'); - this.updateModel({ - isCollectionIntervalUpdated: true, - isCollectionIntervalUpdating: false, - }); - } catch (err) { - this.updateModel({ - errors: (err as any).data, - isCollectionIntervalUpdated: false, - isCollectionIntervalUpdating: false, - }); - } - } - - async enableCollectionEnabled() { - try { - this.updateModel({ isCollectionEnabledUpdating: true }); - // TODO actually set it - // await this.$http.put('../api/monitoring/v1/elasticsearch_settings/set/collection_enabled'); - this.updateModel({ - isCollectionEnabledUpdated: true, - isCollectionEnabledUpdating: false, - }); - } catch (err) { - this.updateModel({ - errors: (err as any).data, - isCollectionEnabledUpdated: false, - isCollectionEnabledUpdating: false, - }); - } - } -} From 4aac00b34e46308ccf2af300c12beec1d5dee866 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 14:17:01 +0900 Subject: [PATCH 10/22] Fix build checks --- .../public/application/pages/no_data/no_data_page.tsx | 9 +-------- 1 file changed, 1 insertion(+), 8 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 59db65f47e60a..2126d04131325 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -37,11 +37,6 @@ export const NoDataPage = () => { }); const { services } = useKibana(); - - const state = useContext(GlobalStateContext); - const clusterUuid = state.cluster_uuid; - const ccs = state.ccs; - const [shouldRedirect, setShouldRedirect] = useState(false); const [model, setModel] = useState({ @@ -85,7 +80,6 @@ export const NoDataPage = () => { try { const clusters = await getClusters(services); - console.log('did a refresh from no data page'); if (clusters && clusters.length) { updateModel({ isLoading: false }); @@ -102,9 +96,8 @@ export const NoDataPage = () => { // message: err.data.message, // }; // } - console.log(err); } - }, [ccs, clusterUuid, services, services.http]); + }, [services, services.http, checkers, updateModel]); const enabler = new Enabler(services.http, updateModel); From dd5d735870354acb99f2696027bcfb85407bae18 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 16:08:46 +0900 Subject: [PATCH 11/22] Attempting to smooth out enablement --- .../pages/no_data/no_data_page.tsx | 66 ++++++++++--------- 1 file changed, 36 insertions(+), 30 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 2126d04131325..1a7f5067f06f4 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback, useContext, useState } from 'react'; +import React, { useCallback, useState } from 'react'; import { Redirect } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; @@ -15,7 +15,6 @@ import { PageTemplate } from '../page_template'; import { useKibana } from '../../../../../../../src/plugins/kibana_react/public'; import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../../common/constants'; import { Legacy } from '../../../legacy_shims'; -import { GlobalStateContext } from '../../global_state_context'; import { Enabler } from './enabler'; const CODE_PATHS = [CODE_PATH_LICENSE]; @@ -31,6 +30,17 @@ interface SettingsChecker { next?: SettingsChecker; } +const checkers: SettingsChecker[] = [ + { + message: 'Checking cluster settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', + }, + { + message: 'Checking nodes settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', + }, +]; + export const NoDataPage = () => { const title = i18n.translate('xpack.monitoring.noData.routeTitle', { defaultMessage: 'Setup Monitoring', @@ -49,45 +59,41 @@ export const NoDataPage = () => { isCollectionIntervalUpdated: false, } as any); - const checkers: SettingsChecker[] = [ - { - message: 'Checking cluster settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', - }, - { - message: 'Checking nodes settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', - }, - ]; - // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js - const updateModel = (properties: any) => { - const updated = { ...model }; - const keys = Object.keys(properties); - - keys.forEach((key) => { - if (Array.isArray(updated[key])) { - updated[key].push(properties[key]); - } else { - updated[key] = properties[key]; - } - }); - setModel(updated); - }; + const updateModel = useCallback( + (properties: any) => { + setModel((model: any) => { + const updated = { ...model }; + const keys = Object.keys(properties); + + keys.forEach((key) => { + if (Array.isArray(updated[key])) { + updated[key].push(properties[key]); + } else { + updated[key] = properties[key]; + } + }); + + return updated; + }); + }, + [setModel] + ); const getPageData = useCallback(async () => { - updateModel({ isLoading: true }); - try { const clusters = await getClusters(services); if (clusters && clusters.length) { - updateModel({ isLoading: false }); + // updateModel({ isLoading: false }); setShouldRedirect(true); return; } + // TODO this check might be required for internal collection enablement to work smoothly + // if (!model.isCollectionEnabledUpdating && !model.isCollectionIntervalUpdating) { await startChecks(checkers, services.http, updateModel); + //} } catch (err) { // TODO something useful with the error reason // if (err && err.status === 503) { @@ -97,7 +103,7 @@ export const NoDataPage = () => { // }; // } } - }, [services, services.http, checkers, updateModel]); + }, [services, checkers, updateModel]); const enabler = new Enabler(services.http, updateModel); From 6efd0c62df4a643395e7c3a73036df948b1bae0e Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Fri, 10 Sep 2021 16:28:08 +0900 Subject: [PATCH 12/22] Clean up CI errors --- .../pages/no_data/no_data_page.tsx | 29 +++++++++---------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 1a7f5067f06f4..c22774f737846 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -30,17 +30,6 @@ interface SettingsChecker { next?: SettingsChecker; } -const checkers: SettingsChecker[] = [ - { - message: 'Checking cluster settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', - }, - { - message: 'Checking nodes settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', - }, -]; - export const NoDataPage = () => { const title = i18n.translate('xpack.monitoring.noData.routeTitle', { defaultMessage: 'Setup Monitoring', @@ -59,11 +48,22 @@ export const NoDataPage = () => { isCollectionIntervalUpdated: false, } as any); + const checkers: SettingsChecker[] = [ + { + message: 'Checking cluster settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', + }, + { + message: 'Checking nodes settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', + }, + ]; + // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js const updateModel = useCallback( (properties: any) => { - setModel((model: any) => { - const updated = { ...model }; + setModel((previousModel: any) => { + const updated = { ...previousModel }; const keys = Object.keys(properties); keys.forEach((key) => { @@ -93,7 +93,6 @@ export const NoDataPage = () => { // TODO this check might be required for internal collection enablement to work smoothly // if (!model.isCollectionEnabledUpdating && !model.isCollectionIntervalUpdating) { await startChecks(checkers, services.http, updateModel); - //} } catch (err) { // TODO something useful with the error reason // if (err && err.status === 503) { @@ -103,7 +102,7 @@ export const NoDataPage = () => { // }; // } } - }, [services, checkers, updateModel]); + }, [services, updateModel]); const enabler = new Enabler(services.http, updateModel); From dccaaa75d56a7715671314161dac4b529ceaa475 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 05:34:34 +0000 Subject: [PATCH 13/22] Fix breadcrumbs --- .../application/pages/no_data/no_data_page.tsx | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index c22774f737846..c6f5f27328c94 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback, useState } from 'react'; +import React, { useCallback, useContext, useEffect, useState } from 'react'; import { Redirect } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; @@ -16,6 +16,7 @@ import { useKibana } from '../../../../../../../src/plugins/kibana_react/public' import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../../common/constants'; import { Legacy } from '../../../legacy_shims'; import { Enabler } from './enabler'; +import { BreadcrumbContainer } from '../../hooks/use_breadcrumbs'; const CODE_PATHS = [CODE_PATH_LICENSE]; @@ -48,6 +49,16 @@ export const NoDataPage = () => { isCollectionIntervalUpdated: false, } as any); + const { update: updateBreadcrumbs } = useContext(BreadcrumbContainer.Context); + updateBreadcrumbs([ + { + 'data-test-subj': 'breadcrumbClusters', + text: 'Clusters', + href: '#/home', + ignoreGlobalState: true, + } + ]); + const checkers: SettingsChecker[] = [ { message: 'Checking cluster settings API on production cluster', From 91832210b3ad98fa9dc84d6823738c6d7b6df4c9 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 05:41:30 +0000 Subject: [PATCH 14/22] Fix linter warning --- .../public/application/pages/no_data/no_data_page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index c6f5f27328c94..a290ba5bdd4b6 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -113,7 +113,7 @@ export const NoDataPage = () => { // }; // } } - }, [services, updateModel]); + }, [checkers, services, updateModel]); const enabler = new Enabler(services.http, updateModel); From 0156e3c38e3de01148e797976083ba921c15c343 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 05:57:27 +0000 Subject: [PATCH 15/22] Fix checkers dependency (I hope) --- .../pages/no_data/no_data_page.tsx | 29 +++++++++---------- 1 file changed, 14 insertions(+), 15 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index a290ba5bdd4b6..9649d8a66ca32 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -31,6 +31,17 @@ interface SettingsChecker { next?: SettingsChecker; } +const clusterCheckers: SettingsChecker[] = [ + { + message: 'Checking cluster settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', + }, + { + message: 'Checking nodes settings API on production cluster', + api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', + }, +]; + export const NoDataPage = () => { const title = i18n.translate('xpack.monitoring.noData.routeTitle', { defaultMessage: 'Setup Monitoring', @@ -56,19 +67,8 @@ export const NoDataPage = () => { text: 'Clusters', href: '#/home', ignoreGlobalState: true, - } - ]); - - const checkers: SettingsChecker[] = [ - { - message: 'Checking cluster settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', - }, - { - message: 'Checking nodes settings API on production cluster', - api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', }, - ]; + ]); // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js const updateModel = useCallback( @@ -96,14 +96,13 @@ export const NoDataPage = () => { const clusters = await getClusters(services); if (clusters && clusters.length) { - // updateModel({ isLoading: false }); setShouldRedirect(true); return; } // TODO this check might be required for internal collection enablement to work smoothly // if (!model.isCollectionEnabledUpdating && !model.isCollectionIntervalUpdating) { - await startChecks(checkers, services.http, updateModel); + await startChecks(clusterCheckers, services.http, updateModel); } catch (err) { // TODO something useful with the error reason // if (err && err.status === 503) { @@ -113,7 +112,7 @@ export const NoDataPage = () => { // }; // } } - }, [checkers, services, updateModel]); + }, [services, updateModel]); const enabler = new Enabler(services.http, updateModel); From 2cf800506ce384972649f730d8dbeb99bc665f95 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 06:06:56 +0000 Subject: [PATCH 16/22] Hook up catchReason --- .../pages/no_data/no_data_page.tsx | 24 +++++++++++-------- 1 file changed, 14 insertions(+), 10 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 9649d8a66ca32..736214ca4742b 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -92,6 +92,7 @@ export const NoDataPage = () => { ); const getPageData = useCallback(async () => { + let catchReason; try { const clusters = await getClusters(services); @@ -99,18 +100,21 @@ export const NoDataPage = () => { setShouldRedirect(true); return; } + } catch (err) { + if (err && err.status === 503) { + catchReason = { + property: 'custom', + message: err.data.message, + }; + } + } - // TODO this check might be required for internal collection enablement to work smoothly - // if (!model.isCollectionEnabledUpdating && !model.isCollectionIntervalUpdating) { + if (catchReason) { + updateModel({ reason: catchReason }); + } else { + // TODO not sure if we can add this conditional, but might be required for smooth internal collection enablement + // if (!this.isCollectionEnabledUpdating && !this.isCollectionIntervalUpdating) { await startChecks(clusterCheckers, services.http, updateModel); - } catch (err) { - // TODO something useful with the error reason - // if (err && err.status === 503) { - // catchReason = { - // property: 'custom', - // message: err.data.message, - // }; - // } } }, [services, updateModel]); From c8f01b7ed2960084be0bba43c5e552946c74e071 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 06:56:13 +0000 Subject: [PATCH 17/22] Add a stub for react setup mode --- .../monitoring/public/lib/setup_mode.tsx | 26 ++++++++++++------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx index f622f2944a31a..e52ede2d27348 100644 --- a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx +++ b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx @@ -17,6 +17,7 @@ import { SetupModeFeature } from '../../common/enums'; import { ISetupModeContext } from '../components/setup_mode/setup_mode_context'; import * as setupModeReact from '../application/setup_mode/setup_mode'; import { isReactMigrationEnabled } from '../external_config'; +import { toggleSetupMode as toggleReactSetupMode } from '../application/setup_mode/setup_mode'; function isOnPage(hash: string) { return includes(window.location.hash, hash); @@ -159,18 +160,23 @@ export const disableElasticsearchInternalCollection = async () => { }; export const toggleSetupMode = (inSetupMode: boolean) => { - checkAngularState(); + try { + checkAngularState(); - const globalState = angularState.injector.get('globalState'); - setupModeState.enabled = inSetupMode; - globalState.inSetupMode = inSetupMode; - globalState.save(); - setSetupModeMenuItem(); - notifySetupModeDataChange(); + const globalState = angularState.injector.get('globalState'); + setupModeState.enabled = inSetupMode; + globalState.inSetupMode = inSetupMode; + globalState.save(); + setSetupModeMenuItem(); + notifySetupModeDataChange(); - if (inSetupMode) { - // Intentionally do not await this so we don't block UI operations - updateSetupModeData(); + if (inSetupMode) { + // Intentionally do not await this so we don't block UI operations + updateSetupModeData(); + } + } catch (err) { + // TODO figure out how to initSetupModeState from NoDataPage + // toggleReactSetupMode(); } }; From c371ed26e5e4e34c95a6adec4b7f3c6e179e15c9 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 14 Sep 2021 07:43:15 +0000 Subject: [PATCH 18/22] Clean warnings --- .../public/application/pages/no_data/no_data_page.tsx | 2 +- x-pack/plugins/monitoring/public/lib/setup_mode.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 736214ca4742b..7ee83666ca755 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import React, { useCallback, useContext, useEffect, useState } from 'react'; +import React, { useCallback, useContext, useState } from 'react'; import { Redirect } from 'react-router-dom'; import { i18n } from '@kbn/i18n'; diff --git a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx index e52ede2d27348..c7169faeaf069 100644 --- a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx +++ b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx @@ -17,7 +17,7 @@ import { SetupModeFeature } from '../../common/enums'; import { ISetupModeContext } from '../components/setup_mode/setup_mode_context'; import * as setupModeReact from '../application/setup_mode/setup_mode'; import { isReactMigrationEnabled } from '../external_config'; -import { toggleSetupMode as toggleReactSetupMode } from '../application/setup_mode/setup_mode'; +// import { toggleSetupMode as toggleReactSetupMode } from '../application/setup_mode/setup_mode'; function isOnPage(hash: string) { return includes(window.location.hash, hash); From 6b7908ca77feb060b510bd21465c6ed1de74e977 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Wed, 15 Sep 2021 05:46:58 +0000 Subject: [PATCH 19/22] Fix toggleSetupMode by calling initSetupModeState first --- .../pages/no_data/no_data_page.tsx | 5 ++++ .../monitoring/public/lib/setup_mode.tsx | 28 ++++++++----------- 2 files changed, 17 insertions(+), 16 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 7ee83666ca755..e421e53f8520c 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -17,6 +17,8 @@ import { CODE_PATH_LICENSE, STANDALONE_CLUSTER_CLUSTER_UUID } from '../../../../ import { Legacy } from '../../../legacy_shims'; import { Enabler } from './enabler'; import { BreadcrumbContainer } from '../../hooks/use_breadcrumbs'; +import { initSetupModeState } from '../../setup_mode/setup_mode'; +import { GlobalStateContext } from '../../global_state_context'; const CODE_PATHS = [CODE_PATH_LICENSE]; @@ -70,6 +72,9 @@ export const NoDataPage = () => { }, ]); + const globalState = useContext(GlobalStateContext); + initSetupModeState(globalState, services.http); + // From x-pack/plugins/monitoring/public/views/no_data/model_updater.js const updateModel = useCallback( (properties: any) => { diff --git a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx index c7169faeaf069..fca7f94731bc5 100644 --- a/x-pack/plugins/monitoring/public/lib/setup_mode.tsx +++ b/x-pack/plugins/monitoring/public/lib/setup_mode.tsx @@ -17,7 +17,6 @@ import { SetupModeFeature } from '../../common/enums'; import { ISetupModeContext } from '../components/setup_mode/setup_mode_context'; import * as setupModeReact from '../application/setup_mode/setup_mode'; import { isReactMigrationEnabled } from '../external_config'; -// import { toggleSetupMode as toggleReactSetupMode } from '../application/setup_mode/setup_mode'; function isOnPage(hash: string) { return includes(window.location.hash, hash); @@ -160,23 +159,20 @@ export const disableElasticsearchInternalCollection = async () => { }; export const toggleSetupMode = (inSetupMode: boolean) => { - try { - checkAngularState(); + if (isReactMigrationEnabled()) return setupModeReact.toggleSetupMode(inSetupMode); - const globalState = angularState.injector.get('globalState'); - setupModeState.enabled = inSetupMode; - globalState.inSetupMode = inSetupMode; - globalState.save(); - setSetupModeMenuItem(); - notifySetupModeDataChange(); + checkAngularState(); - if (inSetupMode) { - // Intentionally do not await this so we don't block UI operations - updateSetupModeData(); - } - } catch (err) { - // TODO figure out how to initSetupModeState from NoDataPage - // toggleReactSetupMode(); + const globalState = angularState.injector.get('globalState'); + setupModeState.enabled = inSetupMode; + globalState.inSetupMode = inSetupMode; + globalState.save(); + setSetupModeMenuItem(); + notifySetupModeDataChange(); + + if (inSetupMode) { + // Intentionally do not await this so we don't block UI operations + updateSetupModeData(); } }; From 93f866c0499aa252487f300d9227513d9a14fcd8 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 21 Sep 2021 06:52:17 +0000 Subject: [PATCH 20/22] Translating checker strings --- .../public/application/pages/no_data/no_data_page.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index e421e53f8520c..ee1302ddc4f7f 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -35,11 +35,15 @@ interface SettingsChecker { const clusterCheckers: SettingsChecker[] = [ { - message: 'Checking cluster settings API on production cluster', + message: i18n.translate('pack.monitoring.noData.checker.clusterSettings', { + defaultMessage: 'Checking cluster settings API on production cluster', + }), api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', }, { - message: 'Checking nodes settings API on production cluster', + message: i18n.translate('pack.monitoring.noData.checker.nodesSettings', { + defaultMessage: 'Checking nodes settings API on production cluster', + }), api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', }, ]; From 917bf431e452b8461e0715b1c722aa147f43c220 Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 21 Sep 2021 07:05:35 +0000 Subject: [PATCH 21/22] typo on "xpack" --- .../public/application/pages/no_data/no_data_page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index ee1302ddc4f7f..350056e7ddf24 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -35,13 +35,13 @@ interface SettingsChecker { const clusterCheckers: SettingsChecker[] = [ { - message: i18n.translate('pack.monitoring.noData.checker.clusterSettings', { + message: i18n.translate('xpack.monitoring.noData.checker.clusterSettings', { defaultMessage: 'Checking cluster settings API on production cluster', }), api: '../api/monitoring/v1/elasticsearch_settings/check/cluster', }, { - message: i18n.translate('pack.monitoring.noData.checker.nodesSettings', { + message: i18n.translate('xpack.monitoring.noData.checker.nodesSettings', { defaultMessage: 'Checking nodes settings API on production cluster', }), api: '../api/monitoring/v1/elasticsearch_settings/check/nodes', From 398732665a026073f8f6558385a469cec363dc8c Mon Sep 17 00:00:00 2001 From: Mat Schaffer Date: Tue, 21 Sep 2021 14:12:55 +0000 Subject: [PATCH 22/22] Move isCollection/reason check in NoData This replicates how the angular app did selective re-rendering of the react component, but while still being able to render the component. --- .../public/application/pages/no_data/no_data_page.tsx | 2 -- .../plugins/monitoring/public/components/no_data/no_data.js | 4 ++-- 2 files changed, 2 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx index 350056e7ddf24..b05bd783b2ff2 100644 --- a/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/no_data/no_data_page.tsx @@ -121,8 +121,6 @@ export const NoDataPage = () => { if (catchReason) { updateModel({ reason: catchReason }); } else { - // TODO not sure if we can add this conditional, but might be required for smooth internal collection enablement - // if (!this.isCollectionEnabledUpdating && !this.isCollectionIntervalUpdating) { await startChecks(clusterCheckers, services.http, updateModel); } }, [services, updateModel]); diff --git a/x-pack/plugins/monitoring/public/components/no_data/no_data.js b/x-pack/plugins/monitoring/public/components/no_data/no_data.js index 1714ace7ceff9..97bf7cacf53e7 100644 --- a/x-pack/plugins/monitoring/public/components/no_data/no_data.js +++ b/x-pack/plugins/monitoring/public/components/no_data/no_data.js @@ -32,9 +32,9 @@ import { CloudDeployment } from './blurbs'; import { getSafeForExternalLink } from '../../lib/get_safe_for_external_link'; function NoDataMessage(props) { - const { isLoading, reason, checkMessage } = props; + const { isLoading, reason, checkMessage, isCollectionEnabledUpdated } = props; - if (isLoading) { + if ((isCollectionEnabledUpdated && !reason) || isLoading) { return ; }