[ILM] Migrate Hot phase to Form Lib (elastic#80012) (elastic#81013)

* wip * added missing shared_imports file to index * initial migration of hot phase to form lib - tests are now broken - need to break up the hot_phase file in to meaningful parts - duplicated set_priority and forcemerge components * Big refactor - moved a lot of files around - removed the need for the state to track whether rollover is set * Integrate form lib serialization with existing serialization - refactor serializePolicy -> legacySerializePolicy - updated serialization of form lib to factor in pre-existing policy values. These should be interacted with in a non-lossy way. * wip on fixing jest tests and some other refactors * fix jest tests and other refactors * delete existing hot phase serialization and tests * beginning of serializer test for hot phase * added serialization tests for form lib components * fix some i18n issues * fixed delete phase integration test * move hot phase serialization test to pre-existing test location * fix another jest test issue * fix ui metric tracking for setting input priority in hot phase * refactor use rollover switch to form lib component and update validation for number segments in force merge * readded missing validation 🤦🏼‍♂️ * fix type check issues and setting of rollover enabled 🙄 * migrate all form lib components to spreading all rest props in EuiFormRow * added comment to test helper function * refactor test helper setPhaseIndexPriorityFormLib -> setPhaseIndexPriority * refactor to use form schema * Removed use of UseMultiFields component - also fix missing "key" on react component in unrelated file - fixed ordering of JSON in test file - also removed default value from form schema so that when a value is not set for max size, max docs or max age it will remain unset in future policies * update json flyout behaviour * fix json policy serialization * Fix type and i18n issues * do not use form.subscribe * add missing key value in cells Co-authored-by: Kibana Machine <[email protected]> Co-authored-by: Kibana Machine <[email protected]>
flash1293 · Oct 20, 2020 · 580264f · 580264f
1 parent 5609c11
commit 580264f
Show file tree

Hide file tree

Showing 56 changed files with 1,907 additions and 1,302 deletions.
diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/checkbox_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/checkbox_field.tsx
@@ -39,8 +39,8 @@ export const CheckBoxField = ({ field, euiFieldProps = {}, ...rest }: Props) =>
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiCheckbox
         label={field.label}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/combobox_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/combobox_field.tsx
@@ -87,8 +87,8 @@ export const ComboBoxField = ({ field, euiFieldProps = {}, ...rest }: Props) =>
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiComboBox
         noSuggestions

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/multi_select_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/multi_select_field.tsx
@@ -39,8 +39,8 @@ export const MultiSelectField = ({ field, euiFieldProps = {}, ...rest }: Props)
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiSelectable
         allowExclusions={false}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/numeric_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/numeric_field.tsx
@@ -39,8 +39,8 @@ export const NumericField = ({ field, euiFieldProps = {}, ...rest }: Props) => {
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiFieldNumber
         isInvalid={isInvalid}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/radio_group_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/radio_group_field.tsx
@@ -39,8 +39,8 @@ export const RadioGroupField = ({ field, euiFieldProps = {}, ...rest }: Props) =
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiRadioGroup
         idSelected={field.value as string}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/range_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/range_field.tsx
@@ -50,8 +50,8 @@ export const RangeField = ({ field, euiFieldProps = {}, ...rest }: Props) => {
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiRange
         value={field.value as number}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/select_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/select_field.tsx
@@ -44,8 +44,8 @@ export const SelectField = ({ field, euiFieldProps, ...rest }: Props) => {
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiSelect
         fullWidth

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/super_select_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/super_select_field.tsx
@@ -42,8 +42,8 @@ export const SuperSelectField = ({ field, euiFieldProps = { options: [] }, ...re
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiSuperSelect
         fullWidth

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/text_area_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/text_area_field.tsx
@@ -39,8 +39,8 @@ export const TextAreaField = ({ field, euiFieldProps = {}, ...rest }: Props) =>
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiTextArea
         isInvalid={isInvalid}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/text_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/text_field.tsx
@@ -39,8 +39,8 @@ export const TextField = ({ field, euiFieldProps = {}, ...rest }: Props) => {
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiFieldText
         isInvalid={isInvalid}

diff --git a/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx b/src/plugins/es_ui_shared/static/forms/components/fields/toggle_field.tsx
@@ -46,8 +46,8 @@ export const ToggleField = ({ field, euiFieldProps = {}, ...rest }: Props) => {
       error={errorMessage}
       isInvalid={isInvalid}
       fullWidth
-      data-test-subj={rest['data-test-subj']}
       describedByIds={rest.idAria ? [rest.idAria] : undefined}
+      {...rest}
     >
       <EuiSwitch
         label={field.label}

diff --git a/...s/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap b/...s/index_lifecycle_management/__jest__/__snapshots__/extend_index_management.test.tsx.snap
diff --git a/...k/plugins/index_lifecycle_management/__jest__/client_integration/edit_policy/constants.ts b/...k/plugins/index_lifecycle_management/__jest__/client_integration/edit_policy/constants.ts
@@ -10,6 +10,23 @@ export const POLICY_NAME = 'my_policy';
 export const SNAPSHOT_POLICY_NAME = 'my_snapshot_policy';
 export const NEW_SNAPSHOT_POLICY_NAME = 'my_new_snapshot_policy';
 
+export const DEFAULT_POLICY: PolicyFromES = {
+  version: 1,
+  modified_date: Date.now().toString(),
+  policy: {
+    name: '',
+    phases: {
+      hot: {
+        min_age: '123ms',
+        actions: {
+          rollover: {},
+        },
+      },
+    },
+  },
+  name: '',
+};
+
 export const DELETE_PHASE_POLICY: PolicyFromES = {
   version: 1,
   modified_date: Date.now().toString(),
@@ -19,8 +36,12 @@ export const DELETE_PHASE_POLICY: PolicyFromES = {
         min_age: '0ms',
         actions: {
           rollover: {
+            max_age: '30d',
             max_size: '50gb',
           },
+          set_priority: {
+            priority: 100,
+          },
         },
       },
       delete: {

diff --git a/...ndex_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.helpers.tsx b/...ndex_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.helpers.tsx
@@ -7,7 +7,7 @@
 import React from 'react';
 import { act } from 'react-dom/test-utils';
 
-import { registerTestBed, TestBed, TestBedConfig } from '../../../../../test_utils';
+import { registerTestBed, TestBedConfig } from '../../../../../test_utils';
 
 import { POLICY_NAME } from './constants';
 import { TestSubjects } from '../helpers';
@@ -43,39 +43,110 @@ const testBedConfig: TestBedConfig = {
   },
 };
 
-const initTestBed = registerTestBed(EditPolicy, testBedConfig);
+const initTestBed = registerTestBed<TestSubjects>(EditPolicy, testBedConfig);
 
-export interface EditPolicyTestBed extends TestBed<TestSubjects> {
-  actions: {
-    setWaitForSnapshotPolicy: (snapshotPolicyName: string) => void;
-    savePolicy: () => void;
-  };
-}
+type SetupReturn = ReturnType<typeof setup>;
+
+export type EditPolicyTestBed = SetupReturn extends Promise<infer U> ? U : SetupReturn;
 
-export const setup = async (): Promise<EditPolicyTestBed> => {
+export const setup = async () => {
   const testBed = await initTestBed();
 
+  const { find, component } = testBed;
+
   const setWaitForSnapshotPolicy = async (snapshotPolicyName: string) => {
-    const { component } = testBed;
     act(() => {
-      testBed.find('snapshotPolicyCombobox').simulate('change', [{ label: snapshotPolicyName }]);
+      find('snapshotPolicyCombobox').simulate('change', [{ label: snapshotPolicyName }]);
     });
     component.update();
   };
 
   const savePolicy = async () => {
-    const { component, find } = testBed;
     await act(async () => {
       find('savePolicyButton').simulate('click');
     });
     component.update();
   };
 
+  const toggleRollover = async (checked: boolean) => {
+    await act(async () => {
+      find('rolloverSwitch').simulate('click', { target: { checked } });
+    });
+    component.update();
+  };
+
+  const setMaxSize = async (value: string, units?: string) => {
+    await act(async () => {
+      find('hot-selectedMaxSizeStored').simulate('change', { target: { value } });
+      if (units) {
+        find('hot-selectedMaxSizeStoredUnits.select').simulate('change', {
+          target: { value: units },
+        });
+      }
+    });
+    component.update();
+  };
+
+  const setMaxDocs = async (value: string) => {
+    await act(async () => {
+      find('hot-selectedMaxDocuments').simulate('change', { target: { value } });
+    });
+    component.update();
+  };
+
+  const setMaxAge = async (value: string, units?: string) => {
+    await act(async () => {
+      find('hot-selectedMaxAge').simulate('change', { target: { value } });
+      if (units) {
+        find('hot-selectedMaxAgeUnits.select').simulate('change', { target: { value: units } });
+      }
+    });
+    component.update();
+  };
+
+  const toggleForceMerge = (phase: string) => async (checked: boolean) => {
+    await act(async () => {
+      find(`${phase}-forceMergeSwitch`).simulate('click', { target: { checked } });
+    });
+    component.update();
+  };
+
+  const setForcemergeSegmentsCount = (phase: string) => async (value: string) => {
+    await act(async () => {
+      find(`${phase}-selectedForceMergeSegments`).simulate('change', { target: { value } });
+    });
+    component.update();
+  };
+
+  const setBestCompression = (phase: string) => async (checked: boolean) => {
+    await act(async () => {
+      find(`${phase}-bestCompression`).simulate('click', { target: { checked } });
+    });
+    component.update();
+  };
+
+  const setIndexPriority = (phase: string) => async (value: string) => {
+    await act(async () => {
+      find(`${phase}-phaseIndexPriority`).simulate('change', { target: { value } });
+    });
+    component.update();
+  };
+
   return {
     ...testBed,
     actions: {
       setWaitForSnapshotPolicy,
       savePolicy,
+      hot: {
+        setMaxSize,
+        setMaxDocs,
+        setMaxAge,
+        toggleRollover,
+        toggleForceMerge: toggleForceMerge('hot'),
+        setForcemergeSegments: setForcemergeSegmentsCount('hot'),
+        setBestCompression: setBestCompression('hot'),
+        setIndexPriority: setIndexPriority('hot'),
+      },
     },
   };
 };
diff --git a/...ns/index_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.test.ts b/...ns/index_lifecycle_management/__jest__/client_integration/edit_policy/edit_policy.test.ts
@@ -10,7 +10,12 @@ import { setupEnvironment } from '../helpers/setup_environment';
 import { EditPolicyTestBed, setup } from './edit_policy.helpers';
 
 import { API_BASE_PATH } from '../../../common/constants';
-import { DELETE_PHASE_POLICY, NEW_SNAPSHOT_POLICY_NAME, SNAPSHOT_POLICY_NAME } from './constants';
+import {
+  DELETE_PHASE_POLICY,
+  NEW_SNAPSHOT_POLICY_NAME,
+  SNAPSHOT_POLICY_NAME,
+  DEFAULT_POLICY,
+} from './constants';
 
 window.scrollTo = jest.fn();
 
@@ -21,6 +26,83 @@ describe('<EditPolicy />', () => {
     server.restore();
   });
 
+  describe('hot phase', () => {
+    describe('serialization', () => {
+      beforeEach(async () => {
+        httpRequestsMockHelpers.setLoadPolicies([DEFAULT_POLICY]);
+        httpRequestsMockHelpers.setLoadSnapshotPolicies([]);
+
+        await act(async () => {
+          testBed = await setup();
+        });
+
+        const { component } = testBed;
+        component.update();
+      });
+
+      test('setting all values', async () => {
+        const { actions } = testBed;
+
+        await actions.hot.setMaxSize('123', 'mb');
+        await actions.hot.setMaxDocs('123');
+        await actions.hot.setMaxAge('123', 'h');
+        await actions.hot.toggleForceMerge(true);
+        await actions.hot.setForcemergeSegments('123');
+        await actions.hot.setBestCompression(true);
+        await actions.hot.setIndexPriority('123');
+
+        await actions.savePolicy();
+        const latestRequest = server.requests[server.requests.length - 1];
+        expect(JSON.parse(JSON.parse(latestRequest.requestBody).body)).toMatchInlineSnapshot(`
+          Object {
+            "name": "my_policy",
+            "phases": Object {
+              "hot": Object {
+                "actions": Object {
+                  "forcemerge": Object {
+                    "index_codec": "best_compression",
+                    "max_num_segments": 123,
+                  },
+                  "rollover": Object {
+                    "max_age": "123h",
+                    "max_docs": 123,
+                    "max_size": "123mb",
+                  },
+                  "set_priority": Object {
+                    "priority": 123,
+                  },
+                },
+                "min_age": "0ms",
+              },
+            },
+          }
+        `);
+      });
+
+      test('disabling rollover', async () => {
+        const { actions } = testBed;
+        await actions.hot.toggleRollover(false);
+        await actions.savePolicy();
+        const latestRequest = server.requests[server.requests.length - 1];
+        expect(JSON.parse(JSON.parse(latestRequest.requestBody).body)).toMatchInlineSnapshot(`
+          Object {
+            "name": "my_policy",
+            "phases": Object {
+              "hot": Object {
+                "actions": Object {
+                  "set_priority": Object {
+                    "priority": 100,
+                  },
+                },
+                "min_age": "0ms",
+              },
+            },
+          }
+        `);
+      });
+    });
+  });
+
   describe('delete phase', () => {
     beforeEach(async () => {
       httpRequestsMockHelpers.setLoadPolicies([DELETE_PHASE_POLICY]);