[ILM] Rollover min age tooltip and copy fixes

x-pack/plugins/index_lifecycle_management/__jest__/client_integration/app/app.test.ts

@@ -22,8 +22,8 @@ const PERCENT_SIGN_NAME = 'test%';
 const PERCENT_SIGN_WITH_OTHER_CHARS_NAME = 'test%#';
 const PERCENT_SIGN_25_SEQUENCE = 'test%25';
 
-const createPolicyTitle = 'Create Policy';
-const editPolicyTitle = 'Edit Policy';
+const createPolicyTitle = 'Create policy';
+const editPolicyTitle = 'Edit policy';
 
 window.scrollTo = jest.fn();
 

x-pack/plugins/index_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.helpers.tsx

@@ -271,6 +271,9 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
  };
  };
 
+ const hasRolloverTipOnMinAge = (phase: Phases) => (): boolean =>
+ exists(`${phase}-rolloverMinAgeInputIconTip`);
+
  return {
  ...testBed,
  actions: {
@@ -306,6 +309,7 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
  setSelectedNodeAttribute: setSelectedNodeAttribute('warm'),
  setReplicas: setReplicas('warm'),
  hasErrorIndicator: () => exists('phaseErrorIndicator-warm'),
+ hasRolloverTipOnMinAge: hasRolloverTipOnMinAge('warm'),
  ...createShrinkActions('warm'),
  ...createForceMergeActions('warm'),
  setReadonly: setReadonly('warm'),
@@ -321,11 +325,13 @@ export const setup = async (arg?: { appServicesContext: Partial<AppServicesConte
  setFreeze,
  freezeExists,
  hasErrorIndicator: () => exists('phaseErrorIndicator-cold'),
+ hasRolloverTipOnMinAge: hasRolloverTipOnMinAge('cold'),
  ...createIndexPriorityActions('cold'),
  ...createSearchableSnapshotActions('cold'),
  },
  delete: {
  ...createToggleDeletePhaseActions(),
+ hasRolloverTipOnMinAge: hasRolloverTipOnMinAge('delete'),
  setMinAgeValue: setMinAgeValue('delete'),
  setMinAgeUnits: setMinAgeUnits('delete'),
  },

x-pack/plugins/index_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.test.ts

@@ -769,6 +769,38 @@ describe('<EditPolicy />', () => {
  });
  });
  });
