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

Snapshots title ie11 misalignment (#48802) (#49912)

Browse source 
* Removed Flexbox around header and link elements.

* Removed unused EUI component

* Added class to include the ellipses when name is truncated.

* Fixed title in policy_details.tsx

* Fixed buttons and title on policy and repository table.

* Linting fixes.

* Removed unused references.

* Added keys to arrays of elements to resolve React errors.
This commit is contained in:
John Dorlus 2019-10-31 13:32:47 -07:00 • committed by GitHub
parent faa854edb9
commit 4dc3e7c4f9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 103 additions and 131 deletions
Download patch file Download diff file Expand all files Collapse all files

78
x-pack/legacy/plugins/snapshot_restore/public/app/sections/home/policy_list/policy_details/policy_details.tsx
View file

@ -20,6 +20,7 @@ import {
EuiContextMenu,
EuiButtonIcon,
EuiLink,
EuiSpacer,
} from '@elastic/eui';
import { SlmPolicy } from '../../../../../../common/types';
@ -302,49 +303,40 @@ export const PolicyDetails: React.FunctionComponent<Props> = ({
maxWidth={550}
>
<EuiFlyoutHeader>
<EuiFlexGroup direction="column" gutterSize="none">
<EuiFlexItem>
<EuiTitle size="m">
<EuiFlexGroup alignItems="center" gutterSize="s">
<EuiFlexItem grow={false}>
<h2 id="srPolicyDetailsFlyoutTitle" data-test-subj="title">
{policyName}
</h2>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButtonIcon
iconType="refresh"
color="subdued"
aria-label={i18n.translate(
'xpack.snapshotRestore.policyDetails.reloadButtonAriaLabel',
{ defaultMessage: 'Reload' }
)}
onClick={() => reload()}
/>
</EuiFlexItem>
</EuiFlexGroup>
</EuiTitle>
</EuiFlexItem>
{policyDetails && policyDetails.policy && policyDetails.policy.inProgress ? (
<EuiFlexItem>
<SectionLoading inline={true} size="s">
<EuiLink
href={linkToSnapshot(
policyDetails.policy.repository,
policyDetails.policy.inProgress.snapshotName
)}
data-test-subj="inProgressSnapshotLink"
>
<FormattedMessage
id="xpack.snapshotRestore.policyDetails.inProgressSnapshotLinkText"
defaultMessage="'{snapshotName}' in progress"
values={{ snapshotName: policyDetails.policy.inProgress.snapshotName }}
/>
</EuiLink>
</SectionLoading>
</EuiFlexItem>
) : null}
</EuiFlexGroup>
<EuiTitle size="m">
<h2 id="srPolicyDetailsFlyoutTitle" data-test-subj="title">
{policyName}{' '}
<EuiButtonIcon
iconType="refresh"
color="subdued"
aria-label={i18n.translate(
'xpack.snapshotRestore.policyDetails.reloadButtonAriaLabel',
{ defaultMessage: 'Reload' }
)}
onClick={() => reload()}
/>
</h2>
</EuiTitle>
{policyDetails && policyDetails.policy && policyDetails.policy.inProgress ? (
<>
<EuiSpacer size="s" />
<SectionLoading inline={true} size="s">
<EuiLink
href={linkToSnapshot(
policyDetails.policy.repository,
policyDetails.policy.inProgress.snapshotName
)}
data-test-subj="inProgressSnapshotLink"
>
<FormattedMessage
id="xpack.snapshotRestore.policyDetails.inProgressSnapshotLinkText"
defaultMessage="'{snapshotName}' in progress"
values={{ snapshotName: policyDetails.policy.inProgress.snapshotName }}
/>
</EuiLink>
</SectionLoading>
</>
) : null}
{renderTabs()}
</EuiFlyoutHeader>

56
x-pack/legacy/plugins/snapshot_restore/public/app/sections/home/policy_list/policy_table/policy_table.tsx
View file

@ -327,36 +327,32 @@ export const PolicyTable: React.FunctionComponent<Props> = ({
) : (
undefined
),
toolsRight: (
<EuiFlexGroup gutterSize="m" justifyContent="spaceAround">
<EuiFlexItem>
<EuiButton
color="secondary"
iconType="refresh"
onClick={reload}
data-test-subj="reloadButton"
>
<FormattedMessage
id="xpack.snapshotRestore.policyList.table.reloadPoliciesButton"
defaultMessage="Reload"
/>
</EuiButton>
</EuiFlexItem>
<EuiFlexItem>
<EuiButton
href={linkToAddPolicy()}
fill
iconType="plusInCircle"
data-test-subj="createPolicyButton"
>
<FormattedMessage
id="xpack.snapshotRestore.policyList.table.addPolicyButton"
defaultMessage="Create a policy"
/>
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
),
toolsRight: [
<EuiButton
key="reloadPolicies"
color="secondary"
iconType="refresh"
onClick={reload}
data-test-subj="reloadButton"
>
<FormattedMessage
id="xpack.snapshotRestore.policyList.table.reloadPoliciesButton"
defaultMessage="Reload"
/>
</EuiButton>,
<EuiButton
key="createNewPolicy"
href={linkToAddPolicy()}
fill
iconType="plusInCircle"
data-test-subj="createPolicyButton"
>
<FormattedMessage
id="xpack.snapshotRestore.policyList.table.addPolicyButton"
defaultMessage="Create a policy"
/>
</EuiButton>,
],
box: {
incremental: true,
schema: true,

58
x-pack/legacy/plugins/snapshot_restore/public/app/sections/home/repository_list/repository_table/repository_table.tsx
View file

@ -9,8 +9,6 @@ import {
EuiBadge,
EuiButton,
EuiButtonIcon,
EuiFlexGroup,
EuiFlexItem,
EuiInMemoryTable,
EuiLink,
EuiToolTip,
@ -235,36 +233,32 @@ export const RepositoryTable: React.FunctionComponent<Props> = ({
) : (
undefined
),
toolsRight: (
<EuiFlexGroup gutterSize="m" justifyContent="spaceAround">
<EuiFlexItem>
<EuiButton
color="secondary"
iconType="refresh"
onClick={reload}
data-test-subj="reloadButton"
>
<FormattedMessage
id="xpack.snapshotRestore.repositoryList.table.reloadRepositoriesButton"
defaultMessage="Reload"
/>
</EuiButton>
</EuiFlexItem>
<EuiFlexItem>
<EuiButton
href={linkToAddRepository()}
fill
iconType="plusInCircle"
data-test-subj="registerRepositoryButton"
>
<FormattedMessage
id="xpack.snapshotRestore.repositoryList.addRepositoryButtonLabel"
defaultMessage="Register a repository"
/>
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
),
toolsRight: [
<EuiButton
key="reloadButton"
color="secondary"
iconType="refresh"
onClick={reload}
data-test-subj="reloadButton"
>
<FormattedMessage
id="xpack.snapshotRestore.repositoryList.table.reloadRepositoriesButton"
defaultMessage="Reload"
/>
</EuiButton>,
<EuiButton
key="registerRepo"
href={linkToAddRepository()}
fill
iconType="plusInCircle"
data-test-subj="registerRepositoryButton"
>
<FormattedMessage
id="xpack.snapshotRestore.repositoryList.addRepositoryButtonLabel"
defaultMessage="Register a repository"
/>
</EuiButton>,
],
box: {
incremental: true,
schema: true,

42
x-pack/legacy/plugins/snapshot_restore/public/app/sections/home/snapshot_list/snapshot_details/snapshot_details.tsx
View file

@ -18,7 +18,6 @@ import {
EuiTab,
EuiTabs,
EuiText,
EuiTitle,
} from '@elastic/eui';
import React, { Fragment, useState, useEffect } from 'react';
@ -256,33 +255,24 @@ export const SnapshotDetails: React.FunctionComponent<Props> = ({
maxWidth={550}
>
<EuiFlyoutHeader>
<EuiFlexGroup direction="column" gutterSize="none">
<EuiFlexItem>
<EuiTitle size="m">
<h2 id="srSnapshotDetailsFlyoutTitle" data-test-subj="detailTitle">
{snapshotId}
</h2>
</EuiTitle>
</EuiFlexItem>
<EuiFlexItem>
<EuiText size="s">
<p>
<EuiLink href={linkToRepository(repositoryName)} data-test-subj="repositoryLink">
<FormattedMessage
id="xpack.snapshotRestore.snapshotDetails.repositoryTitle"
defaultMessage="'{repositoryName}' repository"
values={{ repositoryName }}
/>
</EuiLink>
</p>
</EuiText>
</EuiFlexItem>
</EuiFlexGroup>
<EuiText>
<h2 id="srSnapshotDetailsFlyoutTitle" data-test-subj="detailTitle">
{snapshotId}
</h2>
<p>
<small>
<EuiLink href={linkToRepository(repositoryName)} data-test-subj="repositoryLink">
<FormattedMessage
id="xpack.snapshotRestore.snapshotDetails.repositoryTitle"
defaultMessage="'{repositoryName}' repository"
values={{ repositoryName }}
/>
</EuiLink>
</small>
</p>
</EuiText>
{tabs}
</EuiFlyoutHeader>
<EuiFlyoutBody data-test-subj="content">{content}</EuiFlyoutBody>
<EuiFlyoutFooter>{renderFooter()}</EuiFlyoutFooter>
</EuiFlyout>