Updates deprecated EUI components in locators example plugins (#163405)

## Summary

Partially addresses https://github.com/elastic/kibana/issues/161425

New look:

<img width="2017" alt="image"
src="313fe761-2060-4b7b-b5d3-3f655d2cec02">
This commit is contained in:
Vadim Kibana 2023-08-08 16:55:38 +02:00 committed by GitHub
parent 7025a7bdab
commit c52327492f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 29 additions and 28 deletions

View file

@ -9,13 +9,10 @@
import React from 'react'; import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import { EuiPageBody } from '@elastic/eui'; import { EuiPageBody, EuiPageTemplate, EuiPageSection, EuiText } from '@elastic/eui';
import { EuiPageContent_Deprecated as EuiPageContent } from '@elastic/eui';
import { EuiPageContentBody_Deprecated as EuiPageContentBody } from '@elastic/eui';
import { Redirect, useLocation } from 'react-router-dom'; import { Redirect, useLocation } from 'react-router-dom';
import { Router, Routes as RouterRoutes, Route } from '@kbn/shared-ux-router'; import { Router, Routes as RouterRoutes, Route } from '@kbn/shared-ux-router';
import { createBrowserHistory } from 'history'; import { createBrowserHistory } from 'history';
import { EuiText } from '@elastic/eui';
import { AppMountParameters } from '@kbn/core/public'; import { AppMountParameters } from '@kbn/core/public';
function useQuery() { function useQuery() {
@ -38,8 +35,8 @@ export const Routes: React.FC<{}> = () => {
return ( return (
<EuiPageBody> <EuiPageBody>
<EuiPageContent> <EuiPageTemplate.Section>
<EuiPageContentBody> <EuiPageSection>
<RouterRoutes> <RouterRoutes>
<Route path="/hello"> <Route path="/hello">
<HelloPage <HelloPage
@ -49,8 +46,8 @@ export const Routes: React.FC<{}> = () => {
</Route> </Route>
<Redirect from="/" to="/hello" /> <Redirect from="/" to="/hello" />
</RouterRoutes> </RouterRoutes>
</EuiPageContentBody> </EuiPageSection>
</EuiPageContent> </EuiPageTemplate.Section>
</EuiPageBody> </EuiPageBody>
); );
}; };

View file

@ -8,16 +8,18 @@
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import { EuiPage } from '@elastic/eui'; import {
import { EuiButton } from '@elastic/eui'; EuiPage,
import { EuiPageBody } from '@elastic/eui'; EuiButton,
import { EuiPageContent_Deprecated as EuiPageContent } from '@elastic/eui'; EuiPageBody,
import { EuiPageContentBody_Deprecated as EuiPageContentBody } from '@elastic/eui'; EuiPageTemplate,
import { EuiSpacer } from '@elastic/eui'; EuiPageSection,
import { EuiText } from '@elastic/eui'; EuiSpacer,
import { EuiFieldText } from '@elastic/eui'; EuiText,
import { EuiPageHeader } from '@elastic/eui'; EuiFieldText,
import { EuiLink } from '@elastic/eui'; EuiPageHeader,
EuiLink,
} from '@elastic/eui';
import { AppMountParameters } from '@kbn/core/public'; import { AppMountParameters } from '@kbn/core/public';
import { SharePluginSetup } from '@kbn/share-plugin/public'; import { SharePluginSetup } from '@kbn/share-plugin/public';
import { import {
@ -112,9 +114,11 @@ const ActionsExplorer = ({ share }: Props) => {
return ( return (
<EuiPage> <EuiPage>
<EuiPageBody> <EuiPageBody>
<EuiPageHeader>Locator explorer</EuiPageHeader> <EuiPageSection>
<EuiPageContent> <EuiPageHeader pageTitle="Locator Explorer" />
<EuiPageContentBody> </EuiPageSection>
<EuiPageTemplate.Section>
<EuiPageSection>
<EuiText> <EuiText>
<p>Create new links using the most recent version of a locator.</p> <p>Create new links using the most recent version of a locator.</p>
</EuiText> </EuiText>
@ -178,8 +182,8 @@ const ActionsExplorer = ({ share }: Props) => {
</React.Fragment> </React.Fragment>
)) ))
)} )}
</EuiPageContentBody> </EuiPageSection>
</EuiPageContent> </EuiPageTemplate.Section>
</EuiPageBody> </EuiPageBody>
</EuiPage> </EuiPage>
); );

View file

@ -10,8 +10,8 @@ import React from 'react';
import { import {
EuiPageBody, EuiPageBody,
EuiPageContent_Deprecated as EuiPageContent, EuiPageTemplate,
EuiPageContentBody_Deprecated as EuiPageContentBody, EuiPageSection,
EuiPageHeader, EuiPageHeader,
EuiPageHeaderSection, EuiPageHeaderSection,
EuiTitle, EuiTitle,
@ -32,9 +32,9 @@ export function Page({ title, children }: PageProps) {
</EuiTitle> </EuiTitle>
</EuiPageHeaderSection> </EuiPageHeaderSection>
</EuiPageHeader> </EuiPageHeader>
<EuiPageContent> <EuiPageTemplate.Section>
<EuiPageContentBody>{children}</EuiPageContentBody> <EuiPageSection>{children}</EuiPageSection>
</EuiPageContent> </EuiPageTemplate.Section>
</EuiPageBody> </EuiPageBody>
); );
} }