+ describe('with rollover', () => {
+ beforeEach(async () => {
+ httpRequestsMockHelpers.setLoadPolicies([getDefaultHotPhasePolicy('my_policy')]);
+ httpRequestsMockHelpers.setListNodes({
+ isUsingDeprecatedDataRoleConfig: false,
+ nodesByAttributes: { test: ['123'] },
+ nodesByRoles: { data: ['123'] },
+ });
+ httpRequestsMockHelpers.setListSnapshotRepos({ repositories: ['abc'] });
+ httpRequestsMockHelpers.setLoadSnapshotPolicies([]);
+
+ await act(async () => {
+ testBed = await setup();
+ });
+
+ const { component } = testBed;
+ component.update();
+ });
+
+ test('shows rollover tip on minimum age', async () => {
+ const { actions } = testBed;
+
+ await actions.warm.enable(true);
+ await actions.cold.enable(true);
+ await actions.delete.enablePhase();
+
+ expect(actions.warm.hasRolloverTipOnMinAge()).toBeTruthy();
+ expect(actions.cold.hasRolloverTipOnMinAge()).toBeTruthy();
+ expect(actions.delete.hasRolloverTipOnMinAge()).toBeTruthy();
+ });
+ });
+
  describe('without rollover', () => {
  beforeEach(async () => {
  httpRequestsMockHelpers.setLoadPolicies([getDefaultHotPhasePolicy('my_policy')]);
@@ -778,6 +810,7 @@ describe('<EditPolicy />', () => {
  nodesByRoles: { data: ['123'] },
  });
  httpRequestsMockHelpers.setListSnapshotRepos({ repositories: ['found-snapshots'] });
+ httpRequestsMockHelpers.setLoadSnapshotPolicies([]);
 
  await act(async () => {
  testBed = await setup({
@@ -799,6 +832,20 @@ describe('<EditPolicy />', () => {
  expect(actions.hot.searchableSnapshotsExists()).toBeFalsy();
  expect(actions.cold.searchableSnapshotDisabledDueToRollover()).toBeTruthy();
  });
+
+ test('hiding rollover tip on minimum age', async () => {
+ const { actions } = testBed;
+ await actions.hot.toggleDefaultRollover(false);
+ await actions.hot.toggleRollover(false);
+
+ await actions.warm.enable(true);
+ await actions.cold.enable(true);
+ await actions.delete.enablePhase();
+
+ expect(actions.warm.hasRolloverTipOnMinAge()).toBeFalsy();
+ expect(actions.cold.hasRolloverTipOnMinAge()).toBeFalsy();
+ expect(actions.delete.hasRolloverTipOnMinAge()).toBeFalsy();
+ });
  });
 
  describe('policy timeline', () => {

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/index.ts

@@ -13,4 +13,5 @@ export { FieldLoadingError } from './field_loading_error';
 export { Timeline } from './timeline';
 export { FormErrorsCallout } from './form_errors_callout';
 export { PhaseFooter } from './phase_footer';
+export { InfinityIcon } from './infinity_icon';
 export * from './phases';

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/phases/hot_phase/hot_phase.tsx

@@ -16,7 +16,6 @@ import {
  EuiCallOut,
  EuiTextColor,
  EuiSwitch,
- EuiIconTip,
  EuiText,
 } from '@elastic/eui';
 
@@ -121,25 +120,12 @@ export const HotPhase: FunctionComponent = () => {
  <div aria-live="polite" role="region">
  <UseField<boolean> path="_meta.hot.customRollover.enabled">
  {(field) => (
- <>
- <EuiSwitch
- label={field.label}
- checked={field.value}
- onChange={(e) => field.setValue(e.target.checked)}
- data-test-subj="rolloverSwitch"
- />
- &nbsp;
- <EuiIconTip
- type="questionInCircle"
- content={
- <FormattedMessage
- id="xpack.indexLifecycleMgmt.editPolicy.hotPhase.enableRolloverTipContent"
- defaultMessage="Roll over to a new index when the
- current index meets one of the defined conditions."
- />
- }
- />
- </>
+ <EuiSwitch
+ label={field.label}
+ checked={field.value}
+ onChange={(e) => field.setValue(e.target.checked)}
+ data-test-subj="rolloverSwitch"
+ />
  )}
  </UseField>
  {isUsingRollover && (

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/phases/shared_fields/min_age_field/min_age_field.tsx

@@ -17,11 +17,12 @@ import {
  EuiFormRow,
  EuiSelect,
  EuiText,
+ EuiIconTip,
 } from '@elastic/eui';
 
 import { getFieldValidityAndErrorMessage } from '../../../../../../../shared_imports';
 
-import { UseField } from '../../../../form';
+import { UseField, useConfigurationIssues } from '../../../../form';
 
 import { getUnitsAriaLabelForPhase, getTimingLabelForPhase } from './util';
 
@@ -62,13 +63,21 @@ const i18nTexts = {
  defaultMessage: 'nanoseconds',
  }
  ),
+ rolloverToolTipDescription: i18n.translate(
+ 'xpack.indexLifecycleMgmt.editPolicy.minimumAge.rolloverToolTipDescription',
+ {
+ defaultMessage:
+ 'Data age is calculated from rollover. Rollover is configured in the hot phase.',
+ }
+ ),
 };
 
 interface Props {
  phase: PhaseWithMinAgeAction;
 }
 
 export const MinAgeField: FunctionComponent<Props> = ({ phase }): React.ReactElement => {
+ const { isUsingRollover } = useConfigurationIssues();
  return (
  <UseField path={`phases.${phase}.min_age`}>
  {(field) => {
@@ -110,6 +119,26 @@ export const MinAgeField: FunctionComponent<Props> = ({ phase }): React.ReactEle
  const { isInvalid: isUnitFieldInvalid } = getFieldValidityAndErrorMessage(
  unitField
  );
+ const selectAppendValue: Array<string | React.ReactElement> = [
+ i18n.translate(
+ 'xpack.indexLifecycleMgmt.editPolicy.minimumAge.minimumAgeFieldSuffixLabel',
+ { defaultMessage: 'old' }
+ ),
+ ].concat(
+ isUsingRollover
+ ? [
+ <>
+ {/* This element is rendered for testing purposes only */}
+ <div data-test-subj={`${phase}-rolloverMinAgeInputIconTip`} />
+ <EuiIconTip
+ type="iInCircle"
+ aria-label={i18nTexts.rolloverToolTipDescription}
+ content={i18nTexts.rolloverToolTipDescription}
+ />
+ </>,
+ ]
+ : ([] as any[])
+ );
  return (
  <EuiSelect
  compressed
@@ -118,7 +147,7 @@ export const MinAgeField: FunctionComponent<Props> = ({ phase }): React.ReactEle
  unitField.setValue(e.target.value);
  }}
  isInvalid={isUnitFieldInvalid}
- append={'old'}
+ append={selectAppendValue}
  data-test-subj={`${phase}-selectedMinimumAgeUnits`}
  aria-label={getUnitsAriaLabelForPhase(phase)}
  options={[

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/components/timeline/timeline.tsx

@@ -6,6 +6,7 @@
  */
 
 import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
 
 import React, { FunctionComponent, memo } from 'react';
 import { EuiFlexGroup, EuiFlexItem, EuiTitle, EuiText, EuiIconTip } from '@elastic/eui';
@@ -18,7 +19,7 @@ import {
  AbsoluteTimings,
 } from '../../lib';
 
-import { InfinityIcon } from '../infinity_icon';
+import { InfinityIcon, LearnMoreLink } from '..';
 
 import { TimelinePhaseText } from './components';
 
@@ -47,21 +48,14 @@ const SCORE_BUFFER_AMOUNT = 50;
 
 const i18nTexts = {
  title: i18n.translate('xpack.indexLifecycleMgmt.timeline.title', {
- defaultMessage: 'Policy Summary',
+ defaultMessage: 'Policy summary',
  }),
  description: i18n.translate('xpack.indexLifecycleMgmt.timeline.description', {
  defaultMessage: 'This policy moves data through the following phases.',
  }),
  hotPhase: i18n.translate('xpack.indexLifecycleMgmt.timeline.hotPhaseSectionTitle', {
  defaultMessage: 'Hot phase',
  }),
- rolloverTooltip: i18n.translate(
- 'xpack.indexLifecycleMgmt.timeline.hotPhaseRolloverToolTipContent',
- {
- defaultMessage:
- 'How long it takes to reach the rollover criteria in the hot phase can vary. Data moves to the next phase when the time since rollover reaches the minimum age.',
- }
- ),
  warmPhase: i18n.translate('xpack.indexLifecycleMgmt.timeline.warmPhaseSectionTitle', {
  defaultMessage: 'Warm phase',
  }),
@@ -143,6 +137,16 @@ export const Timeline: FunctionComponent<Props> = memo(
  </EuiTitle>
  <EuiText size="s" color="subdued">
  {i18nTexts.description}
+ &nbsp;
+ <LearnMoreLink
+ docPath="ilm-index-lifecycle.html#ilm-phase-transitions"
+ text={
+ <FormattedMessage
+ id="xpack.indexLifecycleMgmt.editPolicy.learnAboutTimingText"
+ defaultMessage="Learn about timing"
+ />
+ }
+ />
  </EuiText>
  </EuiFlexItem>
  <EuiFlexItem>

x-pack/plugins/index_lifecycle_management/public/application/sections/edit_policy/edit_policy.tsx

@@ -142,10 +142,10 @@ export const EditPolicy: React.FunctionComponent<Props> = ({ history }) => {
  <h1>
  {isNewPolicy
  ? i18n.translate('xpack.indexLifecycleMgmt.editPolicy.createPolicyMessage', {
- defaultMessage: 'Create Policy',
+ defaultMessage: 'Create policy',
  })
  : i18n.translate('xpack.indexLifecycleMgmt.editPolicy.editPolicyMessage', {
- defaultMessage: 'Edit Policy {originalPolicyName}',
+ defaultMessage: 'Edit policy {originalPolicyName}',
  values: { originalPolicyName },
  })}
  </h1>