github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-24 09:48:58 -04:00
Code Issues Projects Releases Packages Wiki Activity

Convert AppServices management pages to KibanaPageTemplate (#101779) (#102224)

Browse source 
Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
Anton Dosov 2021-06-16 13:54:23 +02:00 • committed by GitHub
parent af06243af1
commit eeca5d26eb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 772 additions and 683 deletions
Download patch file Download diff file Expand all files Collapse all files

344
src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/__snapshots__/create_index_pattern_wizard.test.tsx.snap generated
View file

@ -14,46 +14,46 @@ exports[`CreateIndexPatternWizard defaults to the loading state 1`] = `
exports[`CreateIndexPatternWizard renders index pattern step when there are indices 1`] = `
<Fragment>
<EuiPageContent>
<Header
docLinks={
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiSpacer
size="l"
/>
<StepIndexPattern
allIndices={
Array [
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
"name": "myIndexPattern",
},
]
}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiHorizontalRule />
<StepIndexPattern
allIndices={
Array [
Object {
"name": "myIndexPattern",
},
]
}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
}
showSystemIndices={true}
/>
</EuiPageContent>
}
showSystemIndices={true}
/>
<EuiGlobalToastList
dismissToast={[Function]}
side="right"
@ -65,40 +65,40 @@ exports[`CreateIndexPatternWizard renders index pattern step when there are indi
exports[`CreateIndexPatternWizard renders the empty state when there are no indices 1`] = `
<Fragment>
<EuiPageContent>
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiHorizontalRule />
<StepIndexPattern
allIndices={Array []}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiSpacer
size="l"
/>
<StepIndexPattern
allIndices={Array []}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
showSystemIndices={true}
/>
</EuiPageContent>
}
showSystemIndices={true}
/>
<EuiGlobalToastList
dismissToast={[Function]}
side="right"
@ -110,40 +110,40 @@ exports[`CreateIndexPatternWizard renders the empty state when there are no indi
exports[`CreateIndexPatternWizard renders time field step when step is set to 2 1`] = `
<Fragment>
<EuiPageContent>
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiHorizontalRule />
<StepTimeField
createIndexPattern={[Function]}
goToPreviousStep={[Function]}
indexPattern=""
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiSpacer
size="l"
/>
<StepTimeField
createIndexPattern={[Function]}
goToPreviousStep={[Function]}
indexPattern=""
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
/>
</EuiPageContent>
}
/>
<EuiGlobalToastList
dismissToast={[Function]}
side="right"
@ -155,40 +155,40 @@ exports[`CreateIndexPatternWizard renders time field step when step is set to 2
exports[`CreateIndexPatternWizard renders when there are no indices but there are remote clusters 1`] = `
<Fragment>
<EuiPageContent>
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiHorizontalRule />
<StepIndexPattern
allIndices={Array []}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiSpacer
size="l"
/>
<StepIndexPattern
allIndices={Array []}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
showSystemIndices={true}
/>
</EuiPageContent>
}
showSystemIndices={true}
/>
<EuiGlobalToastList
dismissToast={[Function]}
side="right"
@ -200,46 +200,46 @@ exports[`CreateIndexPatternWizard renders when there are no indices but there ar
exports[`CreateIndexPatternWizard shows system indices even if there are no other indices if the include system indices is toggled 1`] = `
<Fragment>
<EuiPageContent>
<Header
docLinks={
<Header
docLinks={
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiSpacer
size="l"
/>
<StepIndexPattern
allIndices={
Array [
Object {
"DOC_LINK_VERSION": "jest",
"ELASTIC_WEBSITE_URL": "htts://jestTest.elastic.co",
"links": Object {
"indexPatterns": Object {},
"runtimeFields": Object {},
"scriptedFields": Object {},
},
}
"name": ".kibana ",
},
]
}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
indexPatternName="name"
isBeta={false}
prompt={null}
/>
<EuiHorizontalRule />
<StepIndexPattern
allIndices={
Array [
Object {
"name": ".kibana ",
},
]
}
goToNextStep={[Function]}
indexPatternCreationType={
IndexPatternCreationConfig {
"httpClient": null,
"isBeta": false,
"key": "default",
"name": "name",
"showSystemIndices": true,
"type": "default",
}
}
showSystemIndices={true}
/>
</EuiPageContent>
}
showSystemIndices={true}
/>
<EuiGlobalToastList
dismissToast={[Function]}
side="right"

717
src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/header/__snapshots__/header.test.tsx.snap generated
View file

@ -17,121 +17,178 @@ exports[`Header should render a different name, prompt, and beta tag if provided
</div>
}
>
<div>
<EuiTitle>
<h1
className="euiTitle euiTitle--medium"
>
<EuiPageHeader
bottomBorder={true}
pageTitle={
<React.Fragment>
Create test index pattern
<EuiBetaBadge
label="Beta"
>
<span
className="euiBetaBadge"
title="Beta"
>
Beta
</span>
</EuiBetaBadge>
</h1>
</EuiTitle>
<EuiSpacer
size="s"
<React.Fragment>
<EuiBetaBadge
label="Beta"
/>
</React.Fragment>
</React.Fragment>
}
>
<header
className="euiPageHeader euiPageHeader--bottomBorder euiPageHeader--responsive euiPageHeader--center"
>
<div
className="euiSpacer euiSpacer--s"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
<EuiPageHeaderContent
pageTitle={
<React.Fragment>
Create test index pattern
<React.Fragment>
<EuiBetaBadge
label="Beta"
/>
</React.Fragment>
</React.Fragment>
}
responsive={true}
>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
<div
className="euiPageHeaderContent"
>
<EuiFlexGroup
alignItems="flexStart"
className="euiPageHeaderContent__top"
gutterSize="l"
responsive={true}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
<div
className="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsFlexStart euiFlexGroup--directionRow euiFlexGroup--responsive euiPageHeaderContent__top"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
<EuiFlexItem>
<div
className="euiFlexItem"
>
<EuiTitle
size="l"
>
<h1
className="euiTitle euiTitle--large"
>
Create test index pattern
<EuiBetaBadge
label="Beta"
>
<span
className="euiBetaBadge"
title="Beta"
>
Beta
</span>
</EuiBetaBadge>
</h1>
</EuiTitle>
</div>
</EuiFlexItem>
</div>
</EuiFlexGroup>
<div
className="euiPageHeaderContent__bottom"
>
<EuiSpacer>
<div
className="euiSpacer euiSpacer--l"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
<EuiSpacer
size="m"
>
<div
className="euiSpacer euiSpacer--m"
/>
</EuiSpacer>
<div>
Test prompt
</div>
</div>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
<EuiSpacer
size="m"
>
<div
className="euiSpacer euiSpacer--m"
/>
</EuiSpacer>
<div>
Test prompt
</div>
</div>
</div>
</EuiPageHeaderContent>
</header>
</EuiPageHeader>
</Header>
`;
@ -146,100 +203,145 @@ exports[`Header should render normally 1`] = `
}
indexPatternName="test index pattern"
>
<div>
<EuiTitle>
<h1
className="euiTitle euiTitle--medium"
>
<EuiPageHeader
bottomBorder={true}
pageTitle={
<React.Fragment>
Create test index pattern
</h1>
</EuiTitle>
<EuiSpacer
size="s"
</React.Fragment>
}
>
<header
className="euiPageHeader euiPageHeader--bottomBorder euiPageHeader--responsive euiPageHeader--center"
>
<div
className="euiSpacer euiSpacer--s"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
<EuiPageHeaderContent
pageTitle={
<React.Fragment>
Create test index pattern
</React.Fragment>
}
responsive={true}
>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
<div
className="euiPageHeaderContent"
>
<EuiFlexGroup
alignItems="flexStart"
className="euiPageHeaderContent__top"
gutterSize="l"
responsive={true}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
<div
className="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsFlexStart euiFlexGroup--directionRow euiFlexGroup--responsive euiPageHeaderContent__top"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
<EuiFlexItem>
<div
className="euiFlexItem"
>
<EuiTitle
size="l"
>
<h1
className="euiTitle euiTitle--large"
>
Create test index pattern
</h1>
</EuiTitle>
</div>
</EuiFlexItem>
</div>
</EuiFlexGroup>
<div
className="euiPageHeaderContent__bottom"
>
<EuiSpacer>
<div
className="euiSpacer euiSpacer--l"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
</div>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
</div>
</div>
</EuiPageHeaderContent>
</header>
</EuiPageHeader>
</Header>
`;
@ -254,99 +356,144 @@ exports[`Header should render without including system indices 1`] = `
}
indexPatternName="test index pattern"
>
<div>
<EuiTitle>
<h1
className="euiTitle euiTitle--medium"
>
<EuiPageHeader
bottomBorder={true}
pageTitle={
<React.Fragment>
Create test index pattern
</h1>
</EuiTitle>
<EuiSpacer
size="s"
</React.Fragment>
}
>
<header
className="euiPageHeader euiPageHeader--bottomBorder euiPageHeader--responsive euiPageHeader--center"
>
<div
className="euiSpacer euiSpacer--s"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
<EuiPageHeaderContent
pageTitle={
<React.Fragment>
Create test index pattern
</React.Fragment>
}
responsive={true}
>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
<div
className="euiPageHeaderContent"
>
<EuiFlexGroup
alignItems="flexStart"
className="euiPageHeaderContent__top"
gutterSize="l"
responsive={true}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
<div
className="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--alignItemsFlexStart euiFlexGroup--directionRow euiFlexGroup--responsive euiPageHeaderContent__top"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
<EuiFlexItem>
<div
className="euiFlexItem"
>
<EuiTitle
size="l"
>
<h1
className="euiTitle euiTitle--large"
>
Create test index pattern
</h1>
</EuiTitle>
</div>
</EuiFlexItem>
</div>
</EuiFlexGroup>
<div
className="euiPageHeaderContent__bottom"
>
<EuiSpacer>
<div
className="euiSpacer euiSpacer--l"
/>
</EuiSpacer>
<EuiText>
<div
className="euiText euiText--medium"
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
</div>
<p>
<FormattedMessage
defaultMessage="An index pattern can match a single source, for example, {single}, or {multiple} data sources, {star}."
id="indexPatternManagement.createIndexPattern.description"
values={
Object {
"multiple": <strong>
multiple
</strong>,
"single": <EuiCode>
filebeat-4-3-22
</EuiCode>,
"star": <EuiCode>
filebeat-*
</EuiCode>,
}
}
>
<span>
An index pattern can match a single source, for example,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-4-3-22
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
, or
<strong>
multiple
</strong>
data sources,
<EuiCode>
<EuiCodeBlockImpl
inline={true}
>
<span>
<code>
filebeat-*
</code>
</span>
</EuiCodeBlockImpl>
</EuiCode>
.
</span>
</FormattedMessage>
<br />
<EuiLink
external={true}
target="_blank"
>
<button
className="euiLink euiLink--primary"
disabled={false}
type="button"
>
<FormattedMessage
defaultMessage="Read documentation"
id="indexPatternManagement.createIndexPattern.documentation"
values={Object {}}
>
<span>
Read documentation
</span>
</FormattedMessage>
</button>
</EuiLink>
</p>
</div>
</EuiText>
</div>
</div>
</EuiPageHeaderContent>
</header>
</EuiPageHeader>
</Header>
`;

17
src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/components/header/header.tsx
View file

@ -8,7 +8,7 @@
import React from 'react';
import { EuiBetaBadge, EuiSpacer, EuiTitle, EuiText, EuiCode, EuiLink } from '@elastic/eui';
import { EuiBetaBadge, EuiCode, EuiLink, EuiPageHeader, EuiSpacer, EuiText } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
@ -39,9 +39,9 @@ export const Header = ({
changeTitle(createIndexPatternHeader);
return (
<div>
<EuiTitle>
<h1>
<EuiPageHeader
pageTitle={
<>
{createIndexPatternHeader}
{isBeta ? (
<>
@ -53,9 +53,10 @@ export const Header = ({
/>
</>
) : null}
</h1>
</EuiTitle>
<EuiSpacer size="s" />
</>
}
bottomBorder
>
<EuiText>
<p>
<FormattedMessage
@ -82,6 +83,6 @@ export const Header = ({
{prompt}
</>
) : null}
</div>
</EuiPageHeader>
);
};

23
src/plugins/index_pattern_management/public/components/create_index_pattern_wizard/create_index_pattern_wizard.tsx
View file

@ -6,17 +6,12 @@
* Side Public License, v 1.
*/
import React, { ReactElement, Component } from 'react';
import React, { Component, ReactElement } from 'react';
import {
EuiGlobalToastList,
EuiGlobalToastListToast,
EuiPageContent,
EuiHorizontalRule,
} from '@elastic/eui';
import { EuiGlobalToastList, EuiGlobalToastListToast, EuiSpacer } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import { withRouter, RouteComponentProps } from 'react-router-dom';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import { DocLinksStart } from 'src/core/public';
import { StepIndexPattern } from './components/step_index_pattern';
import { StepTimeField } from './components/step_time_field';
@ -222,9 +217,9 @@ export class CreateIndexPatternWizard extends Component<
const initialQuery = new URLSearchParams(location.search).get('id') || undefined;
return (
<EuiPageContent>
<>
{header}
<EuiHorizontalRule />
<EuiSpacer size={'l'} />
<StepIndexPattern
allIndices={allIndices}
initialQuery={indexPattern || initialQuery}
@ -234,15 +229,15 @@ export class CreateIndexPatternWizard extends Component<
this.state.indexPatternCreationType.getShowSystemIndices() && this.state.step === 1
}
/>
</EuiPageContent>
</>
);
}
if (step === 2) {
return (
<EuiPageContent>
<>
{header}
<EuiHorizontalRule />
<EuiSpacer size={'l'} />
<StepTimeField
indexPattern={indexPattern}
goToPreviousStep={this.goToIndexPatternStep}
@ -250,7 +245,7 @@ export class CreateIndexPatternWizard extends Component<
indexPatternCreationType={this.state.indexPatternCreationType}
selectedTimeField={this.state.selectedTimeField}
/>
</EuiPageContent>
</>
);
}

38
src/plugins/index_pattern_management/public/components/edit_index_pattern/create_edit_field/create_edit_field.tsx
View file

@ -7,15 +7,15 @@
*/
import React from 'react';
import { withRouter, RouteComponentProps } from 'react-router-dom';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import { EuiFlexGroup, EuiFlexItem, EuiPanel } from '@elastic/eui';
import { EuiSpacer } from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { IndexPattern, IndexPatternField } from '../../../../../../plugins/data/public';
import { useKibana } from '../../../../../../plugins/kibana_react/public';
import { IndexPatternManagmentContext } from '../../../types';
import { IndexHeader } from '../index_header';
import { TAB_SCRIPTED_FIELDS, TAB_INDEXED_FIELDS } from '../constants';
import { TAB_INDEXED_FIELDS, TAB_SCRIPTED_FIELDS } from '../constants';
import { FieldEditor } from '../../field_editor';
@ -76,26 +76,18 @@ export const CreateEditField = withRouter(
if (spec) {
return (
<EuiPanel paddingSize={'l'}>
<EuiFlexGroup direction="column">
<EuiFlexItem>
<IndexHeader
indexPattern={indexPattern}
defaultIndex={uiSettings.get('defaultIndex')}
/>
</EuiFlexItem>
<EuiFlexItem>
<FieldEditor
indexPattern={indexPattern}
spec={spec}
services={{
indexPatternService: data.indexPatterns,
redirectAway,
}}
/>
</EuiFlexItem>
</EuiFlexGroup>
</EuiPanel>
<>
<IndexHeader indexPattern={indexPattern} defaultIndex={uiSettings.get('defaultIndex')} />
<EuiSpacer size={'l'} />
<FieldEditor
indexPattern={indexPattern}
spec={spec}
services={{
indexPatternService: data.indexPatterns,
redirectAway,
}}
/>
</>
);
} else {
return <></>;

43
src/plugins/index_pattern_management/public/components/edit_index_pattern/edit_index_pattern.tsx
View file

@ -17,7 +17,6 @@ import {
EuiText,
EuiLink,
EuiCallOut,
EuiPanel,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage } from '@kbn/i18n/react';
@ -145,15 +144,13 @@ export const EditIndexPattern = withRouter(
const kibana = useKibana();
const docsUrl = kibana.services.docLinks!.links.elasticsearch.mapping;
return (
<EuiPanel paddingSize={'l'}>
<div data-test-subj="editIndexPattern" role="region" aria-label={headingAriaLabel}>
<IndexHeader
indexPattern={indexPattern}
setDefault={setDefaultPattern}
deleteIndexPatternClick={removePattern}
defaultIndex={defaultIndex}
/>
<EuiSpacer size="s" />
<div data-test-subj="editIndexPattern" role="region" aria-label={headingAriaLabel}>
<IndexHeader
indexPattern={indexPattern}
setDefault={setDefaultPattern}
deleteIndexPatternClick={removePattern}
defaultIndex={defaultIndex}
>
{showTagsSection && (
<EuiFlexGroup wrap>
{Boolean(indexPattern.timeFieldName) && (
@ -193,19 +190,19 @@ export const EditIndexPattern = withRouter(
</EuiCallOut>
</>
)}
<EuiSpacer />
<Tabs
indexPattern={indexPattern}
saveIndexPattern={data.indexPatterns.updateSavedObject.bind(data.indexPatterns)}
fields={fields}
history={history}
location={location}
refreshFields={() => {
setFields(indexPattern.getNonScriptedFields());
}}
/>
</div>
</EuiPanel>
</IndexHeader>
<EuiSpacer />
<Tabs
indexPattern={indexPattern}
saveIndexPattern={data.indexPatterns.updateSavedObject.bind(data.indexPatterns)}
fields={fields}
history={history}
location={location}
refreshFields={() => {
setFields(indexPattern.getNonScriptedFields());
}}
/>
</div>
);
}
);

76
src/plugins/index_pattern_management/public/components/edit_index_pattern/index_header/index_header.tsx
View file

@ -8,7 +8,7 @@
import React from 'react';
import { i18n } from '@kbn/i18n';
import { EuiFlexGroup, EuiToolTip, EuiFlexItem, EuiTitle, EuiButtonIcon } from '@elastic/eui';
import { EuiButtonIcon, EuiPageHeader, EuiToolTip } from '@elastic/eui';
import { IIndexPattern } from 'src/plugins/data/public';
interface IndexHeaderProps {
@ -40,50 +40,42 @@ const removeTooltip = i18n.translate('indexPatternManagement.editIndexPattern.re
defaultMessage: 'Remove index pattern.',
});
export function IndexHeader({
export const IndexHeader: React.FC<IndexHeaderProps> = ({
defaultIndex,
indexPattern,
setDefault,
deleteIndexPatternClick,
}: IndexHeaderProps) {
children,
}) => {
return (
<EuiFlexGroup justifyContent="spaceBetween" alignItems="center">
<EuiFlexItem>
<EuiTitle>
<h1 data-test-subj="indexPatternTitle">{indexPattern.title}</h1>
</EuiTitle>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiFlexGroup responsive={false}>
{defaultIndex !== indexPattern.id && setDefault && (
<EuiFlexItem>
<EuiToolTip content={setDefaultTooltip}>
<EuiButtonIcon
color="text"
onClick={setDefault}
iconType="starFilled"
aria-label={setDefaultAriaLabel}
data-test-subj="setDefaultIndexPatternButton"
/>
</EuiToolTip>
</EuiFlexItem>
)}
{deleteIndexPatternClick && (
<EuiFlexItem>
<EuiToolTip content={removeTooltip}>
<EuiButtonIcon
color="danger"
onClick={deleteIndexPatternClick}
iconType="trash"
aria-label={removeAriaLabel}
data-test-subj="deleteIndexPatternButton"
/>
</EuiToolTip>
</EuiFlexItem>
)}
</EuiFlexGroup>
</EuiFlexItem>
</EuiFlexGroup>
<EuiPageHeader
pageTitle={<span data-test-subj="indexPatternTitle">{indexPattern.title}</span>}
rightSideItems={[
defaultIndex !== indexPattern.id && setDefault && (
<EuiToolTip content={setDefaultTooltip}>
<EuiButtonIcon
color="text"
onClick={setDefault}
iconType="starFilled"
aria-label={setDefaultAriaLabel}
data-test-subj="setDefaultIndexPatternButton"
/>
</EuiToolTip>
),
deleteIndexPatternClick && (
<EuiToolTip content={removeTooltip}>
<EuiButtonIcon
color="danger"
onClick={deleteIndexPatternClick}
iconType="trash"
aria-label={removeAriaLabel}
data-test-subj="deleteIndexPatternButton"
/>
</EuiToolTip>
),
].filter(Boolean)}
>
{children}
</EuiPageHeader>
);
}
};

2
src/plugins/index_pattern_management/public/components/index_pattern_table/empty_index_pattern_prompt/__snapshots__/empty_index_pattern_prompt.test.tsx.snap generated
View file

@ -3,9 +3,11 @@
exports[`EmptyIndexPatternPrompt should render normally 1`] = `
<EuiPageContent
className="inpEmptyIndexPatternPrompt"
color="subdued"
data-test-subj="emptyIndexPatternPrompt"
grow={false}
horizontalPosition="center"
verticalPosition="center"
>
<EuiFlexGroup
alignItems="center"

2
src/plugins/index_pattern_management/public/components/index_pattern_table/empty_index_pattern_prompt/empty_index_pattern_prompt.tsx
View file

@ -41,7 +41,9 @@ export const EmptyIndexPatternPrompt = ({
data-test-subj="emptyIndexPatternPrompt"
className="inpEmptyIndexPatternPrompt"
grow={false}
verticalPosition="center"
horizontalPosition="center"
color="subdued"
>
<EuiFlexGroup gutterSize="xl" alignItems="center" direction="rowReverse" wrap>
<EuiFlexItem grow={1} className="inpEmptyIndexPatternPrompt__illustration">

2
src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/__snapshots__/empty_state.test.tsx.snap generated
View file

@ -4,9 +4,11 @@ exports[`EmptyState should render normally 1`] = `
<Fragment>
<EuiPageContent
className="inpEmptyState"
color="subdued"
data-test-subj="indexPatternEmptyState"
grow={false}
horizontalPosition="center"
verticalPosition="center"
>
<EuiPageContentHeader>
<EuiPageContentHeaderSection>

4
src/plugins/index_pattern_management/public/components/index_pattern_table/empty_state/empty_state.tsx
View file

@ -63,8 +63,10 @@ export const EmptyState = ({
<EuiPageContent
className="inpEmptyState"
grow={false}
horizontalPosition="center"
data-test-subj="indexPatternEmptyState"
verticalPosition="center"
horizontalPosition="center"
color="subdued"
>
<EuiPageContentHeader>
<EuiPageContentHeaderSection>

58
src/plugins/index_pattern_management/public/components/index_pattern_table/index_pattern_table.tsx
View file

@ -8,24 +8,20 @@
import {
EuiBadge,
EuiButtonEmpty,
EuiFlexGroup,
EuiFlexItem,
EuiInMemoryTable,
EuiSpacer,
EuiText,
EuiBadgeGroup,
EuiPageContent,
EuiTitle,
EuiButtonEmpty,
EuiInMemoryTable,
EuiPageHeader,
EuiSpacer,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
import { withRouter, RouteComponentProps } from 'react-router-dom';
import React, { useState, useEffect } from 'react';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import React, { useEffect, useState } from 'react';
import { i18n } from '@kbn/i18n';
import { reactRouterNavigate, useKibana } from '../../../../../plugins/kibana_react/public';
import { IndexPatternManagmentContext } from '../../types';
import { CreateButton } from '../create_button';
import { IndexPatternTableItem, IndexPatternCreationOption } from '../types';
import { IndexPatternCreationOption, IndexPatternTableItem } from '../types';
import { getIndexPatterns } from '../utils';
import { getListBreadcrumbs } from '../breadcrumbs';
import { EmptyState } from './empty_state';
@ -54,10 +50,6 @@ const search = {
},
};
const ariaRegion = i18n.translate('indexPatternManagement.editIndexPatternLiveRegionAriaLabel', {
defaultMessage: 'Index patterns',
});
const title = i18n.translate('indexPatternManagement.indexPatternTable.title', {
defaultMessage: 'Index patterns',
});
@ -199,25 +191,21 @@ export const IndexPatternTable = ({ canSave, history }: Props) => {
}
return (
<EuiPageContent data-test-subj="indexPatternTable" role="region" aria-label={ariaRegion}>
<EuiFlexGroup justifyContent="spaceBetween">
<EuiFlexItem grow={false}>
<EuiTitle>
<h2>{title}</h2>
</EuiTitle>
<EuiSpacer size="s" />
<EuiText>
<p>
<FormattedMessage
id="indexPatternManagement.indexPatternTable.indexPatternExplanation"
defaultMessage="Create and manage the index patterns that help you retrieve your data from Elasticsearch."
/>
</p>
</EuiText>
</EuiFlexItem>
<EuiFlexItem grow={false}>{createButton}</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer />
<div data-test-subj="indexPatternTable" role="region" aria-label={title}>
<EuiPageHeader
pageTitle={title}
description={
<FormattedMessage
id="indexPatternManagement.indexPatternTable.indexPatternExplanation"
defaultMessage="Create and manage the index patterns that help you retrieve your data from Elasticsearch."
/>
}
bottomBorder
rightSideItems={[createButton]}
/>
<EuiSpacer size="l" />
<EuiInMemoryTable
allowNeutralSort={false}
itemId="id"
@ -228,7 +216,7 @@ export const IndexPatternTable = ({ canSave, history }: Props) => {
sorting={sorting}
search={search}
/>
</EuiPageContent>
</div>
);
};

81
x-pack/plugins/data_enhanced/public/search/sessions_mgmt/components/main.tsx
View file

@ -5,25 +5,15 @@
* 2.0.
*/
import {
EuiButtonEmpty,
EuiFlexGroup,
EuiFlexItem,
EuiHorizontalRule,
EuiPageBody,
EuiPageContent,
EuiSpacer,
EuiTitle,
} from '@elastic/eui';
import { EuiButtonEmpty, EuiPageHeader, EuiSpacer } from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
import type { CoreStart, HttpStart } from 'kibana/public';
import React from 'react';
import type { SessionsConfigSchema } from '../';
import { IManagementSectionsPluginsSetup } from '../';
import type { SearchSessionsMgmtAPI } from '../lib/api';
import type { AsyncSearchIntroDocumentation } from '../lib/documentation';
import { TableText } from './';
import { SearchSessionsMgmtTable } from './table';
import { IManagementSectionsPluginsSetup } from '../';
interface Props {
documentation: AsyncSearchIntroDocumentation;
@ -37,46 +27,37 @@ interface Props {
export function SearchSessionsMgmtMain({ documentation, ...tableProps }: Props) {
return (
<EuiPageBody component="div">
<EuiPageContent>
<EuiFlexGroup>
<EuiFlexItem grow={true}>
<EuiTitle size="l">
<h1>
<FormattedMessage
id="xpack.data.mgmt.searchSessions.main.sectionTitle"
defaultMessage="Search Sessions"
/>
</h1>
</EuiTitle>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButtonEmpty
href={documentation.getElasticsearchDocLink()}
target="_blank"
iconType="help"
>
<FormattedMessage
id="xpack.data.mgmt.searchSessions.main.backgroundSessionsDocsLinkText"
defaultMessage="Documentation"
/>
</EuiButtonEmpty>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer size="s" />
<TableText>
<p>
<>
<EuiPageHeader
pageTitle={
<FormattedMessage
id="xpack.data.mgmt.searchSessions.main.sectionTitle"
defaultMessage="Search Sessions"
/>
}
description={
<FormattedMessage
id="xpack.data.mgmt.searchSessions.main.sectionDescription"
defaultMessage="Manage your saved search sessions."
/>
}
bottomBorder
rightSideItems={[
<EuiButtonEmpty
href={documentation.getElasticsearchDocLink()}
target="_blank"
iconType="help"
>
<FormattedMessage
id="xpack.data.mgmt.searchSessions.main.sectionDescription"
defaultMessage="Manage your saved search sessions."
id="xpack.data.mgmt.searchSessions.main.backgroundSessionsDocsLinkText"
defaultMessage="Documentation"
/>
</p>
</TableText>
</EuiButtonEmpty>,
]}
/>
<EuiHorizontalRule />
<SearchSessionsMgmtTable data-test-subj="search-sessions-mgmt-table" {...tableProps} />
</EuiPageContent>
</EuiPageBody>
<EuiSpacer size="l" />
<SearchSessionsMgmtTable data-test-subj="search-sessions-mgmt-table" {...tableProps} />
</>
);
}

46
x-pack/plugins/reporting/public/components/report_listing.tsx
View file

@ -9,11 +9,10 @@ import {
EuiBasicTable,
EuiFlexGroup,
EuiFlexItem,
EuiPageContent,
EuiPageHeader,
EuiSpacer,
EuiText,
EuiTextColor,
EuiTitle,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
import { FormattedMessage, InjectedIntl, injectI18n } from '@kbn/i18n/react';
@ -139,38 +138,29 @@ class ReportListingUi extends Component<Props, State> {
public render() {
return (
<div>
<EuiPageContent horizontalPosition="center" className="euiPageBody--restrictWidth-default">
<EuiFlexGroup justifyContent="spaceBetween">
<EuiFlexItem grow={false}>
<EuiTitle>
<h1>
<FormattedMessage
id="xpack.reporting.listing.reportstitle"
defaultMessage="Reports"
/>
</h1>
</EuiTitle>
<EuiText color="subdued" size="s">
<p>
<FormattedMessage
id="xpack.reporting.listing.reports.subtitle"
defaultMessage="Get reports generated in Kibana applications."
/>
</p>
</EuiText>
</EuiFlexItem>
</EuiFlexGroup>
<EuiSpacer />
{this.renderTable()}
</EuiPageContent>
<>
<EuiPageHeader
pageTitle={
<FormattedMessage id="xpack.reporting.listing.reportstitle" defaultMessage="Reports" />
}
description={
<FormattedMessage
id="xpack.reporting.listing.reports.subtitle"
defaultMessage="Get reports generated in Kibana applications."
/>
}
/>
<EuiSpacer size={'l'} />
{this.renderTable()}
<EuiSpacer size="s" />
<EuiFlexGroup justifyContent="spaceBetween" direction="rowReverse">
<EuiFlexItem grow={false}>
<ReportDiagnostic apiClient={this.props.apiClient} />
</EuiFlexItem>
</EuiFlexGroup>
</div>
</>
);
}

1
x-pack/plugins/translations/translations/ja-JP.json
View file

@ -3034,7 +3034,6 @@
"indexPatternManagement.editIndexPattern.timeFilterHeader": "時刻フィールド：「{timeFieldName}」",
"indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink": "フィールドマッピング",
"indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail": "{indexPatternTitle}でフィールドを表示して編集します。型や検索可否などのフィールド属性はElasticsearchで{mappingAPILink}に基づきます。",
"indexPatternManagement.editIndexPatternLiveRegionAriaLabel": "インデックスパターン",
"indexPatternManagement.emptyIndexPatternPrompt.documentation": "ドキュメンテーションを表示",
"indexPatternManagement.emptyIndexPatternPrompt.indexPatternExplanation": "Kibanaでは、検索するインデックスを特定するためにインデックスパターンが必要です。インデックスパターンは、昨日のログデータなど特定のインデックス、またはログデータを含むすべてのインデックスを参照できます。",
"indexPatternManagement.emptyIndexPatternPrompt.learnMore": "詳細について",

1
x-pack/plugins/translations/translations/zh-CN.json
View file

@ -3055,7 +3055,6 @@
"indexPatternManagement.editIndexPattern.timeFilterHeader": "时间字段：“{timeFieldName}”",
"indexPatternManagement.editIndexPattern.timeFilterLabel.mappingAPILink": "字段映射",
"indexPatternManagement.editIndexPattern.timeFilterLabel.timeFilterDetail": "查看和编辑 {indexPatternTitle} 中的字段。字段属性，如类型和可搜索性，基于 Elasticsearch 中的 {mappingAPILink}。",
"indexPatternManagement.editIndexPatternLiveRegionAriaLabel": "索引模式",
"indexPatternManagement.emptyIndexPatternPrompt.documentation": "阅读文档",
"indexPatternManagement.emptyIndexPatternPrompt.indexPatternExplanation": "Kibana 需要索引模式，以识别您要浏览的索引。索引模式可以指向特定索引 (例如昨天的日志数据) ，或包含日志数据的所有索引。",
"indexPatternManagement.emptyIndexPatternPrompt.learnMore": "希望了解详情？",