Skip to content

Commit

Permalink
[CCR] Migrate all usages of EuiPage*_Deprecated (#163135)
Browse files Browse the repository at this point in the history
  • Loading branch information
gitstart authored Aug 17, 2023
1 parent 4ce5464 commit 1ab6a4c
Show file tree
Hide file tree
Showing 9 changed files with 183 additions and 254 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -31,8 +31,8 @@ describe('Create Auto-follow pattern', () => {
});

test('should display a "loading remote clusters" indicator', () => {
expect(exists('remoteClustersLoading')).toBe(true);
expect(find('remoteClustersLoading').text()).toBe('Loading remote clusters…');
expect(exists('sectionLoading')).toBe(true);
expect(find('sectionLoading').text()).toBe('Loading remote clusters…');
});
});

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,8 @@ describe('Create Follower index', () => {
});

test('should display a "loading remote clusters" indicator', () => {
expect(exists('remoteClustersLoading')).toBe(true);
expect(find('remoteClustersLoading').text()).toBe('Loading remote clusters…');
expect(exists('sectionLoading')).toBe(true);
expect(find('sectionLoading').text()).toBe('Loading remote clusters…');
});
});

Expand Down
66 changes: 31 additions & 35 deletions x-pack/plugins/cross_cluster_replication/public/app/app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ import { ScopedHistory, ApplicationStart } from '@kbn/core/public';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';

import { EuiEmptyPrompt, EuiPageContent_Deprecated as EuiPageContent } from '@elastic/eui';
import { EuiPageTemplate } from '@elastic/eui';

import { getFatalErrors } from './services/notifications';
import { routing } from './services/routing';
Expand Down Expand Up @@ -109,14 +109,12 @@ class AppComponent extends Component<AppProps, AppState> {

if (isFetchingPermissions) {
return (
<EuiPageContent verticalPosition="center" horizontalPosition="center" color="subdued">
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.app.permissionCheckTitle"
defaultMessage="Checking permissions…"
/>
</SectionLoading>
</EuiPageContent>
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.app.permissionCheckTitle"
defaultMessage="Checking permissions…"
/>
</SectionLoading>
);
}

Expand All @@ -136,32 +134,30 @@ class AppComponent extends Component<AppProps, AppState> {

if (!hasPermission) {
return (
<EuiPageContent verticalPosition="center" horizontalPosition="center" color="subdued">
<EuiEmptyPrompt
iconType="securityApp"
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionTitle"
defaultMessage="You're missing cluster privileges"
/>
</h2>
}
body={
<p>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionDescription"
defaultMessage="To use Cross-Cluster Replication, you must have {clusterPrivilegesCount,
plural, one {this cluster privilege} other {these cluster privileges}}: {clusterPrivileges}."
values={{
clusterPrivileges: missingClusterPrivileges.join(', '),
clusterPrivilegesCount: missingClusterPrivileges.length,
}}
/>
</p>
}
/>
</EuiPageContent>
<EuiPageTemplate.EmptyPrompt
iconType="securityApp"
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionTitle"
defaultMessage="You're missing cluster privileges"
/>
</h2>
}
body={
<p>
<FormattedMessage
id="xpack.crossClusterReplication.app.deniedPermissionDescription"
defaultMessage="To use Cross-Cluster Replication, you must have {clusterPrivilegesCount,
plural, one {this cluster privilege} other {these cluster privileges}}: {clusterPrivileges}."
values={{
clusterPrivileges: missingClusterPrivileges.join(', '),
clusterPrivilegesCount: missingClusterPrivileges.length,
}}
/>
</p>
}
/>
);
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,7 @@
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage } from '@kbn/i18n-react';
import {
EuiPageContentBody_Deprecated as EuiPageContentBody,
EuiPageContent_Deprecated as EuiPageContent,
} from '@elastic/eui';
import { EuiPageSection } from '@elastic/eui';

