From 90faf2bd240996f3534cb83a192b20205c4afa68 Mon Sep 17 00:00:00 2001
From: Jeramy Soucy
Date: Fri, 29 Sep 2023 14:33:32 -0400
Subject: [PATCH] Migrates all security and spaces usage of deprecated Eui Page
components (#167078)
Closes #161419
## Summary
Replaces deprecated EuiPage*_Deprecated components with the suggested
replacement components (see
[issue](https://github.com/elastic/kibana/issues/161419)).
### Visual Difference
The only UI that is noticeably affected is the User Profile page. The
spacing and header font size are slightly different from the previous
implementation, however, it is consistent with other
`Eui/KibanaPageTemplate` pages.
Previous render:
New render:
### Applicable Tests
-
x-pack/plugins/security/public/account_management/user_profile/user_profile.test.tsx
-
x-pack/plugins/security/public/management/users/users_grid/users_grid_page.test.tsx
-
x-pack/plugins/spaces/public/management/edit_space/manage_space_page.test.tsx
-
x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.test.tsx
-
x-pack/plugins/security/public/management/roles/roles_grid/roles_grid_page.test.tsx
(for permission denied)
---------
Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
---
.../user_profile/user_profile.tsx | 60 ++++++++++---------
.../create_role_mapping_button.tsx | 2 +-
.../roles_grid_page.test.tsx.snap | 59 +++++++++---------
.../permission_denied/permission_denied.tsx | 6 +-
.../users/users_grid/users_grid_page.tsx | 6 +-
.../edit_space/manage_space_page.tsx | 15 +++--
.../spaces_grid/spaces_grid_page.tsx | 6 +-
7 files changed, 79 insertions(+), 75 deletions(-)
diff --git a/x-pack/plugins/security/public/account_management/user_profile/user_profile.tsx b/x-pack/plugins/security/public/account_management/user_profile/user_profile.tsx
index 7d11da956acaf..337938713bdac 100644
--- a/x-pack/plugins/security/public/account_management/user_profile/user_profile.tsx
+++ b/x-pack/plugins/security/public/account_management/user_profile/user_profile.tsx
@@ -22,7 +22,6 @@ import {
EuiIconTip,
EuiKeyPadMenu,
EuiKeyPadMenuItem,
- EuiPageTemplate_Deprecated as EuiPageTemplate,
EuiPopover,
EuiSpacer,
EuiText,
@@ -39,6 +38,7 @@ import type { CoreStart, IUiSettingsClient } from '@kbn/core/public';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n-react';
import { useKibana } from '@kbn/kibana-react-plugin/public';
+import { KibanaPageTemplate } from '@kbn/shared-ux-page-kibana-template';
import type { DarkModeValue, UserProfileData } from '@kbn/user-profile-components';
import { UserAvatar, useUpdateUserProfile } from '@kbn/user-profile-components';
@@ -750,17 +750,16 @@ export const UserProfile: FunctionComponent = ({ user, data })
/>
) : null}
-
+
- ),
- pageTitleProps: { id: titleId },
- rightSideItems: rightSideItems.reverse().map((item) => (
+ }
+ id={titleId}
+ rightSideItems={rightSideItems.reverse().map((item) => (
= ({ user, data })
]}
compressed
/>
- )),
- }}
- bottomBar={formChanges.count > 0 ? : null}
- bottomBarProps={{ paddingSize: 'm', position: 'fixed' }}
- restrictWidth={1000}
- >
-
+ {isCloudUser ? null : (
+
+ )}
+
+
+ {formChanges.count > 0 ? (
+
+
+
+ ) : null}
+
diff --git a/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/create_role_mapping_button/create_role_mapping_button.tsx b/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/create_role_mapping_button/create_role_mapping_button.tsx
index ab9ce044f7b4c..512e46ebfe185 100644
--- a/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/create_role_mapping_button/create_role_mapping_button.tsx
+++ b/x-pack/plugins/security/public/management/role_mappings/role_mappings_grid/create_role_mapping_button/create_role_mapping_button.tsx
@@ -21,7 +21,7 @@ interface CreateRoleMappingButtonProps {
export const CreateRoleMappingButton = ({ history }: CreateRoleMappingButtonProps) => {
return (
renders permission denied if required 1`] = `
-
-
-
-
-
- You need permission to manage roles
-
-
+
+
-
+ You need permission to manage roles
+
+
+
- Contact your system administrator.
-
+
+ Contact your system administrator.
+
+
-
+
`;
diff --git a/x-pack/plugins/security/public/management/roles/roles_grid/permission_denied/permission_denied.tsx b/x-pack/plugins/security/public/management/roles/roles_grid/permission_denied/permission_denied.tsx
index 170327ac24541..77825c4256cce 100644
--- a/x-pack/plugins/security/public/management/roles/roles_grid/permission_denied/permission_denied.tsx
+++ b/x-pack/plugins/security/public/management/roles/roles_grid/permission_denied/permission_denied.tsx
@@ -5,13 +5,13 @@
* 2.0.
*/
-import { EuiEmptyPrompt, EuiPageContent_Deprecated as EuiPageContent } from '@elastic/eui';
+import { EuiEmptyPrompt, EuiPageSection } from '@elastic/eui';
import React from 'react';
import { FormattedMessage } from '@kbn/i18n-react';
export const PermissionDenied = () => (
-
+
(
}
/>
-
+
);
diff --git a/x-pack/plugins/security/public/management/users/users_grid/users_grid_page.tsx b/x-pack/plugins/security/public/management/users/users_grid/users_grid_page.tsx
index fa4fb04099b72..35d54d437d761 100644
--- a/x-pack/plugins/security/public/management/users/users_grid/users_grid_page.tsx
+++ b/x-pack/plugins/security/public/management/users/users_grid/users_grid_page.tsx
@@ -13,8 +13,8 @@ import {
EuiFlexItem,
EuiInMemoryTable,
EuiLink,
- EuiPageContent_Deprecated as EuiPageContent,
EuiPageHeader,
+ EuiPageSection,
EuiSpacer,
EuiSwitch,
} from '@elastic/eui';
@@ -85,7 +85,7 @@ export class UsersGridPage extends Component {
if (permissionDenied) {
return (
-
+
{
}
/>
-
+
);
}
diff --git a/x-pack/plugins/spaces/public/management/edit_space/manage_space_page.tsx b/x-pack/plugins/spaces/public/management/edit_space/manage_space_page.tsx
index f5b82b8fdafd2..fbba203f8e060 100644
--- a/x-pack/plugins/spaces/public/management/edit_space/manage_space_page.tsx
+++ b/x-pack/plugins/spaces/public/management/edit_space/manage_space_page.tsx
@@ -10,9 +10,8 @@ import {
EuiButtonEmpty,
EuiFlexGroup,
EuiFlexItem,
- EuiPageContent_Deprecated as EuiPageContent,
- EuiPageContentBody_Deprecated as EuiPageContentBody,
EuiPageHeader,
+ EuiPageSection,
EuiSpacer,
hexToHsv,
hsvToHex,
@@ -119,9 +118,9 @@ export class ManageSpacePage extends Component {
public render() {
if (!this.props.capabilities.spaces.manage) {
return (
-
+
-
+
);
}
@@ -130,24 +129,24 @@ export class ManageSpacePage extends Component {
}
return (
-
+
{this.getForm()}
-
+
);
}
public getLoadingIndicator = () => (
-
+
-
+
);
public getForm = () => {
diff --git a/x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.tsx b/x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.tsx
index 39fd408930fe9..d557fcdb604bb 100644
--- a/x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.tsx
+++ b/x-pack/plugins/spaces/public/management/spaces_grid/spaces_grid_page.tsx
@@ -12,8 +12,8 @@ import {
EuiInMemoryTable,
EuiLink,
EuiLoadingSpinner,
- EuiPageContent_Deprecated as EuiPageContent,
EuiPageHeader,
+ EuiPageSection,
EuiSpacer,
EuiText,
} from '@elastic/eui';
@@ -108,9 +108,9 @@ export class SpacesGridPage extends Component {
public getPageContent() {
if (!this.props.capabilities.spaces.manage) {
return (
-
+
-
+
);
}