[Index Management] Migrate all usages of EuiPage*_Deprecated

x-pack/plugins/index_management/public/application/components/component_templates/component_template_wizard/component_template_create/component_template_create.tsx

@@ -8,11 +8,7 @@
 import React, { useState, useEffect } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n-react';
-import {
-  EuiPageContentBody_Deprecated as EuiPageContentBody,
-  EuiSpacer,
-  EuiPageHeader,
-} from '@elastic/eui';
+import { EuiPageSection, EuiSpacer, EuiPageHeader } from '@elastic/eui';
 
 import { ComponentTemplateDeserialized } from '../../shared_imports';
 import { useComponentTemplatesContext } from '../../component_templates_context';
@@ -63,7 +59,7 @@ export const ComponentTemplateCreate: React.FunctionComponent<RouteComponentProp
   }, [breadcrumbs]);
 
   return (
-    <EuiPageContentBody restrictWidth style={{ width: '100%' }}>
+    <EuiPageSection restrictWidth style={{ width: '100%' }}>
       <EuiPageHeader
         pageTitle={
           <span data-test-subj="pageTitle">
@@ -85,6 +81,6 @@ export const ComponentTemplateCreate: React.FunctionComponent<RouteComponentProp
         saveError={saveError}
         clearSaveError={clearSaveError}
       />
-    </EuiPageContentBody>
+    </EuiPageSection>
   );
 };

x-pack/plugins/index_management/public/application/components/component_templates/component_template_wizard/component_template_edit/component_template_edit.tsx

@@ -9,11 +9,7 @@ import React, { useState, useEffect, useMemo, useCallback } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n-react';
 import { toMountPoint } from '@kbn/kibana-react-plugin/public';
-import {
-  EuiPageContentBody_Deprecated as EuiPageContentBody,
-  EuiPageHeader,
-  EuiSpacer,
-} from '@elastic/eui';
+import { EuiPageSection, EuiPageHeader, EuiSpacer } from '@elastic/eui';
 import { History } from 'history';
 
 import { useComponentTemplatesContext } from '../../component_templates_context';
@@ -165,7 +161,7 @@ export const ComponentTemplateEdit: React.FunctionComponent<RouteComponentProps<
   }
 
   return (
-    <EuiPageContentBody restrictWidth style={{ width: '100%' }}>
+    <EuiPageSection restrictWidth style={{ width: '100%' }}>
       <EuiPageHeader
         pageTitle={
           <span data-test-subj="pageTitle">
@@ -192,6 +188,6 @@ export const ComponentTemplateEdit: React.FunctionComponent<RouteComponentProps<
         clearSaveError={clearSaveError}
         isEditing={true}
       />
-    </EuiPageContentBody>
+    </EuiPageSection>
   );
 };

x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_list.tsx

@@ -16,7 +16,7 @@ import {
   EuiText,
   EuiIconTip,
   EuiSpacer,
-  EuiPageContent_Deprecated as EuiPageContent,
+  EuiPageSection,
   EuiEmptyPrompt,
   EuiLink,
 } from '@elastic/eui';
@@ -270,7 +270,7 @@ export const DataStreamList: React.FunctionComponent<RouteComponentProps<MatchPa
   } else {
     activateHiddenFilter(isSelectedDataStreamHidden(dataStreams!, decodedDataStreamName));
     content = (
-      <EuiPageContent hasShadow={false} paddingSize="none" data-test-subj="dataStreamList">
+      <EuiPageSection paddingSize="none" data-test-subj="dataStreamList">
         {renderHeader()}
         <EuiSpacer size="l" />
 
@@ -285,7 +285,7 @@ export const DataStreamList: React.FunctionComponent<RouteComponentProps<MatchPa
           history={history as ScopedHistory}
           includeStats={isIncludeStatsChecked}
         />
-      </EuiPageContent>
+      </EuiPageSection>
     );
   }
 

x-pack/plugins/index_management/public/application/sections/home/index_list/index_table/index_table.js

