From 1781ca734251cf4085b0ca7d814ea79f879e29cb Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Wed, 22 Jul 2020 16:48:09 +0200 Subject: [PATCH 01/21] [ILM] Convert node allocation component to TS and use hooks --- .../sections/components/learn_more_link.js | 33 ---- .../sections/components/learn_more_link.tsx | 29 +++ .../node_allocation/{index.js => index.ts} | 2 +- .../node_allocation.container.js | 20 --- .../node_allocation/node_allocation.js | 120 ------------- .../node_allocation/node_allocation.tsx | 170 ++++++++++++++++++ .../{form_errors.js => form_errors.tsx} | 20 ++- .../public/application/services/api.ts | 10 +- .../public/application/store/actions/nodes.js | 20 +-- .../application/store/reducers/nodes.js | 8 - .../application/store/selectors/nodes.js | 20 --- 11 files changed, 224 insertions(+), 228 deletions(-) delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.js create mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx rename x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/{index.js => index.ts} (79%) delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.container.js delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js create mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx rename x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/{form_errors.js => form_errors.tsx} (57%) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.js deleted file mode 100644 index 2284b9e39835ce..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.js +++ /dev/null @@ -1,33 +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 from 'react'; -import { EuiLink } from '@elastic/eui'; -import { FormattedMessage } from '@kbn/i18n/react'; - -import { createDocLink } from '../../services/documentation'; - -export class LearnMoreLink extends React.PureComponent { - render() { - const { href, docPath, text } = this.props; - let url; - if (docPath) { - url = createDocLink(docPath); - } else { - url = href; - } - const content = text ? ( - text - ) : ( - - ); - return ( - - {content} - - ); - } -} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx new file mode 100644 index 00000000000000..296942a8216135 --- /dev/null +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.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, { ReactNode } from 'react'; +import { EuiLink } from '@elastic/eui'; +import { FormattedMessage } from '@kbn/i18n/react'; + +import { createDocLink } from '../../services/documentation'; + +interface Props { + docPath: string; + text?: ReactNode; +} + +export const LearnMoreLink: React.FunctionComponent = ({ docPath, text }) => { + const content = text ? ( + text + ) : ( + + ); + return ( + + {content} + + ); +}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.ts similarity index 79% rename from x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.js rename to x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.ts index 9138c6a30cfad0..4675ab46ee501c 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/index.ts @@ -4,4 +4,4 @@ * you may not use this file except in compliance with the Elastic License. */ -export { NodeAllocation } from './node_allocation.container'; +export { NodeAllocation } from './node_allocation'; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.container.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.container.js deleted file mode 100644 index 0ddfcbb940aa48..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.container.js +++ /dev/null @@ -1,20 +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 { connect } from 'react-redux'; - -import { getNodeOptions } from '../../../../store/selectors'; -import { fetchNodes } from '../../../../store/actions'; -import { NodeAllocation as PresentationComponent } from './node_allocation'; - -export const NodeAllocation = connect( - (state) => ({ - nodeOptions: getNodeOptions(state), - }), - { - fetchNodes, - } -)(PresentationComponent); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js deleted file mode 100644 index 95c18787766883..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js +++ /dev/null @@ -1,120 +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, { Component, Fragment } from 'react'; -import { FormattedMessage } from '@kbn/i18n/react'; -import { i18n } from '@kbn/i18n'; -import { EuiSelect, EuiButtonEmpty, EuiCallOut, EuiSpacer, EuiLoadingSpinner } from '@elastic/eui'; - -import { PHASE_NODE_ATTRS } from '../../../../constants'; -import { LearnMoreLink } from '../../../components/learn_more_link'; -import { ErrableFormRow } from '../../form_errors'; - -const learnMoreLinks = ( - - - - - } - docPath="shards-allocation.html" - /> - -); - -export class NodeAllocation extends Component { - componentDidMount() { - this.props.fetchNodes(); - } - - render() { - const { - phase, - setPhaseData, - isShowingErrors, - phaseData, - showNodeDetailsFlyout, - nodeOptions, - errors, - } = this.props; - if (!nodeOptions) { - return ( - - - - - ); - } - if (!nodeOptions.length) { - return ( - - - } - color="warning" - > - - {learnMoreLinks} - - - - - ); - } - - return ( - - - { - setPhaseData(PHASE_NODE_ATTRS, e.target.value); - }} - /> - - {!!phaseData[PHASE_NODE_ATTRS] ? ( - showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} - > - - - ) : ( -
- )} - {learnMoreLinks} - - - ); - } -} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx new file mode 100644 index 00000000000000..5523a46b1606e0 --- /dev/null +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -0,0 +1,170 @@ +/* + * 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 { FormattedMessage } from '@kbn/i18n/react'; +import { i18n } from '@kbn/i18n'; +import { + EuiSelect, + EuiButtonEmpty, + EuiCallOut, + EuiSpacer, + EuiLoadingSpinner, + EuiButton, +} from '@elastic/eui'; + +import { PHASE_NODE_ATTRS } from '../../../../constants'; +import { LearnMoreLink } from '../../../components/learn_more_link'; +import { ErrableFormRow } from '../../form_errors'; +import { useLoadNodes } from '../../../../services/api'; + +interface Props { + phase: string; + setPhaseData: (dataKey: string, value: any) => void; + showNodeDetailsFlyout: (nodeAttrs: any) => void; + errors: any; + phaseData: any; + isShowingErrors: boolean; +} + +const learnMoreLinks = ( + + + + + } + docPath="shards-allocation.html" + /> + +); + +export const NodeAllocation: React.FunctionComponent = ({ + phase, + setPhaseData, + showNodeDetailsFlyout, + errors, + phaseData, + isShowingErrors, +}) => { + const { isLoading, data: nodes, error, sendRequest } = useLoadNodes(); + + if (isLoading) { + return ( + + + + + ); + } + + if (error) { + return ( + + + } + color="warning" + > + + + + + + + + ); + } + + let nodeOptions = Object.keys(nodes).map((attrs) => ({ + text: `${attrs} (${nodes[attrs].length})`, + value: attrs, + })); + + nodeOptions.sort((a, b) => a.value.localeCompare(b.value)); + if (nodeOptions.length) { + nodeOptions = [ + { text: "Default allocation (don't use attributes)", value: '' }, + ...nodeOptions, + ]; + } + if (!nodeOptions.length) { + return ( + + + } + color="warning" + > + + {learnMoreLinks} + + + + + ); + } + + return ( + + + { + setPhaseData(PHASE_NODE_ATTRS, e.target.value); + }} + /> + + {!!phaseData[PHASE_NODE_ATTRS] ? ( + showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} + > + + + ) : ( +
+ )} + {learnMoreLinks} + + + ); +}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.tsx similarity index 57% rename from x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.js rename to x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.tsx index 28ebad209ad967..a3278b6c231b94 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/form_errors.tsx @@ -4,10 +4,22 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { cloneElement, Children, Fragment } from 'react'; -import { EuiFormRow } from '@elastic/eui'; +import React, { cloneElement, Children, Fragment, ReactElement } from 'react'; +import { EuiFormRow, EuiFormRowProps } from '@elastic/eui'; -export const ErrableFormRow = ({ errorKey, isShowingErrors, errors, children, ...rest }) => { +type Props = EuiFormRowProps & { + errorKey: string; + isShowingErrors: boolean; + errors: Record; +}; + +export const ErrableFormRow: React.FunctionComponent = ({ + errorKey, + isShowingErrors, + errors, + children, + ...rest +}) => { return ( 0} @@ -16,7 +28,7 @@ export const ErrableFormRow = ({ errorKey, isShowingErrors, errors, children, .. > {Children.map(children, (child) => - cloneElement(child, { + cloneElement(child as ReactElement, { isInvalid: isShowingErrors && errors[errorKey].length > 0, }) )} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/services/api.ts b/x-pack/plugins/index_lifecycle_management/public/application/services/api.ts index 30c341baa61946..8838caa960b0c9 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/services/api.ts +++ b/x-pack/plugins/index_lifecycle_management/public/application/services/api.ts @@ -21,9 +21,13 @@ interface GenericObject { [key: string]: any; } -export async function loadNodes() { - return await sendGet(`nodes/list`); -} +export const useLoadNodes = () => { + return useRequest({ + path: `nodes/list`, + method: 'get', + initialData: [], + }); +}; export async function loadNodeDetails(selectedNodeAttrs: string) { return await sendGet(`nodes/${selectedNodeAttrs}/details`); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js index f2520abc7a4410..0b4026f019210b 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js @@ -6,30 +6,12 @@ import { i18n } from '@kbn/i18n'; import { createAction } from 'redux-actions'; import { showApiError } from '../../services/api_errors'; -import { loadNodes, loadNodeDetails } from '../../services/api'; +import { loadNodeDetails } from '../../services/api'; import { SET_SELECTED_NODE_ATTRS } from '../../constants'; export const setSelectedNodeAttrs = createAction(SET_SELECTED_NODE_ATTRS); export const setSelectedPrimaryShardCount = createAction('SET_SELECTED_PRIMARY_SHARED_COUNT'); export const setSelectedReplicaCount = createAction('SET_SELECTED_REPLICA_COUNT'); -export const fetchedNodes = createAction('FETCHED_NODES'); -let fetchingNodes = false; -export const fetchNodes = () => async (dispatch) => { - try { - if (!fetchingNodes) { - fetchingNodes = true; - const nodes = await loadNodes(); - dispatch(fetchedNodes(nodes)); - } - } catch (err) { - const title = i18n.translate('xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage', { - defaultMessage: 'Error loading node attribute information', - }); - showApiError(err, title); - } finally { - fetchingNodes = false; - } -}; export const fetchedNodeDetails = createAction( 'FETCHED_NODE_DETAILS', diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js index 443b257b6fb7ed..06d173e9901f8c 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js @@ -6,7 +6,6 @@ import { handleActions } from 'redux-actions'; import { - fetchedNodes, setSelectedNodeAttrs, setSelectedPrimaryShardCount, setSelectedReplicaCount, @@ -24,13 +23,6 @@ const defaultState = { export const nodes = handleActions( { - [fetchedNodes](state, { payload: nodes }) { - return { - ...state, - isLoading: false, - nodes, - }; - }, [fetchedNodeDetails](state, { payload }) { const { selectedNodeAttrs, details } = payload; return { diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js index 63d849217f59ed..561681bf7d93d9 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js @@ -4,28 +4,8 @@ * you may not use this file except in compliance with the Elastic License. */ -import { createSelector } from 'reselect'; - export const getNodes = (state) => state.nodes.nodes; -export const getNodeOptions = createSelector([(state) => getNodes(state)], (nodes) => { - if (!nodes) { - return null; - } - - const options = Object.keys(nodes).map((attrs) => ({ - text: `${attrs} (${nodes[attrs].length})`, - value: attrs, - })); - - options.sort((a, b) => a.value.localeCompare(b.value)); - if (options.length) { - return [{ text: "Default allocation (don't use attributes)", value: '' }, ...options]; - } else { - return options; - } -}); - export const getSelectedPrimaryShardCount = (state) => state.nodes.selectedPrimaryShardCount; export const getSelectedReplicaCount = (state) => From 99582744404fb7325d2f8934d5bde8bf7f7128dd Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 23 Jul 2020 16:30:10 +0200 Subject: [PATCH 02/21] [ILM] Fix jest tests --- .../__jest__/components/edit_policy.test.js | 152 +++++++++++------- 1 file changed, 97 insertions(+), 55 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js index c249a45fe8ed22..9cb5f0010189a9 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js @@ -5,6 +5,7 @@ */ import React from 'react'; +import { act } from 'react-dom/test-utils'; import moment from 'moment-timezone'; import { Provider } from 'react-redux'; // axios has a $http like interface so using it to simulate $http @@ -14,7 +15,7 @@ import sinon from 'sinon'; import { findTestSubject } from '@elastic/eui/lib/test'; import { mountWithIntl } from '../../../../test_utils/enzyme_helpers'; -import { fetchedPolicies, fetchedNodes } from '../../public/application/store/actions'; +import { fetchedPolicies } from '../../public/application/store/actions'; import { indexLifecycleManagementStore } from '../../public/application/store'; import { EditPolicy } from '../../public/application/sections/edit_policy'; import { init as initHttp } from '../../public/application/services/http'; @@ -37,9 +38,15 @@ import { initHttp(axios.create({ adapter: axiosXhrAdapter }), (path) => path); initUiMetric({ reportUiStats: () => {} }); -initNotification({ - addDanger: () => {}, -}); +initNotification( + { + addDanger: () => {}, + addSuccess: () => {}, + }, + { + add: () => {}, + } +); let server; let store; @@ -70,9 +77,11 @@ for (let i = 0; i < 105; i++) { window.scrollTo = jest.fn(); window.TextEncoder = null; let component; -const activatePhase = (rendered, phase) => { +const activatePhase = async (rendered, phase) => { const testSubject = `enablePhaseSwitch-${phase}`; - findTestSubject(rendered, testSubject).simulate('click'); + await act(async () => { + await findTestSubject(rendered, testSubject).simulate('click'); + }); rendered.update(); }; const expectedErrorMessages = (rendered, expectedErrorMessages) => { @@ -120,7 +129,7 @@ describe('edit policy', () => { store = indexLifecycleManagementStore(); component = ( - + {} }} /> ); store.dispatch(fetchedPolicies(policies)); @@ -242,48 +251,57 @@ describe('edit policy', () => { }); }); describe('warm phase', () => { - test('should show number required error when trying to save empty warm phase', () => { + beforeEach(() => { + server.respondImmediately = true; + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({}), + ]); + }); + + test('should show number required error when trying to save empty warm phase', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', ''); save(rendered); expectedErrorMessages(rendered, [numberRequiredMessage]); }); - test('should allow 0 for phase timing', () => { + test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', 0); save(rendered); expectedErrorMessages(rendered, []); }); - test('should show positive number required error when trying to save warm phase with -1 for after', () => { + test('should show positive number required error when trying to save warm phase with -1 for after', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', -1); save(rendered); expectedErrorMessages(rendered, [positiveNumberRequiredMessage]); }); - test('should show positive number required error when trying to save warm phase with -1 for index priority', () => { + test('should show positive number required error when trying to save warm phase with -1 for index priority', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', 1); setPhaseIndexPriority(rendered, 'warm', -1); save(rendered); expectedErrorMessages(rendered, [positiveNumberRequiredMessage]); }); - test('should show positive number required above zero error when trying to save warm phase with 0 for shrink', () => { + test('should show positive number required above zero error when trying to save warm phase with 0 for shrink', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); findTestSubject(rendered, 'shrinkSwitch').simulate('click'); rendered.update(); setPhaseAfter(rendered, 'warm', 1); @@ -293,11 +311,11 @@ describe('edit policy', () => { save(rendered); expectedErrorMessages(rendered, [positiveNumbersAboveZeroErrorMessage]); }); - test('should show positive number above 0 required error when trying to save warm phase with -1 for shrink', () => { + test('should show positive number above 0 required error when trying to save warm phase with -1 for shrink', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', 1); findTestSubject(rendered, 'shrinkSwitch').simulate('click'); rendered.update(); @@ -307,11 +325,11 @@ describe('edit policy', () => { save(rendered); expectedErrorMessages(rendered, [positiveNumbersAboveZeroErrorMessage]); }); - test('should show positive number required above zero error when trying to save warm phase with 0 for force merge', () => { + test('should show positive number required above zero error when trying to save warm phase with 0 for force merge', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', 1); findTestSubject(rendered, 'forceMergeSwitch').simulate('click'); rendered.update(); @@ -321,11 +339,11 @@ describe('edit policy', () => { save(rendered); expectedErrorMessages(rendered, [positiveNumbersAboveZeroErrorMessage]); }); - test('should show positive number above 0 required error when trying to save warm phase with -1 for force merge', () => { + test('should show positive number above 0 required error when trying to save warm phase with -1 for force merge', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); setPhaseAfter(rendered, 'warm', 1); findTestSubject(rendered, 'forceMergeSwitch').simulate('click'); rendered.update(); @@ -335,43 +353,51 @@ describe('edit policy', () => { save(rendered); expectedErrorMessages(rendered, [positiveNumbersAboveZeroErrorMessage]); }); - test('should show spinner for node attributes input when loading', () => { + test('should show spinner for node attributes input when loading', async () => { + server.respondImmediately = false; const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeTruthy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); expect(getNodeAttributeSelect(rendered, 'warm').exists()).toBeFalsy(); }); - test('should show warning instead of node attributes input when none exist', () => { - store.dispatch(fetchedNodes({})); + test('should show warning instead of node attributes input when none exist', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeTruthy(); expect(getNodeAttributeSelect(rendered, 'warm').exists()).toBeFalsy(); }); - test('should show node attributes input when attributes exist', () => { - store.dispatch(fetchedNodes({ 'attribute:true': ['node1'] })); + test('should show node attributes input when attributes exist', async () => { + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({ 'attribute:true': ['node1'] }), + ]); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); const nodeAttributesSelect = getNodeAttributeSelect(rendered, 'warm'); expect(nodeAttributesSelect.exists()).toBeTruthy(); expect(nodeAttributesSelect.find('option').length).toBe(2); }); - test('should show view node attributes link when attribute selected and show flyout when clicked', () => { - store.dispatch(fetchedNodes({ 'attribute:true': ['node1'] })); + test('should show view node attributes link when attribute selected and show flyout when clicked', async () => { + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({ 'attribute:true': ['node1'] }), + ]); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'warm'); + await activatePhase(rendered, 'warm'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); const nodeAttributesSelect = getNodeAttributeSelect(rendered, 'warm'); @@ -388,61 +414,77 @@ describe('edit policy', () => { }); }); describe('cold phase', () => { - test('should allow 0 for phase timing', () => { + beforeEach(() => { + server.respondImmediately = true; + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({}), + ]); + }); + test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); setPhaseAfter(rendered, 'cold', 0); save(rendered); expectedErrorMessages(rendered, []); }); - test('should show positive number required error when trying to save cold phase with -1 for after', () => { + test('should show positive number required error when trying to save cold phase with -1 for after', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); setPhaseAfter(rendered, 'cold', -1); save(rendered); expectedErrorMessages(rendered, [positiveNumberRequiredMessage]); }); - test('should show spinner for node attributes input when loading', () => { + test('should show spinner for node attributes input when loading', async () => { + server.respondImmediately = false; const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeTruthy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); expect(getNodeAttributeSelect(rendered, 'cold').exists()).toBeFalsy(); }); - test('should show warning instead of node attributes input when none exist', () => { - store.dispatch(fetchedNodes({})); + test('should show warning instead of node attributes input when none exist', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeTruthy(); expect(getNodeAttributeSelect(rendered, 'cold').exists()).toBeFalsy(); }); - test('should show node attributes input when attributes exist', () => { - store.dispatch(fetchedNodes({ 'attribute:true': ['node1'] })); + test('should show node attributes input when attributes exist', async () => { + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({ 'attribute:true': ['node1'] }), + ]); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); const nodeAttributesSelect = getNodeAttributeSelect(rendered, 'cold'); expect(nodeAttributesSelect.exists()).toBeTruthy(); expect(nodeAttributesSelect.find('option').length).toBe(2); }); - test('should show view node attributes link when attribute selected and show flyout when clicked', () => { - store.dispatch(fetchedNodes({ 'attribute:true': ['node1'] })); + test('should show view node attributes link when attribute selected and show flyout when clicked', async () => { + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify({ 'attribute:true': ['node1'] }), + ]); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); expect(rendered.find('.euiLoadingSpinner').exists()).toBeFalsy(); expect(rendered.find('.euiCallOut--warning').exists()).toBeFalsy(); const nodeAttributesSelect = getNodeAttributeSelect(rendered, 'cold'); @@ -457,11 +499,11 @@ describe('edit policy', () => { rendered.update(); expect(rendered.find('.euiFlyout').exists()).toBeTruthy(); }); - test('should show positive number required error when trying to save with -1 for index priority', () => { + test('should show positive number required error when trying to save with -1 for index priority', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'cold'); + await activatePhase(rendered, 'cold'); setPhaseAfter(rendered, 'cold', 1); setPhaseIndexPriority(rendered, 'cold', -1); save(rendered); @@ -469,20 +511,20 @@ describe('edit policy', () => { }); }); describe('delete phase', () => { - test('should allow 0 for phase timing', () => { + test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'delete'); + await activatePhase(rendered, 'delete'); setPhaseAfter(rendered, 'delete', 0); save(rendered); expectedErrorMessages(rendered, []); }); - test('should show positive number required error when trying to save delete phase with -1 for after', () => { + test('should show positive number required error when trying to save delete phase with -1 for after', async () => { const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); - activatePhase(rendered, 'delete'); + await activatePhase(rendered, 'delete'); setPhaseAfter(rendered, 'delete', -1); save(rendered); expectedErrorMessages(rendered, [positiveNumberRequiredMessage]); From 4486489faff92ca0c2c0df1e92328dece0cf87c2 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 23 Jul 2020 18:48:25 +0200 Subject: [PATCH 03/21] [ILM] Fix i18n check --- x-pack/plugins/translations/translations/ja-JP.json | 1 - x-pack/plugins/translations/translations/zh-CN.json | 1 - 2 files changed, 2 deletions(-) diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index 846330146cf07c..9bab6f1fb6bd74 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -7089,7 +7089,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "ノード属性なしではシャードの割り当てをコントロールできません。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml でノード属性が構成されていません", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "ノード属性の詳細の読み込み中にエラーが発生しました", - "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "ノード属性の情報の読み込み中にエラーが発生しました", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字が必要です。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "コールドフェーズのタイミング", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "コールドフェーズのタイミングの単位", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index 477858d2e74d10..ec561c88702f7a 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -7094,7 +7094,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "没有节点属性，将无法控制分片分配。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml 中未配置任何节点属性", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "加载节点属性详细信息时出错", - "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "加载节点属性信息时出错", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字必填。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "冷阶段计时", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "冷阶段计时单位", From fc0633ecb10b927a4334d00695a3e2b0d03e79af Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Wed, 29 Jul 2020 18:14:09 +0200 Subject: [PATCH 04/21] [ILM] Implement code review suggestions --- .../__jest__/components/edit_policy.test.js | 69 ++++++------------- .../components/helpers/http_requests.ts | 48 +++++++++++++ .../sections/components/learn_more_link.tsx | 2 +- .../node_allocation/node_allocation.tsx | 30 ++++---- 4 files changed, 89 insertions(+), 60 deletions(-) create mode 100644 x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js index 23be702055da3f..c6da347ed8cfef 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js @@ -11,9 +11,15 @@ import { Provider } from 'react-redux'; // axios has a $http like interface so using it to simulate $http import axios from 'axios'; import axiosXhrAdapter from 'axios/lib/adapters/xhr'; -import sinon from 'sinon'; import { findTestSubject } from '@elastic/eui/lib/test'; +import { init as initHttpRequests } from './helpers/http_requests'; +import { + notificationServiceMock, + fatalErrorsServiceMock, +} from '../../../../../src/core/public/mocks'; +import { usageCollectionPluginMock } from '../../../../../src/plugins/usage_collection/public/mocks'; + import { mountWithIntl } from '../../../../test_utils/enzyme_helpers'; import { fetchedPolicies } from '../../public/application/store/actions'; import { indexLifecycleManagementStore } from '../../public/application/store'; @@ -34,21 +40,17 @@ import { policyNameMustBeDifferentErrorMessage, policyNameAlreadyUsedErrorMessage, maximumDocumentsRequiredMessage, -} from '../../public/application/store/selectors/lifecycle'; +} from '../../public/application/store/selectors'; -initHttp(axios.create({ adapter: axiosXhrAdapter }), (path) => path); -initUiMetric({ reportUiStats: () => {} }); +initHttp(axios.create({ adapter: axiosXhrAdapter })); +initUiMetric(usageCollectionPluginMock.createSetupContract()); initNotification( - { - addDanger: () => {}, - addSuccess: () => {}, - }, - { - add: () => {}, - } + notificationServiceMock.createSetupContract().toasts, + fatalErrorsServiceMock.createSetupContract() ); let server; +let httpRequestsMockHelpers; let store; const policy = { phases: { @@ -133,12 +135,9 @@ describe('edit policy', () => { ); store.dispatch(fetchedPolicies(policies)); - server = sinon.fakeServer.create(); - server.respondWith('/api/index_lifecycle_management/policies', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify(policies), - ]); + ({ server, httpRequestsMockHelpers } = initHttpRequests()); + + httpRequestsMockHelpers.setPoliciesResponse(policies); }); describe('top level form', () => { test('should show error when trying to save empty form', () => { @@ -253,11 +252,7 @@ describe('edit policy', () => { describe('warm phase', () => { beforeEach(() => { server.respondImmediately = true; - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({}), - ]); + httpRequestsMockHelpers.setNodesListResponse({}); }); test('should show number required error when trying to save empty warm phase', async () => { @@ -373,11 +368,7 @@ describe('edit policy', () => { expect(getNodeAttributeSelect(rendered, 'warm').exists()).toBeFalsy(); }); test('should show node attributes input when attributes exist', async () => { - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({ 'attribute:true': ['node1'] }), - ]); + httpRequestsMockHelpers.setNodesListResponse({ 'attribute:true': ['node1'] }); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); @@ -389,11 +380,7 @@ describe('edit policy', () => { expect(nodeAttributesSelect.find('option').length).toBe(2); }); test('should show view node attributes link when attribute selected and show flyout when clicked', async () => { - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({ 'attribute:true': ['node1'] }), - ]); + httpRequestsMockHelpers.setNodesListResponse({ 'attribute:true': ['node1'] }); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); @@ -416,11 +403,7 @@ describe('edit policy', () => { describe('cold phase', () => { beforeEach(() => { server.respondImmediately = true; - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({}), - ]); + httpRequestsMockHelpers.setNodesListResponse({}); }); test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); @@ -460,11 +443,7 @@ describe('edit policy', () => { expect(getNodeAttributeSelect(rendered, 'cold').exists()).toBeFalsy(); }); test('should show node attributes input when attributes exist', async () => { - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({ 'attribute:true': ['node1'] }), - ]); + httpRequestsMockHelpers.setNodesListResponse({ 'attribute:true': ['node1'] }); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); @@ -476,11 +455,7 @@ describe('edit policy', () => { expect(nodeAttributesSelect.find('option').length).toBe(2); }); test('should show view node attributes link when attribute selected and show flyout when clicked', async () => { - server.respondWith('/api/index_lifecycle_management/nodes/list', [ - 200, - { 'Content-Type': 'application/json' }, - JSON.stringify({ 'attribute:true': ['node1'] }), - ]); + httpRequestsMockHelpers.setNodesListResponse({ 'attribute:true': ['node1'] }); const rendered = mountWithIntl(component); noRollover(rendered); setPolicyName(rendered, 'mypolicy'); diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts new file mode 100644 index 00000000000000..b5c941beef1818 --- /dev/null +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts @@ -0,0 +1,48 @@ +/* + * 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 sinon, { SinonFakeServer } from 'sinon'; + +type HttpResponse = Record | any[]; + +const registerHttpRequestMockHelpers = (server: SinonFakeServer) => { + const setPoliciesResponse = (response: HttpResponse = []) => { + server.respondWith('/api/index_lifecycle_management/policies', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify(response), + ]); + }; + + const setNodesListResponse = (response: HttpResponse = []) => { + server.respondWith('/api/index_lifecycle_management/nodes/list', [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify(response), + ]); + }; + + return { + setPoliciesResponse, + setNodesListResponse, + }; +}; + +export const init = () => { + const server = sinon.fakeServer.create(); + + // Define default response for unhandled requests. + // We make requests to APIs which don't impact the component under test, e.g. UI metric telemetry, + // and we can mock them all with a 200 instead of mocking each one individually. + server.respondWith([200, {}, 'DefaultSinonMockServerResponse']); + + const httpRequestsMockHelpers = registerHttpRequestMockHelpers(server); + + return { + server, + httpRequestsMockHelpers, + }; +}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx index 296942a8216135..623ff982438d7a 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/components/learn_more_link.tsx @@ -22,7 +22,7 @@ export const LearnMoreLink: React.FunctionComponent = ({ docPath, text }) ); return ( - + {content} ); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 5523a46b1606e0..df7721bcc7daee 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -30,10 +30,9 @@ interface Props { isShowingErrors: boolean; } -const learnMoreLinks = ( +const learnMoreLink = ( - - + = ({ } if (error) { + const { error: errorString, statusCode, message } = error; return ( = ({ defaultMessage="Unable to load node attributes." /> } - color="warning" + color="danger" > - +

