Remove injectI18n in management. (elastic#45876) (elastic#47552)

* Remove injectI18n in management
cqliu1 · Oct 9, 2019 · a2ee402 · a2ee402
1 parent a007289
commit a2ee402
Show file tree

Hide file tree

Showing 44 changed files with 1,382 additions and 1,552 deletions.
diff --git a/...ions/index_patterns/create_index_pattern_wizard/components/header/__jest__/header.test.js b/...ions/index_patterns/create_index_pattern_wizard/components/header/__jest__/header.test.js
@@ -19,34 +19,28 @@
 
 import React from 'react';
 import { Header } from '../header';
-import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { shallowWithI18nProvider } from 'test_utils/enzyme_helpers';
 
 describe('Header', () => {
   it('should render normally', () => {
-    const component = shallowWithIntl(
-      <Header.WrappedComponent
-        isIncludingSystemIndices={true}
-        onChangeIncludingSystemIndices={() => {}}
-      />
+    const component = shallowWithI18nProvider(
+      <Header isIncludingSystemIndices={true} onChangeIncludingSystemIndices={() => {}} />
     );
 
     expect(component).toMatchSnapshot();
   });
 
   it('should render without including system indices', () => {
-    const component = shallowWithIntl(
-      <Header.WrappedComponent
-        isIncludingSystemIndices={false}
-        onChangeIncludingSystemIndices={() => {}}
-      />
+    const component = shallowWithI18nProvider(
+      <Header isIncludingSystemIndices={false} onChangeIncludingSystemIndices={() => {}} />
     );
 
     expect(component).toMatchSnapshot();
   });
 
   it('should render a different name, prompt, and beta tag if provided', () => {
-    const component = shallowWithIntl(
-      <Header.WrappedComponent
+    const component = shallowWithI18nProvider(
+      <Header
         isIncludingSystemIndices={false}
         onChangeIncludingSystemIndices={() => {}}
         prompt={<div>Test prompt</div>}

diff --git a/...anagement/sections/index_patterns/create_index_pattern_wizard/components/header/header.js b/...anagement/sections/index_patterns/create_index_pattern_wizard/components/header/header.js
@@ -30,16 +30,16 @@ import {
   EuiSwitch,
 } from '@elastic/eui';
 
-import { FormattedMessage, injectI18n } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
 
-const HeaderUi = ({
+export const Header = ({
   prompt,
   indexPatternName,
   showSystemIndices,
   isIncludingSystemIndices,
   onChangeIncludingSystemIndices,
   isBeta,
-  intl
 }) => (
   <div>
     <EuiTitle>
@@ -48,20 +48,19 @@ const HeaderUi = ({
           id="kbn.management.createIndexPatternHeader"
           defaultMessage="Create {indexPatternName}"
           values={{
-            indexPatternName
+            indexPatternName,
           }}
         />
-        { isBeta ? (
+        {isBeta ? (
           <Fragment>
             {' '}
             <EuiBetaBadge
-              label={intl.formatMessage({
-                id: 'kbn.management.createIndexPattern.betaLabel',
-                defaultMessage: 'Beta'
+              label={i18n.translate('kbn.management.createIndexPattern.betaLabel', {
+                defaultMessage: 'Beta',
               })}
             />
           </Fragment>
-        ) : null }
+        ) : null}
       </h1>
     </EuiTitle>
     <EuiFlexGroup justifyContent="spaceBetween" alignItems="flexEnd">
@@ -77,32 +76,28 @@ const HeaderUi = ({
           </p>
         </EuiText>
       </EuiFlexItem>
-      {
-        showSystemIndices ? (
-          <EuiFlexItem grow={false}>
-            <EuiSwitch
-              label={<FormattedMessage
+      {showSystemIndices ? (
+        <EuiFlexItem grow={false}>
+          <EuiSwitch
+            label={
+              <FormattedMessage
                 id="kbn.management.createIndexPattern.includeSystemIndicesToggleSwitchLabel"
                 defaultMessage="Include system indices"
-              />}
-              id="checkboxShowSystemIndices"
-              checked={isIncludingSystemIndices}
-              onChange={onChangeIncludingSystemIndices}
-            />
-          </EuiFlexItem>
-        ) : null
-      }
+              />
+            }
+            id="checkboxShowSystemIndices"
+            checked={isIncludingSystemIndices}
+            onChange={onChangeIncludingSystemIndices}
+          />
+        </EuiFlexItem>
+      ) : null}
     </EuiFlexGroup>
-    {
-      prompt ? (
-        <Fragment>
-          <EuiSpacer size="s" />
-          {prompt}
-        </Fragment>
-      ) : null
-    }
-    <EuiSpacer size="m"/>
+    {prompt ? (
+      <Fragment>
+        <EuiSpacer size="s" />
+        {prompt}
+      </Fragment>
+    ) : null}
+    <EuiSpacer size="m" />
   </div>
 );
-
-export const Header = injectI18n(HeaderUi);
diff --git a/...zard/components/step_index_pattern/__jest__/__snapshots__/step_index_pattern.test.js.snap b/...zard/components/step_index_pattern/__jest__/__snapshots__/step_index_pattern.test.js.snap
diff --git a/...te_index_pattern_wizard/components/step_index_pattern/__jest__/step_index_pattern.test.js b/...te_index_pattern_wizard/components/step_index_pattern/__jest__/step_index_pattern.test.js
@@ -18,18 +18,19 @@
  */
 
 import React from 'react';
-import { StepIndexPatternComponent } from '../step_index_pattern';
-import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { StepIndexPattern } from '../step_index_pattern';
+import { shallowWithI18nProvider } from 'test_utils/enzyme_helpers';
 import { Header } from '../components/header';
 
 jest.mock('../../../lib/ensure_minimum_time', () => ({
-  ensureMinimumTime: async (promises) => Array.isArray(promises) ? await Promise.all(promises) : await promises
+  ensureMinimumTime: async promises =>
+    Array.isArray(promises) ? await Promise.all(promises) : await promises,
 }));
 const mockIndexPatternCreationType = {
   getIndexPatternType: () => 'default',
   getIndexPatternName: () => 'name',
   checkIndicesForErrors: () => false,
-  getShowSystemIndices: () => false
+  getShowSystemIndices: () => false,
 };
 // If we don't mock this, Jest fails with the error `TypeError: Cannot redefine property: prototype
 // at Function.defineProperties`.
@@ -41,33 +42,29 @@ jest.mock('ui/chrome', () => ({
   getUiSettingsClient: () => ({
     get: () => '',
   }),
-  addBasePath: () => { },
+  addBasePath: () => {},
 }));
 
 jest.mock('../../../lib/get_indices', () => ({
   getIndices: (service, indexPatternCreationType, query) => {
     if (query.startsWith('e')) {
-      return [
-        { name: 'es' },
-      ];
+      return [{ name: 'es' }];
     }
 
-    return [
-      { name: 'kibana' },
-    ];
+    return [{ name: 'kibana' }];
   },
 }));
 
 const allIndices = [{ name: 'kibana' }, { name: 'es' }];
 const esService = {};
 const savedObjectsClient = {
-  find: () => ({ savedObjects: [] })
+  find: () => ({ savedObjects: [] }),
 };
-const goToNextStep = () => { };
+const goToNextStep = () => {};
 
 const createComponent = props => {
-  return shallowWithIntl(
-    <StepIndexPatternComponent
+  return shallowWithI18nProvider(
+    <StepIndexPattern
       allIndices={allIndices}
       isIncludingSystemIndices={false}
       esService={esService}
@@ -94,7 +91,9 @@ describe('StepIndexPattern', () => {
     // Ensure the state changes are reflected
     await component.update();
 
-    expect(component.find('[data-test-subj="createIndexPatternStep1IndicesList"]')).toMatchSnapshot();
+    expect(
+      component.find('[data-test-subj="createIndexPatternStep1IndicesList"]')
+    ).toMatchSnapshot();
   });
 
   it('renders errors when input is invalid', async () => {
@@ -121,7 +120,9 @@ describe('StepIndexPattern', () => {
     // Ensure the state changes are reflected
     component.update();
 
-    expect(component.find('[data-test-subj="createIndexPatternStep1IndicesList"]')).toMatchSnapshot();
+    expect(
+      component.find('[data-test-subj="createIndexPatternStep1IndicesList"]')
+    ).toMatchSnapshot();
   });
 
   it('appends a wildcard automatically to queries', async () => {

diff --git a/...ex_pattern_wizard/components/step_index_pattern/components/header/__jest__/header.test.js b/...ex_pattern_wizard/components/step_index_pattern/components/header/__jest__/header.test.js
@@ -18,13 +18,13 @@
  */
 
 import React from 'react';
-import { HeaderComponent } from '../header';
-import { shallowWithIntl } from 'test_utils/enzyme_helpers';
+import { Header } from '../header';
+import { shallowWithI18nProvider } from 'test_utils/enzyme_helpers';
 
 describe('Header', () => {
   it('should render normally', () => {
-    const component = shallowWithIntl(
-      <HeaderComponent
+    const component = shallowWithI18nProvider(
+      <Header
         isInputInvalid={false}
         errors={[]}
         characterList={['%']}
@@ -39,8 +39,8 @@ describe('Header', () => {
   });
 
   it('should mark the input as invalid', () => {
-    const component = shallowWithIntl(
-      <HeaderComponent
+    const component = shallowWithI18nProvider(
+      <Header
         isInputInvalid={true}
         errors={['Input is invalid']}
         characterList={['%']}

diff --git a/...rns/create_index_pattern_wizard/components/step_index_pattern/components/header/header.js b/...rns/create_index_pattern_wizard/components/step_index_pattern/components/header/header.js
@@ -30,17 +30,17 @@ import {
   EuiFieldText,
 } from '@elastic/eui';
 
-import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
 
-export const HeaderComponent = ({
+export const Header = ({
   isInputInvalid,
   errors,
   characterList,
   query,
   onQueryChanged,
   goToNextStep,
   isNextStepDisabled,
-  intl,
   ...rest
 }) => (
   <div {...rest}>
@@ -52,17 +52,17 @@ export const HeaderComponent = ({
         />
       </h2>
     </EuiTitle>
-    <EuiSpacer size="m"/>
+    <EuiSpacer size="m" />
     <EuiFlexGroup justifyContent="spaceBetween" alignItems="flexEnd">
       <EuiFlexItem grow={false}>
-        <EuiForm
-          isInvalid={isInputInvalid}
-        >
+        <EuiForm isInvalid={isInputInvalid}>
           <EuiFormRow
-            label={<FormattedMessage
-              id="kbn.management.createIndexPattern.step.indexPatternLabel"
-              defaultMessage="Index pattern"
-            />}
+            label={
+              <FormattedMessage
+                id="kbn.management.createIndexPattern.step.indexPatternLabel"
+                defaultMessage="Index pattern"
+              />
+            }
             isInvalid={isInputInvalid}
             error={errors}
             helpText={
@@ -86,10 +86,12 @@ export const HeaderComponent = ({
           >
             <EuiFieldText
               name="indexPattern"
-              placeholder={intl.formatMessage({
-                id: 'kbn.management.createIndexPattern.step.indexPatternPlaceholder',
-                defaultMessage: 'index-name-*'
-              })}
+              placeholder={i18n.translate(
+                'kbn.management.createIndexPattern.step.indexPatternPlaceholder',
+                {
+                  defaultMessage: 'index-name-*',
+                }
+              )}
               value={query}
               isInvalid={isInputInvalid}
               onChange={onQueryChanged}
@@ -114,5 +116,3 @@ export const HeaderComponent = ({
     </EuiFlexGroup>
   </div>
 );
-
-export const Header = injectI18n(HeaderComponent);