import { listBreadcrumb, addBreadcrumb, setBreadcrumbs } from '../../services/breadcrumbs';
import {
Expand Down Expand Up @@ -50,24 +47,17 @@ export class AutoFollowPatternAdd extends PureComponent {
{({ isLoading, error, remoteClusters }) => {
if (isLoading) {
return (
<EuiPageContent
verticalPosition="center"
horizontalPosition="center"
color="subdued"
data-test-subj="remoteClustersLoading"
>
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternCreateForm.loadingRemoteClustersMessage"
defaultMessage="Loading remote clusters…"
/>
</SectionLoading>
</EuiPageContent>
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternCreateForm.loadingRemoteClustersMessage"
defaultMessage="Loading remote clusters…"
/>
</SectionLoading>
);
}

return (
<EuiPageContentBody restrictWidth style={{ width: '100%' }}>
<EuiPageSection restrictWidth style={{ width: '100%' }}>
<AutoFollowPatternPageTitle
title={
<FormattedMessage
Expand All @@ -90,7 +80,7 @@ export class AutoFollowPatternAdd extends PureComponent {
/>
}
/>
</EuiPageContentBody>
</EuiPageSection>
);
}}
</RemoteClustersProvider>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,7 @@ import PropTypes from 'prop-types';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';

import {
EuiButton,
EuiPageContent_Deprecated as EuiPageContent,
EuiEmptyPrompt,
EuiPageContentBody_Deprecated as EuiPageContentBody,
} from '@elastic/eui';
import { EuiButton, EuiPageSection, EuiPageTemplate } from '@elastic/eui';

import { listBreadcrumb, editBreadcrumb, setBreadcrumbs } from '../../services/breadcrumbs';
import { reactRouterNavigate } from '@kbn/kibana-react-plugin/public';
Expand Down Expand Up @@ -98,43 +93,38 @@ export class AutoFollowPatternEdit extends PureComponent {
: error;

return (
<EuiPageContent verticalPosition="center" horizontalPosition="center" color="danger">
<EuiEmptyPrompt
iconType="warning"
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternEditForm.loadingErrorTitle"
defaultMessage="Error loading auto-follow pattern"
/>
</h2>
}
body={<p>{errorMessage}</p>}
actions={
<EuiButton
{...reactRouterNavigate(this.props.history, `/auto_follow_patterns`)}
color="danger"
flush="left"
iconType="arrowLeft"
data-test-subj="viewAutoFollowPatternListButton"
>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternEditForm.viewAutoFollowPatternsButtonLabel"
defaultMessage="View auto-follow patterns"
/>
</EuiButton>
}
/>
</EuiPageContent>
<EuiPageTemplate.EmptyPrompt
color="danger"
iconType="warning"
title={
<h2>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternEditForm.loadingErrorTitle"
defaultMessage="Error loading auto-follow pattern"
/>
</h2>
}
body={<p>{errorMessage}</p>}
actions={
<EuiButton
{...reactRouterNavigate(this.props.history, `/auto_follow_patterns`)}
color="danger"
flush="left"
iconType="arrowLeft"
data-test-subj="viewAutoFollowPatternListButton"
>
<FormattedMessage
id="xpack.crossClusterReplication.autoFollowPatternEditForm.viewAutoFollowPatternsButtonLabel"
defaultMessage="View auto-follow patterns"
/>
</EuiButton>
}
/>
);
}

renderLoading(loadingTitle) {
return (
<EuiPageContent verticalPosition="center" horizontalPosition="center" color="subdued">
<SectionLoading>{loadingTitle}</SectionLoading>
</EuiPageContent>
);
return <SectionLoading>{loadingTitle}</SectionLoading>;
}

render() {
Expand Down Expand Up @@ -171,7 +161,7 @@ export class AutoFollowPatternEdit extends PureComponent {
}

return (
<EuiPageContentBody restrictWidth style={{ width: '100%' }}>
<EuiPageSection restrictWidth style={{ width: '100%' }}>
<AutoFollowPatternPageTitle
title={
<FormattedMessage
Expand All @@ -195,7 +185,7 @@ export class AutoFollowPatternEdit extends PureComponent {
/>
}
/>
</EuiPageContentBody>
</EuiPageSection>
);
}}
</RemoteClustersProvider>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,7 @@
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { FormattedMessage } from '@kbn/i18n-react';
import {
EuiPageContentBody_Deprecated as EuiPageContentBody,
EuiPageContent_Deprecated as EuiPageContent,
} from '@elastic/eui';
import { EuiPageSection } from '@elastic/eui';

import { setBreadcrumbs, listBreadcrumb, addBreadcrumb } from '../../services/breadcrumbs';
import {
Expand Down Expand Up @@ -51,24 +48,17 @@ export class FollowerIndexAdd extends PureComponent {
{({ isLoading, error, remoteClusters }) => {
if (isLoading) {
return (
<EuiPageContent
verticalPosition="center"
horizontalPosition="center"
color="subdued"
data-test-subj="remoteClustersLoading"
>
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.followerIndexCreateForm.loadingRemoteClustersMessage"
defaultMessage="Loading remote clusters…"
/>
</SectionLoading>
</EuiPageContent>
<SectionLoading>
<FormattedMessage
id="xpack.crossClusterReplication.followerIndexCreateForm.loadingRemoteClustersMessage"
defaultMessage="Loading remote clusters…"
/>
</SectionLoading>
);
}

return (
<EuiPageContentBody restrictWidth style={{ width: '100%' }}>
<EuiPageSection restrictWidth style={{ width: '100%' }}>
<FollowerIndexPageTitle
title={
<FormattedMessage
Expand All @@ -91,7 +81,7 @@ export class FollowerIndexAdd extends PureComponent {
/>
}
/>
</EuiPageContentBody>
</EuiPageSection>
);
}}
</RemoteClustersProvider>
Expand Down
Loading

0 comments on commit 1ab6a4c

Please sign in to comment.