+ {statusCode}: {errorString}. {message} +

+ @@ -99,7 +102,12 @@ export const NodeAllocation: React.FunctionComponent = ({ nodeOptions.sort((a, b) => a.value.localeCompare(b.value)); if (nodeOptions.length) { nodeOptions = [ - { text: "Default allocation (don't use attributes)", value: '' }, + { + text: i18n.translate('xpack.indexLifecycleMgmt.editPolicy.defaultNodeAllocation', { + defaultMessage: "Default allocation (don't use attributes)", + }), + value: '', + }, ...nodeOptions, ]; } @@ -120,7 +128,7 @@ export const NodeAllocation: React.FunctionComponent = ({ id="xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription" defaultMessage="You can't control shard allocation without node attributes." /> - {learnMoreLinks} + {learnMoreLink} @@ -160,10 +168,8 @@ export const NodeAllocation: React.FunctionComponent = ({ defaultMessage="View a list of nodes attached to this configuration" /> - ) : ( -
- )} - {learnMoreLinks} + ) : null} + {learnMoreLink} ); From 1ccf12fac3e40449f61804d065e7d0c42b7f83a4 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 30 Jul 2020 15:49:11 +0200 Subject: [PATCH 05/21] [ILM] Fix type check, docs link and button maxWidth in NodeAllocation component --- .../components/node_allocation/node_allocation.tsx | 3 ++- .../public/application/services/http.ts | 7 ++++--- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index df7721bcc7daee..0325996524d472 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -40,7 +40,7 @@ const learnMoreLink = ( defaultMessage="Learn about shard allocation" /> } - docPath="shards-allocation.html" + docPath="modules-cluster.html#cluster-shard-allocation-settings" /> ); @@ -158,6 +158,7 @@ export const NodeAllocation: React.FunctionComponent = ({ {!!phaseData[PHASE_NODE_ATTRS] ? ( { - return _useRequest(_httpClient, { ...config, path: getFullPath(config.path) }); +export const useRequest = ( + config: UseRequestConfig +) => { + return _useRequest(_httpClient, { ...config, path: getFullPath(config.path) }); }; From 739be48412dbabf0acf824740dcd9d80e6829730 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 30 Jul 2020 18:03:15 +0200 Subject: [PATCH 06/21] Fix internaliation error --- x-pack/plugins/translations/translations/ja-JP.json | 1 - x-pack/plugins/translations/translations/zh-CN.json | 1 - 2 files changed, 2 deletions(-) diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index d051097615cc4e..0929463bbc9a53 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -5008,7 +5008,6 @@ "xpack.apm.settings.anomaly_detection.legacy_jobs.body": "以前の統合のレガシー機械学習ジョブが見つかりました。これは、APMアプリでは使用されていません。", "xpack.apm.settings.anomaly_detection.legacy_jobs.button": "ジョブの確認", "xpack.apm.settings.anomaly_detection.legacy_jobs.title": "レガシーMLジョブはAPMアプリで使用されていません。", - "xpack.apm.settings.anomaly_detection.license.text": "異常検知を使用するには、Elastic Platinumライセンスのサブスクリプションが必要です。このライセンスがあれば、機械学習を活用して、サービスを監視できます。", "xpack.apm.settings.anomalyDetection": "異常検知", "xpack.apm.settings.anomalyDetection.addEnvironments.cancelButtonText": "キャンセル", "xpack.apm.settings.anomalyDetection.addEnvironments.createJobsButtonText": "ジョブの作成", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index 52495dc89454a9..ba1f8822447b3d 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -5009,7 +5009,6 @@ "xpack.apm.settings.anomaly_detection.legacy_jobs.body": "我们在以前的集成中发现 APM 应用中不再使用的旧版 Machine Learning 作业", "xpack.apm.settings.anomaly_detection.legacy_jobs.button": "复查作业", "xpack.apm.settings.anomaly_detection.legacy_jobs.title": "旧版 ML 作业不再用于 APM 应用", - "xpack.apm.settings.anomaly_detection.license.text": "要使用异常检测，必须订阅 Elastic 白金级许可。使用该许可，您将能够借助 Machine Learning 监测服务。", "xpack.apm.settings.anomalyDetection": "异常检测", "xpack.apm.settings.anomalyDetection.addEnvironments.cancelButtonText": "取消", "xpack.apm.settings.anomalyDetection.addEnvironments.createJobsButtonText": "创建作业", From b3807896bf347a8c34ff92f591691ff7558d0037 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Wed, 29 Jul 2020 15:19:18 +0200 Subject: [PATCH 07/21] [ILM] Convert node details flyout to TS --- .../components/cold_phase/cold_phase.js | 3 - .../node_allocation/node_allocation.js | 33 ++++-- .../node_attrs_details/{index.js => index.ts} | 2 +- .../node_attrs_details.container.js | 18 --- .../node_attrs_details/node_attrs_details.js | 81 ------------- .../node_attrs_details/node_attrs_details.tsx | 106 ++++++++++++++++++ .../components/warm_phase/warm_phase.js | 3 - .../sections/edit_policy/edit_policy.js | 16 --- .../public/application/services/api.ts | 9 +- .../public/application/store/actions/nodes.js | 23 +--- .../application/store/reducers/nodes.js | 18 --- .../application/store/selectors/nodes.js | 14 --- .../translations/translations/ja-JP.json | 1 - .../translations/translations/zh-CN.json | 1 - 14 files changed, 137 insertions(+), 191 deletions(-) rename x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/{index.js => index.ts} (78%) delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.container.js delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js create mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js index d5c0744e5eb070..200bf0e767d9dc 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js @@ -34,7 +34,6 @@ import { SetPriorityInput } from '../set_priority_input'; export class ColdPhase extends PureComponent { static propTypes = { setPhaseData: PropTypes.func.isRequired, - showNodeDetailsFlyout: PropTypes.func.isRequired, isShowingErrors: PropTypes.bool.isRequired, errors: PropTypes.object.isRequired, @@ -42,7 +41,6 @@ export class ColdPhase extends PureComponent { render() { const { setPhaseData, - showNodeDetailsFlyout, phaseData, errors, isShowingErrors, @@ -114,7 +112,6 @@ export class ColdPhase extends PureComponent { @@ -30,20 +31,24 @@ const learnMoreLinks = ( ); export class NodeAllocation extends Component { + constructor(props) { + super(props); + this.state = { + isShowingNodeDetailsFlyout: false, + selectedNodeAttrsForDetails: undefined, + }; + } + componentDidMount() { this.props.fetchNodes(); } + showNodeDetailsFlyout = (selectedNodeAttrsForDetails) => { + this.setState({ isShowingNodeDetailsFlyout: true, selectedNodeAttrsForDetails }); + }; + render() { - const { - phase, - setPhaseData, - isShowingErrors, - phaseData, - showNodeDetailsFlyout, - nodeOptions, - errors, - } = this.props; + const { phase, setPhaseData, isShowingErrors, phaseData, nodeOptions, errors } = this.props; if (!nodeOptions) { return ( @@ -100,9 +105,10 @@ export class NodeAllocation extends Component { {!!phaseData[PHASE_NODE_ATTRS] ? ( showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} + onClick={() => this.showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} > + + {this.state.isShowingNodeDetailsFlyout ? ( + this.setState({ isShowingNodeDetailsFlyout: false })} + /> + ) : null} ); } diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.ts similarity index 78% rename from x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.js rename to x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.ts index 885e965c46c4bf..056d2f2f600f3e 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/index.ts @@ -4,4 +4,4 @@ * you may not use this file except in compliance with the Elastic License. */ -export { NodeAttrsDetails } from './node_attrs_details.container'; +export { NodeAttrsDetails } from './node_attrs_details'; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.container.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.container.js deleted file mode 100644 index ca7c310723b622..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.container.js +++ /dev/null @@ -1,18 +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 { connect } from 'react-redux'; - -import { getNodeDetails } from '../../../../store/selectors'; -import { fetchNodeDetails } from '../../../../store/actions'; -import { NodeAttrsDetails as PresentationComponent } from './node_attrs_details'; - -export const NodeAttrsDetails = connect( - (state, ownProps) => ({ - details: getNodeDetails(state, ownProps.selectedNodeAttrs), - }), - { fetchNodeDetails } -)(PresentationComponent); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js deleted file mode 100644 index 67bc8f0386abfc..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js +++ /dev/null @@ -1,81 +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, { PureComponent } from 'react'; -import PropTypes from 'prop-types'; -import { i18n } from '@kbn/i18n'; -import { FormattedMessage } from '@kbn/i18n/react'; - -import { - EuiFlyoutBody, - EuiFlyout, - EuiTitle, - EuiInMemoryTable, - EuiSpacer, - EuiPortal, -} from '@elastic/eui'; - -export class NodeAttrsDetails extends PureComponent { - static propTypes = { - fetchNodeDetails: PropTypes.func.isRequired, - close: PropTypes.func.isRequired, - - details: PropTypes.array, - selectedNodeAttrs: PropTypes.string.isRequired, - }; - - UNSAFE_componentWillMount() { - this.props.fetchNodeDetails(this.props.selectedNodeAttrs); - } - - render() { - const { selectedNodeAttrs, details, close } = this.props; - - return ( - - - - -

- -

- - - - - - - ); - } -} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx new file mode 100644 index 00000000000000..45c2cd641f7e04 --- /dev/null +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -0,0 +1,106 @@ +/* + * 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 { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; + +import { + EuiFlyoutBody, + EuiFlyout, + EuiTitle, + EuiInMemoryTable, + EuiSpacer, + EuiPortal, + EuiLoadingContent, + EuiCallOut, + EuiButton, +} from '@elastic/eui'; + +import { useLoadNodeDetails } from '../../../../services/api'; + +interface Props { + close: () => void; + selectedNodeAttrs: string; +} + +export const NodeAttrsDetails: React.FunctionComponent = ({ close, selectedNodeAttrs }) => { + const { data, isLoading, error, sendRequest } = useLoadNodeDetails(selectedNodeAttrs); + let content; + if (isLoading) { + content = ; + } else if (error) { + const { statusCode, error: errorString, message } = error; + content = ( + + } + color="danger" + > +

+ {statusCode}: {errorString}. {message} +

+ + + + + ); + } else { + content = ( + + ); + } + return ( + + + + +

+ +

+ + + {content} + + + + ); +}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js index 55aec88c8bcabe..60b5ab4781b6dd 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js @@ -38,7 +38,6 @@ import { MinAgeInput } from '../min_age_input'; export class WarmPhase extends PureComponent { static propTypes = { setPhaseData: PropTypes.func.isRequired, - showNodeDetailsFlyout: PropTypes.func.isRequired, isShowingErrors: PropTypes.bool.isRequired, errors: PropTypes.object.isRequired, @@ -47,7 +46,6 @@ export class WarmPhase extends PureComponent { render() { const { setPhaseData, - showNodeDetailsFlyout, phaseData, errors, isShowingErrors, @@ -152,7 +150,6 @@ export class WarmPhase extends PureComponent { { - this.setState({ isShowingNodeDetailsFlyout: true, selectedNodeAttrsForDetails }); - }; - togglePolicyJsonFlyout = () => { this.setState(({ isShowingPolicyJsonFlyout }) => ({ isShowingPolicyJsonFlyout: !isShowingPolicyJsonFlyout, @@ -291,7 +284,6 @@ export class EditPolicy extends Component { @@ -299,7 +291,6 @@ export class EditPolicy extends Component { @@ -370,13 +361,6 @@ export class EditPolicy extends Component { - {this.state.isShowingNodeDetailsFlyout ? ( - this.setState({ isShowingNodeDetailsFlyout: false })} - /> - ) : null} - {this.state.isShowingPolicyJsonFlyout ? ( { + return useRequest({ + path: `nodes/${selectedNodeAttrs}/details`, + method: 'get', + }); +}; export async function loadIndexTemplates() { return await sendGet(`templates`); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js index f2520abc7a4410..41d82128178cba 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js @@ -6,7 +6,7 @@ import { i18n } from '@kbn/i18n'; import { createAction } from 'redux-actions'; import { showApiError } from '../../services/api_errors'; -import { loadNodes, loadNodeDetails } from '../../services/api'; +import { loadNodes } from '../../services/api'; import { SET_SELECTED_NODE_ATTRS } from '../../constants'; export const setSelectedNodeAttrs = createAction(SET_SELECTED_NODE_ATTRS); @@ -30,24 +30,3 @@ export const fetchNodes = () => async (dispatch) => { fetchingNodes = false; } }; - -export const fetchedNodeDetails = createAction( - 'FETCHED_NODE_DETAILS', - (selectedNodeAttrs, details) => ({ - selectedNodeAttrs, - details, - }) -); -export const fetchNodeDetails = (selectedNodeAttrs) => async (dispatch) => { - let details; - try { - details = await loadNodeDetails(selectedNodeAttrs); - } catch (err) { - const title = i18n.translate('xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage', { - defaultMessage: 'Error loading node attribute details', - }); - showApiError(err, title); - return false; - } - dispatch(fetchedNodeDetails(selectedNodeAttrs, details)); -}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js index 443b257b6fb7ed..adbd126e8c2370 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js @@ -7,10 +7,8 @@ import { handleActions } from 'redux-actions'; import { fetchedNodes, - setSelectedNodeAttrs, setSelectedPrimaryShardCount, setSelectedReplicaCount, - fetchedNodeDetails, } from '../actions/nodes'; const defaultState = { @@ -31,22 +29,6 @@ export const nodes = handleActions( nodes, }; }, - [fetchedNodeDetails](state, { payload }) { - const { selectedNodeAttrs, details } = payload; - return { - ...state, - details: { - ...state.details, - [selectedNodeAttrs]: details, - }, - }; - }, - [setSelectedNodeAttrs](state, { payload: selectedNodeAttrs }) { - return { - ...state, - selectedNodeAttrs, - }; - }, [setSelectedPrimaryShardCount](state, { payload }) { let selectedPrimaryShardCount = parseInt(payload); if (isNaN(selectedPrimaryShardCount)) { diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js index 63d849217f59ed..519c8cf01e565a 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js @@ -30,17 +30,3 @@ export const getSelectedPrimaryShardCount = (state) => state.nodes.selectedPrima export const getSelectedReplicaCount = (state) => state.nodes.selectedReplicaCount !== undefined ? state.nodes.selectedReplicaCount : 1; - -export const getSelectedNodeAttrs = (state) => state.nodes.selectedNodeAttrs; - -export const getNodesFromSelectedNodeAttrs = (state) => { - const nodes = getNodes(state)[getSelectedNodeAttrs(state)]; - if (nodes) { - return nodes.length; - } - return null; -}; - -export const getNodeDetails = (state, selectedNodeAttrs) => { - return state.nodes.details[selectedNodeAttrs]; -}; diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index c81aade2b063ef..a540ffb6b1c1fc 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -8207,7 +8207,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAllocationLabel": "シャードの割当をコントロールするノード属性を選択", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "ノード属性なしではシャードの割り当てをコントロールできません。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml でノード属性が構成されていません", - "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "ノード属性の詳細の読み込み中にエラーが発生しました", "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "ノード属性の情報の読み込み中にエラーが発生しました", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字が必要です。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "コールドフェーズのタイミング", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index aba5adf72c2f83..cc4c39b05e8eb0 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -8209,7 +8209,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAllocationLabel": "选择节点属性来控制分片分配", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "没有节点属性，将无法控制分片分配。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml 中未配置任何节点属性", - "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "加载节点属性详细信息时出错", "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "加载节点属性信息时出错", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字必填。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "冷阶段计时", From 1f76b821859acfcfacaacafbe08f153d2b361391 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 14:05:19 +0200 Subject: [PATCH 08/21] [ILM] Fix useState declaration --- .../node_allocation/node_allocation.js | 133 ------------------ .../node_allocation/node_allocation.tsx | 2 +- 2 files changed, 1 insertion(+), 134 deletions(-) delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js deleted file mode 100644 index 094b4075b366e2..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js +++ /dev/null @@ -1,133 +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, { Component, Fragment } from 'react'; -import { FormattedMessage } from '@kbn/i18n/react'; -import { i18n } from '@kbn/i18n'; -import { EuiSelect, EuiButtonEmpty, EuiCallOut, EuiSpacer, EuiLoadingSpinner } from '@elastic/eui'; - -import { PHASE_NODE_ATTRS } from '../../../../constants'; -import { LearnMoreLink } from '../../../components/learn_more_link'; -import { ErrableFormRow } from '../../form_errors'; -import { NodeAttrsDetails } from '../node_attrs_details'; - -const learnMoreLinks = ( - - - - - } - docPath="shards-allocation.html" - /> - -); - -export class NodeAllocation extends Component { - constructor(props) { - super(props); - this.state = { - isShowingNodeDetailsFlyout: false, - selectedNodeAttrsForDetails: undefined, - }; - } - - componentDidMount() { - this.props.fetchNodes(); - } - - showNodeDetailsFlyout = (selectedNodeAttrsForDetails) => { - this.setState({ isShowingNodeDetailsFlyout: true, selectedNodeAttrsForDetails }); - }; - - render() { - const { phase, setPhaseData, isShowingErrors, phaseData, nodeOptions, errors } = this.props; - if (!nodeOptions) { - return ( - - - - - ); - } - if (!nodeOptions.length) { - return ( - - - } - color="warning" - > - - {learnMoreLinks} - - - - - ); - } - - return ( - - - { - setPhaseData(PHASE_NODE_ATTRS, e.target.value); - }} - /> - - {!!phaseData[PHASE_NODE_ATTRS] ? ( - this.showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} - > - - - ) : ( -
- )} - {learnMoreLinks} - - - {this.state.isShowingNodeDetailsFlyout ? ( - this.setState({ isShowingNodeDetailsFlyout: false })} - /> - ) : null} - - ); - } -} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 841fb26e083f92..e652f9ae0ef11b 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -54,7 +54,7 @@ export const NodeAllocation: React.FunctionComponent = ({ }) => { const { isLoading, data: nodes, error, sendRequest } = useLoadNodes(); - const { selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails } = useState(null); + const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState(null); if (isLoading) { return ( From e9575f4f55e4282ffadbfe5c8eaddcd00deacd83 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 14:07:13 +0200 Subject: [PATCH 09/21] [ILM] Fix useState declaration --- .../components/node_allocation/node_allocation.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index e652f9ae0ef11b..250540b3e7399b 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -54,7 +54,9 @@ export const NodeAllocation: React.FunctionComponent = ({ }) => { const { isLoading, data: nodes, error, sendRequest } = useLoadNodes(); - const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState(null); + const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState( + null + ); if (isLoading) { return ( From 8ad94dcd8937900cd5f9a0cdf4785ffb3f1e7150 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 15:05:34 +0200 Subject: [PATCH 10/21] [ILM] Fix jest test --- .../__jest__/components/edit_policy.test.js | 14 ++++++++++++-- .../__jest__/components/helpers/http_requests.ts | 9 +++++++++ 2 files changed, 21 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js index c6da347ed8cfef..4fe3d5c66696e9 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js @@ -253,6 +253,9 @@ describe('edit policy', () => { beforeEach(() => { server.respondImmediately = true; httpRequestsMockHelpers.setNodesListResponse({}); + httpRequestsMockHelpers.setNodesDetailsResponse('attribute:true', [ + { nodeId: 'testNodeId', stats: { name: 'testNodeName', host: 'testHost' } }, + ]); }); test('should show number required error when trying to save empty warm phase', async () => { @@ -395,7 +398,9 @@ describe('edit policy', () => { rendered.update(); const flyoutButton = findTestSubject(rendered, 'warm-viewNodeDetailsFlyoutButton'); expect(flyoutButton.exists()).toBeTruthy(); - flyoutButton.simulate('click'); + await act(async () => { + await flyoutButton.simulate('click'); + }); rendered.update(); expect(rendered.find('.euiFlyout').exists()).toBeTruthy(); }); @@ -404,6 +409,9 @@ describe('edit policy', () => { beforeEach(() => { server.respondImmediately = true; httpRequestsMockHelpers.setNodesListResponse({}); + httpRequestsMockHelpers.setNodesDetailsResponse('attribute:true', [ + { nodeId: 'testNodeId', stats: { name: 'testNodeName', host: 'testHost' } }, + ]); }); test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); @@ -470,7 +478,9 @@ describe('edit policy', () => { rendered.update(); const flyoutButton = findTestSubject(rendered, 'cold-viewNodeDetailsFlyoutButton'); expect(flyoutButton.exists()).toBeTruthy(); - flyoutButton.simulate('click'); + await act(async () => { + await flyoutButton.simulate('click'); + }); rendered.update(); expect(rendered.find('.euiFlyout').exists()).toBeTruthy(); }); diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts index b5c941beef1818..668cbedbf0c950 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts @@ -25,9 +25,18 @@ const registerHttpRequestMockHelpers = (server: SinonFakeServer) => { ]); }; + const setNodesDetailsResponse = (nodeAttributes: string, response: HttpResponse = []) => { + server.respondWith(`/api/index_lifecycle_management/nodes/${nodeAttributes}/details`, [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify(response), + ]); + }; + return { setPoliciesResponse, setNodesListResponse, + setNodesDetailsResponse, }; }; From 22c6b8694a74a1305e2245aa953c9cdd930dbbf2 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 6 Aug 2020 15:41:50 +0200 Subject: [PATCH 11/21] [ILM] Change error message when unable to load node attributes --- .../components/node_allocation/node_allocation.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 0325996524d472..8c5f68bd5245fd 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -65,7 +65,7 @@ export const NodeAllocation: React.FunctionComponent = ({ } if (error) { - const { error: errorString, statusCode, message } = error; + const { statusCode, message } = error; return ( = ({ color="danger" >

- {statusCode}: {errorString}. {message} + {message} ({statusCode})

Date: Thu, 6 Aug 2020 15:55:04 +0200 Subject: [PATCH 12/21] [ILM] Change error message when unable to load node details --- .../components/node_attrs_details/node_attrs_details.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx index 45c2cd641f7e04..15591ab6468a75 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -33,7 +33,7 @@ export const NodeAttrsDetails: React.FunctionComponent = ({ close, select if (isLoading) { content = ; } else if (error) { - const { statusCode, error: errorString, message } = error; + const { statusCode, message } = error; content = ( = ({ close, select color="danger" >

- {statusCode}: {errorString}. {message} + {message} ({statusCode})

Date: Thu, 6 Aug 2020 16:13:27 +0200 Subject: [PATCH 13/21] [ILM] Delete a period in error callout --- .../edit_policy/components/node_allocation/node_allocation.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 8c5f68bd5245fd..208f6b2aa61312 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -73,7 +73,7 @@ export const NodeAllocation: React.FunctionComponent = ({ title={ } color="danger" From c210d4938c676de7f0699533fc397bcb3608c0ea Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 6 Aug 2020 16:17:44 +0200 Subject: [PATCH 14/21] [ILM] Delete a period in error callout --- .../components/node_attrs_details/node_attrs_details.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx index 15591ab6468a75..6fcbd94dc5e9a9 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -39,7 +39,7 @@ export const NodeAttrsDetails: React.FunctionComponent = ({ close, select title={ } color="danger" From abe230a8e09ec64a07af86a6061a5fce43bc8490 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Wed, 29 Jul 2020 15:19:18 +0200 Subject: [PATCH 15/21] [ILM] Convert node details flyout to TS --- .../components/cold_phase/cold_phase.js | 3 - .../node_allocation/node_allocation.js | 0 .../node_attrs_details/{index.js => index.ts} | 2 +- .../node_attrs_details.container.js | 18 --- .../node_attrs_details/node_attrs_details.js | 81 ------------- .../node_attrs_details/node_attrs_details.tsx | 106 ++++++++++++++++++ .../components/warm_phase/warm_phase.js | 3 - .../sections/edit_policy/edit_policy.js | 16 --- .../public/application/services/api.ts | 9 +- .../public/application/store/actions/nodes.js | 24 ---- .../application/store/reducers/nodes.js | 18 --- .../application/store/selectors/nodes.js | 14 --- .../translations/translations/ja-JP.json | 1 + .../translations/translations/zh-CN.json | 1 + 14 files changed, 115 insertions(+), 181 deletions(-) create mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.js rename x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/{index.js => index.ts} (78%) delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.container.js delete mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js create mode 100644 x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js index d5c0744e5eb070..200bf0e767d9dc 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/cold_phase/cold_phase.js @@ -34,7 +34,6 @@ import { SetPriorityInput } from '../set_priority_input'; export class ColdPhase extends PureComponent { static propTypes = { setPhaseData: PropTypes.func.isRequired, - showNodeDetailsFlyout: PropTypes.func.isRequired, isShowingErrors: PropTypes.bool.isRequired, errors: PropTypes.object.isRequired, @@ -42,7 +41,6 @@ export class ColdPhase extends PureComponent { render() { const { setPhaseData, - showNodeDetailsFlyout, phaseData, errors, isShowingErrors, @@ -114,7 +112,6 @@ export class ColdPhase extends PureComponent { ({ - details: getNodeDetails(state, ownProps.selectedNodeAttrs), - }), - { fetchNodeDetails } -)(PresentationComponent); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js deleted file mode 100644 index 67bc8f0386abfc..00000000000000 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.js +++ /dev/null @@ -1,81 +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, { PureComponent } from 'react'; -import PropTypes from 'prop-types'; -import { i18n } from '@kbn/i18n'; -import { FormattedMessage } from '@kbn/i18n/react'; - -import { - EuiFlyoutBody, - EuiFlyout, - EuiTitle, - EuiInMemoryTable, - EuiSpacer, - EuiPortal, -} from '@elastic/eui'; - -export class NodeAttrsDetails extends PureComponent { - static propTypes = { - fetchNodeDetails: PropTypes.func.isRequired, - close: PropTypes.func.isRequired, - - details: PropTypes.array, - selectedNodeAttrs: PropTypes.string.isRequired, - }; - - UNSAFE_componentWillMount() { - this.props.fetchNodeDetails(this.props.selectedNodeAttrs); - } - - render() { - const { selectedNodeAttrs, details, close } = this.props; - - return ( - - - - -

- -

- - - - - - - ); - } -} diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx new file mode 100644 index 00000000000000..45c2cd641f7e04 --- /dev/null +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -0,0 +1,106 @@ +/* + * 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 { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; + +import { + EuiFlyoutBody, + EuiFlyout, + EuiTitle, + EuiInMemoryTable, + EuiSpacer, + EuiPortal, + EuiLoadingContent, + EuiCallOut, + EuiButton, +} from '@elastic/eui'; + +import { useLoadNodeDetails } from '../../../../services/api'; + +interface Props { + close: () => void; + selectedNodeAttrs: string; +} + +export const NodeAttrsDetails: React.FunctionComponent = ({ close, selectedNodeAttrs }) => { + const { data, isLoading, error, sendRequest } = useLoadNodeDetails(selectedNodeAttrs); + let content; + if (isLoading) { + content = ; + } else if (error) { + const { statusCode, error: errorString, message } = error; + content = ( + + } + color="danger" + > +

+ {statusCode}: {errorString}. {message} +

+ + + + + ); + } else { + content = ( + + ); + } + return ( + + + + +

+ +

+ + + {content} + + + + ); +}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js index 55aec88c8bcabe..60b5ab4781b6dd 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/warm_phase/warm_phase.js @@ -38,7 +38,6 @@ import { MinAgeInput } from '../min_age_input'; export class WarmPhase extends PureComponent { static propTypes = { setPhaseData: PropTypes.func.isRequired, - showNodeDetailsFlyout: PropTypes.func.isRequired, isShowingErrors: PropTypes.bool.isRequired, errors: PropTypes.object.isRequired, @@ -47,7 +46,6 @@ export class WarmPhase extends PureComponent { render() { const { setPhaseData, - showNodeDetailsFlyout, phaseData, errors, isShowingErrors, @@ -152,7 +150,6 @@ export class WarmPhase extends PureComponent { { - this.setState({ isShowingNodeDetailsFlyout: true, selectedNodeAttrsForDetails }); - }; - togglePolicyJsonFlyout = () => { this.setState(({ isShowingPolicyJsonFlyout }) => ({ isShowingPolicyJsonFlyout: !isShowingPolicyJsonFlyout, @@ -291,7 +284,6 @@ export class EditPolicy extends Component { @@ -299,7 +291,6 @@ export class EditPolicy extends Component { @@ -370,13 +361,6 @@ export class EditPolicy extends Component { - {this.state.isShowingNodeDetailsFlyout ? ( - this.setState({ isShowingNodeDetailsFlyout: false })} - /> - ) : null} - {this.state.isShowingPolicyJsonFlyout ? ( { }); }; -export async function loadNodeDetails(selectedNodeAttrs: string) { - return await sendGet(`nodes/${selectedNodeAttrs}/details`); -} +export const useLoadNodeDetails = (selectedNodeAttrs: string) => { + return useRequest({ + path: `nodes/${selectedNodeAttrs}/details`, + method: 'get', + }); +}; export async function loadIndexTemplates() { return await sendGet(`templates`); diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js index 0b4026f019210b..3f1c00db621a75 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/actions/nodes.js @@ -3,33 +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 { i18n } from '@kbn/i18n'; import { createAction } from 'redux-actions'; -import { showApiError } from '../../services/api_errors'; -import { loadNodeDetails } from '../../services/api'; import { SET_SELECTED_NODE_ATTRS } from '../../constants'; export const setSelectedNodeAttrs = createAction(SET_SELECTED_NODE_ATTRS); export const setSelectedPrimaryShardCount = createAction('SET_SELECTED_PRIMARY_SHARED_COUNT'); export const setSelectedReplicaCount = createAction('SET_SELECTED_REPLICA_COUNT'); - -export const fetchedNodeDetails = createAction( - 'FETCHED_NODE_DETAILS', - (selectedNodeAttrs, details) => ({ - selectedNodeAttrs, - details, - }) -); -export const fetchNodeDetails = (selectedNodeAttrs) => async (dispatch) => { - let details; - try { - details = await loadNodeDetails(selectedNodeAttrs); - } catch (err) { - const title = i18n.translate('xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage', { - defaultMessage: 'Error loading node attribute details', - }); - showApiError(err, title); - return false; - } - dispatch(fetchedNodeDetails(selectedNodeAttrs, details)); -}; diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js index 06d173e9901f8c..9abccecdcec56c 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/reducers/nodes.js @@ -6,10 +6,8 @@ import { handleActions } from 'redux-actions'; import { - setSelectedNodeAttrs, setSelectedPrimaryShardCount, setSelectedReplicaCount, - fetchedNodeDetails, } from '../actions/nodes'; const defaultState = { @@ -23,22 +21,6 @@ const defaultState = { export const nodes = handleActions( { - [fetchedNodeDetails](state, { payload }) { - const { selectedNodeAttrs, details } = payload; - return { - ...state, - details: { - ...state.details, - [selectedNodeAttrs]: details, - }, - }; - }, - [setSelectedNodeAttrs](state, { payload: selectedNodeAttrs }) { - return { - ...state, - selectedNodeAttrs, - }; - }, [setSelectedPrimaryShardCount](state, { payload }) { let selectedPrimaryShardCount = parseInt(payload); if (isNaN(selectedPrimaryShardCount)) { diff --git a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js index 561681bf7d93d9..72bfd4b15a78ad 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js +++ b/x-pack/plugins/index_lifecycle_management/public/application/store/selectors/nodes.js @@ -10,17 +10,3 @@ export const getSelectedPrimaryShardCount = (state) => state.nodes.selectedPrima export const getSelectedReplicaCount = (state) => state.nodes.selectedReplicaCount !== undefined ? state.nodes.selectedReplicaCount : 1; - -export const getSelectedNodeAttrs = (state) => state.nodes.selectedNodeAttrs; - -export const getNodesFromSelectedNodeAttrs = (state) => { - const nodes = getNodes(state)[getSelectedNodeAttrs(state)]; - if (nodes) { - return nodes.length; - } - return null; -}; - -export const getNodeDetails = (state, selectedNodeAttrs) => { - return state.nodes.details[selectedNodeAttrs]; -}; diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index c2f180f5268d48..8218904f77df9e 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -8207,6 +8207,7 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "ノード属性なしではシャードの割り当てをコントロールできません。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml でノード属性が構成されていません", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "ノード属性の詳細の読み込み中にエラーが発生しました", + "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "ノード属性の情報の読み込み中にエラーが発生しました", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字が必要です。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "コールドフェーズのタイミング", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "コールドフェーズのタイミングの単位", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index 84c3eab8db9e76..21a42362bcdd3e 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -8209,6 +8209,7 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "没有节点属性，将无法控制分片分配。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml 中未配置任何节点属性", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "加载节点属性详细信息时出错", + "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "加载节点属性信息时出错", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字必填。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "冷阶段计时", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "冷阶段计时单位", From d88cab01e51f9c0ca40db3323dcf7c125ca41670 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 23 Jul 2020 18:48:25 +0200 Subject: [PATCH 16/21] [ILM] Fix i18n check --- x-pack/plugins/translations/translations/ja-JP.json | 1 - x-pack/plugins/translations/translations/zh-CN.json | 1 - 2 files changed, 2 deletions(-) diff --git a/x-pack/plugins/translations/translations/ja-JP.json b/x-pack/plugins/translations/translations/ja-JP.json index 8218904f77df9e..c2f180f5268d48 100644 --- a/x-pack/plugins/translations/translations/ja-JP.json +++ b/x-pack/plugins/translations/translations/ja-JP.json @@ -8207,7 +8207,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "ノード属性なしではシャードの割り当てをコントロールできません。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml でノード属性が構成されていません", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "ノード属性の詳細の読み込み中にエラーが発生しました", - "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "ノード属性の情報の読み込み中にエラーが発生しました", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字が必要です。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "コールドフェーズのタイミング", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "コールドフェーズのタイミングの単位", diff --git a/x-pack/plugins/translations/translations/zh-CN.json b/x-pack/plugins/translations/translations/zh-CN.json index 21a42362bcdd3e..84c3eab8db9e76 100644 --- a/x-pack/plugins/translations/translations/zh-CN.json +++ b/x-pack/plugins/translations/translations/zh-CN.json @@ -8209,7 +8209,6 @@ "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingDescription": "没有节点属性，将无法控制分片分配。", "xpack.indexLifecycleMgmt.editPolicy.nodeAttributesMissingLabel": "elasticsearch.yml 中未配置任何节点属性", "xpack.indexLifecycleMgmt.editPolicy.nodeDetailErrorMessage": "加载节点属性详细信息时出错", - "xpack.indexLifecycleMgmt.editPolicy.nodeInfoErrorMessage": "加载节点属性信息时出错", "xpack.indexLifecycleMgmt.editPolicy.numberRequiredError": "数字必填。", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeLabel": "冷阶段计时", "xpack.indexLifecycleMgmt.editPolicy.phaseCold.minimumAgeUnitsAriaLabel": "冷阶段计时单位", From 03e3972adcd6f0cbc2262af2179583320364beac Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 14:05:19 +0200 Subject: [PATCH 17/21] [ILM] Fix useState declaration --- .../node_allocation/node_allocation.tsx | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 208f6b2aa61312..0c9d9318836e0e 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { Fragment } from 'react'; +import React, { Fragment, useState } from 'react'; import { FormattedMessage } from '@kbn/i18n/react'; import { i18n } from '@kbn/i18n'; import { @@ -20,11 +20,11 @@ import { PHASE_NODE_ATTRS } from '../../../../constants'; import { LearnMoreLink } from '../../../components/learn_more_link'; import { ErrableFormRow } from '../../form_errors'; import { useLoadNodes } from '../../../../services/api'; +import { NodeAttrsDetails } from '../node_attrs_details'; interface Props { phase: string; setPhaseData: (dataKey: string, value: any) => void; - showNodeDetailsFlyout: (nodeAttrs: any) => void; errors: any; phaseData: any; isShowingErrors: boolean; @@ -48,13 +48,14 @@ const learnMoreLink = ( export const NodeAllocation: React.FunctionComponent = ({ phase, setPhaseData, - showNodeDetailsFlyout, errors, phaseData, isShowingErrors, }) => { const { isLoading, data: nodes, error, sendRequest } = useLoadNodes(); + const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState(null); + if (isLoading) { return ( @@ -162,7 +163,7 @@ export const NodeAllocation: React.FunctionComponent = ({ data-test-subj={`${phase}-viewNodeDetailsFlyoutButton`} flush="left" iconType="eye" - onClick={() => showNodeDetailsFlyout(phaseData[PHASE_NODE_ATTRS])} + onClick={() => setSelectedNodeAttrsForDetails(phaseData[PHASE_NODE_ATTRS])} > = ({ ) : null} {learnMoreLink} + + {selectedNodeAttrsForDetails ? ( + setSelectedNodeAttrsForDetails(null)} + /> + ) : null} ); }; From 5ae1dd7e8c4ad92562983d2d3e227bd9a2efca8d Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 14:07:13 +0200 Subject: [PATCH 18/21] [ILM] Fix useState declaration --- .../components/node_allocation/node_allocation.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx index 0c9d9318836e0e..31261de45c7431 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_allocation/node_allocation.tsx @@ -54,7 +54,9 @@ export const NodeAllocation: React.FunctionComponent = ({ }) => { const { isLoading, data: nodes, error, sendRequest } = useLoadNodes(); - const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState(null); + const [selectedNodeAttrsForDetails, setSelectedNodeAttrsForDetails] = useState( + null + ); if (isLoading) { return ( From 1366535aa2d611969d65abf65362218d0f42cd22 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Fri, 31 Jul 2020 15:05:34 +0200 Subject: [PATCH 19/21] [ILM] Fix jest test --- .../__jest__/components/edit_policy.test.js | 14 ++++++++++++-- .../__jest__/components/helpers/http_requests.ts | 9 +++++++++ 2 files changed, 21 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js index c6da347ed8cfef..4fe3d5c66696e9 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/edit_policy.test.js @@ -253,6 +253,9 @@ describe('edit policy', () => { beforeEach(() => { server.respondImmediately = true; httpRequestsMockHelpers.setNodesListResponse({}); + httpRequestsMockHelpers.setNodesDetailsResponse('attribute:true', [ + { nodeId: 'testNodeId', stats: { name: 'testNodeName', host: 'testHost' } }, + ]); }); test('should show number required error when trying to save empty warm phase', async () => { @@ -395,7 +398,9 @@ describe('edit policy', () => { rendered.update(); const flyoutButton = findTestSubject(rendered, 'warm-viewNodeDetailsFlyoutButton'); expect(flyoutButton.exists()).toBeTruthy(); - flyoutButton.simulate('click'); + await act(async () => { + await flyoutButton.simulate('click'); + }); rendered.update(); expect(rendered.find('.euiFlyout').exists()).toBeTruthy(); }); @@ -404,6 +409,9 @@ describe('edit policy', () => { beforeEach(() => { server.respondImmediately = true; httpRequestsMockHelpers.setNodesListResponse({}); + httpRequestsMockHelpers.setNodesDetailsResponse('attribute:true', [ + { nodeId: 'testNodeId', stats: { name: 'testNodeName', host: 'testHost' } }, + ]); }); test('should allow 0 for phase timing', async () => { const rendered = mountWithIntl(component); @@ -470,7 +478,9 @@ describe('edit policy', () => { rendered.update(); const flyoutButton = findTestSubject(rendered, 'cold-viewNodeDetailsFlyoutButton'); expect(flyoutButton.exists()).toBeTruthy(); - flyoutButton.simulate('click'); + await act(async () => { + await flyoutButton.simulate('click'); + }); rendered.update(); expect(rendered.find('.euiFlyout').exists()).toBeTruthy(); }); diff --git a/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts index b5c941beef1818..668cbedbf0c950 100644 --- a/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts +++ b/x-pack/plugins/index_lifecycle_management/__jest__/components/helpers/http_requests.ts @@ -25,9 +25,18 @@ const registerHttpRequestMockHelpers = (server: SinonFakeServer) => { ]); }; + const setNodesDetailsResponse = (nodeAttributes: string, response: HttpResponse = []) => { + server.respondWith(`/api/index_lifecycle_management/nodes/${nodeAttributes}/details`, [ + 200, + { 'Content-Type': 'application/json' }, + JSON.stringify(response), + ]); + }; + return { setPoliciesResponse, setNodesListResponse, + setNodesDetailsResponse, }; }; From 3ab56aaf3f943a8d42b90088668091bf1765b337 Mon Sep 17 00:00:00 2001 From: Yulia Cech Date: Thu, 6 Aug 2020 15:55:04 +0200 Subject: [PATCH 20/21] [ILM] Change error message when unable to load node details --- .../components/node_attrs_details/node_attrs_details.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx index 45c2cd641f7e04..15591ab6468a75 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -33,7 +33,7 @@ export const NodeAttrsDetails: React.FunctionComponent = ({ close, select if (isLoading) { content = ; } else if (error) { - const { statusCode, error: errorString, message } = error; + const { statusCode, message } = error; content = ( = ({ close, select color="danger" >

- {statusCode}: {errorString}. {message} + {message} ({statusCode})

Date: Thu, 6 Aug 2020 16:17:44 +0200 Subject: [PATCH 21/21] [ILM] Delete a period in error callout --- .../components/node_attrs_details/node_attrs_details.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx index 15591ab6468a75..6fcbd94dc5e9a9 100644 --- a/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx +++ b/x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/node_attrs_details/node_attrs_details.tsx @@ -39,7 +39,7 @@ export const NodeAttrsDetails: React.FunctionComponent = ({ close, select title={ } color="danger"