@@ -19,7 +19,7 @@ import {
   EuiCheckbox,
   EuiFlexGroup,
   EuiFlexItem,
-  EuiPageContent_Deprecated as EuiPageContent,
+  EuiPageSection,
   EuiScreenReaderOnly,
   EuiSpacer,
   EuiSearchBar,
@@ -435,56 +435,43 @@ export class IndexTable extends Component {
     const hasContent = !indicesLoading && !indicesError;
 
     if (!hasContent) {
-      const renderNoContent = () => {
-        if (indicesLoading) {
-          return (
-            <PageLoading>
-              <FormattedMessage
-                id="xpack.idxMgmt.indexTable.loadingIndicesDescription"
-                defaultMessage="Loading indices…"
-              />
-            </PageLoading>
-          );
-        }
-
-        if (indicesError) {
-          if (indicesError.status === 403) {
-            return (
-              <PageError
-                title={
-                  <FormattedMessage
-                    id="xpack.idxMgmt.pageErrorForbidden.title"
-                    defaultMessage="You do not have permissions to use Index Management"
-                  />
-                }
-              />
-            );
-          }
+      if (indicesLoading) {
+        return (
+          <PageLoading>
+            <FormattedMessage
+              id="xpack.idxMgmt.indexTable.loadingIndicesDescription"
+              defaultMessage="Loading indices…"
+            />
+          </PageLoading>
+        );
+      }
 
+      if (indicesError) {
+        if (indicesError.status === 403) {
           return (
             <PageError
               title={
                 <FormattedMessage
-                  id="xpack.idxMgmt.indexTable.serverErrorTitle"
-                  defaultMessage="Error loading indices"
+                  id="xpack.idxMgmt.pageErrorForbidden.title"
+                  defaultMessage="You do not have permissions to use Index Management"
                 />
               }
-              error={indicesError.body}
             />
           );
         }
-      };
 
-      return (
-        <EuiPageContent
-          hasShadow={false}
-          paddingSize="none"
-          verticalPosition="center"
-          horizontalPosition="center"
-        >
-          {renderNoContent()}
-        </EuiPageContent>
-      );
+        return (
+          <PageError
+            title={
+              <FormattedMessage
+                id="xpack.idxMgmt.indexTable.serverErrorTitle"
+                defaultMessage="Error loading indices"
+              />
+            }
+            error={indicesError.body}
+          />
+        );
+      }
     }
 
     const { selectedIndicesMap } = this.state;
@@ -496,7 +483,7 @@ export class IndexTable extends Component {
           const { extensionsService } = services;
 
           return (
-            <EuiPageContent hasShadow={false} paddingSize="none">
+            <EuiPageSection paddingSize="none">
               <EuiFlexGroup alignItems="center">
                 <EuiFlexItem grow={true}>
                   <EuiText color="subdued">
@@ -665,7 +652,7 @@ export class IndexTable extends Component {
               <EuiSpacer size="m" />
 
               {indices.length > 0 ? this.renderPager() : null}
-            </EuiPageContent>
+            </EuiPageSection>
           );
         }}
       </AppContextConsumer>

x-pack/plugins/index_management/public/application/sections/template_clone/template_clone.tsx

@@ -8,7 +8,7 @@
 import React, { useEffect, useState } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n-react';
-import { EuiPageContentBody_Deprecated as EuiPageContentBody } from '@elastic/eui';
+import { EuiPageSection } from '@elastic/eui';
 import { ScopedHistory } from '@kbn/core/public';
 
 import { PageLoading, PageError, Error } from '../../../shared_imports';
@@ -103,7 +103,7 @@ export const TemplateClone: React.FunctionComponent<RouteComponentProps<MatchPar
   } as TemplateDeserialized;
 
   return (
-    <EuiPageContentBody restrictWidth style={{ width: '100%' }}>
+    <EuiPageSection restrictWidth style={{ width: '100%' }}>
       <TemplateForm
         title={
           <FormattedMessage
@@ -120,6 +120,6 @@ export const TemplateClone: React.FunctionComponent<RouteComponentProps<MatchPar
         isLegacy={isLegacy}
         history={history as ScopedHistory}
       />
-    </EuiPageContentBody>
+    </EuiPageSection>
   );
 };

x-pack/plugins/index_management/public/application/sections/template_create/template_create.tsx

@@ -8,7 +8,7 @@
 import React, { useEffect, useState } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { FormattedMessage } from '@kbn/i18n-react';
-import { EuiPageContentBody_Deprecated as EuiPageContentBody } from '@elastic/eui';
+import { EuiPageSection } from '@elastic/eui';
 import { useLocation } from 'react-router-dom';
 import { parse } from 'query-string';
 import { ScopedHistory } from '@kbn/core/public';
@@ -57,7 +57,7 @@ export const TemplateCreate: React.FunctionComponent<RouteComponentProps> = ({ h
   }, []);
 
   return (
-    <EuiPageContentBody restrictWidth style={{ width: '100%' }}>
+    <EuiPageSection restrictWidth style={{ width: '100%' }}>
       <TemplateForm
         title={
           isLegacy ? (
@@ -79,6 +79,6 @@ export const TemplateCreate: React.FunctionComponent<RouteComponentProps> = ({ h
         isLegacy={isLegacy}
         history={history as ScopedHistory}
       />
-    </EuiPageContentBody>
+    </EuiPageSection>
   );
 };

x-pack/plugins/index_management/public/application/sections/template_edit/template_edit.tsx

@@ -9,11 +9,7 @@ import React, { useEffect, useState, Fragment } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
 import { i18n } from '@kbn/i18n';
 import { FormattedMessage } from '@kbn/i18n-react';
-import {
-  EuiPageContentBody_Deprecated as EuiPageContentBody,
-  EuiSpacer,
-  EuiCallOut,
-} from '@elastic/eui';
+import { EuiPageSection, EuiSpacer, EuiCallOut } from '@elastic/eui';
 import { ScopedHistory } from '@kbn/core/public';
 
 import { TemplateDeserialized } from '../../../../common';
@@ -131,7 +127,7 @@ export const TemplateEdit: React.FunctionComponent<RouteComponentProps<MatchPara
   }
 
   return (
-    <EuiPageContentBody restrictWidth style={{ width: '100%' }}>
+    <EuiPageSection restrictWidth style={{ width: '100%' }}>
       {isSystemTemplate && (
         <Fragment>
           <EuiCallOut
@@ -171,6 +167,6 @@ export const TemplateEdit: React.FunctionComponent<RouteComponentProps<MatchPara
         isLegacy={isLegacy}
         history={history as ScopedHistory}
       />
-    </EuiPageContentBody>
+    </EuiPageSection>
   );
 };