maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

[Integrations] Added link in old Add Data description and fixed alignment in cards (#116213)

Browse source
This commit is contained in:
Caroline Horn 2021-10-26 19:46:51 -04:00 committed by GitHub
parent fac628623e
commit 5666bd79fd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 55 additions and 96 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/plugins/home/public/application/components/tutorial_directory.js
View file

@ -9,7 +9,7 @@
import _ from 'lodash';
import React from 'react';
import PropTypes from 'prop-types';
import { EuiFlexItem, EuiFlexGrid, EuiFlexGroup } from '@elastic/eui';
import { EuiFlexItem, EuiFlexGrid, EuiFlexGroup, EuiLink } from '@elastic/eui';
import { injectI18n, FormattedMessage } from '@kbn/i18n/react';
import { i18n } from '@kbn/i18n';
import { Synopsis } from './synopsis';
@ -224,7 +224,17 @@ class TutorialDirectoryUi extends React.Component {
description: (
<FormattedMessage
id="home.tutorial.addDataToKibanaDescription"
defaultMessage="In addition to adding integrations, you can try our sample data, or upload your own data."
defaultMessage="In addition to adding {integrationsLink}, you can try our sample data or upload your own data."
values={{
integrationsLink: (
<EuiLink href={this.props.addBasePath(`/app/integrations/browse`)}>
<FormattedMessage
id="home.tutorial.addDataToKibanaDescription.integrations"
defaultMessage="integrations"
/>
</EuiLink>
),
}}
/>
),
tabs,

58
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/elastic_agent_card.test.tsx.snap generated
View file

@ -15,16 +15,11 @@ exports[`ElasticAgentCard props button 1`] = `
<EuiCard
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<div
className="eui-textCenter"
<EuiButton
fill={true}
>
Button
<EuiButton
fill={true}
>
Button
</EuiButton>
</div>
</EuiButton>
}
href="/app/integrations/browse"
image="/plugins/kibanaReact/assets/elastic_agent_card.svg"
@ -55,15 +50,11 @@ exports[`ElasticAgentCard props category 1`] = `
<EuiCard
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<div
className="eui-textCenter"
<EuiButton
fill={true}
>
<EuiButton
fill={true}
>
Add Elastic Agent
</EuiButton>
</div>
Add Elastic Agent
</EuiButton>
}
href="/app/integrations/browse/custom"
image="/plugins/kibanaReact/assets/elastic_agent_card.svg"
@ -94,16 +85,11 @@ exports[`ElasticAgentCard props href 1`] = `
<EuiCard
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<div
className="eui-textCenter"
<EuiButton
fill={true}
>
Button
<EuiButton
fill={true}
>
Button
</EuiButton>
</div>
</EuiButton>
}
href="#"
image="/plugins/kibanaReact/assets/elastic_agent_card.svg"
@ -135,15 +121,11 @@ exports[`ElasticAgentCard props recommended 1`] = `
betaBadgeLabel="Recommended"
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<div
className="eui-textCenter"
<EuiButton
fill={true}
>
<EuiButton
fill={true}
>
Add Elastic Agent
</EuiButton>
</div>
Add Elastic Agent
</EuiButton>
}
href="/app/integrations/browse"
image="/plugins/kibanaReact/assets/elastic_agent_card.svg"
@ -174,15 +156,11 @@ exports[`ElasticAgentCard renders 1`] = `
<EuiCard
description="Use Elastic Agent for a simple, unified way to collect data from your machines."
footer={
<div
className="eui-textCenter"
<EuiButton
fill={true}
>
<EuiButton
fill={true}
>
Add Elastic Agent
</EuiButton>
</div>
Add Elastic Agent
</EuiButton>
}
href="/app/integrations/browse"
image="/plugins/kibanaReact/assets/elastic_agent_card.svg"

66
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/__snapshots__/no_data_card.test.tsx.snap generated
View file

@ -2,7 +2,7 @@
exports[`NoDataCard props button 1`] = `
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--leftAligned"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--centerAligned"
>
<div
class="euiCard__content"
@ -25,31 +25,27 @@ exports[`NoDataCard props button 1`] = `
<div
class="euiCard__footer"
>
<div
class="eui-textCenter"
<button
class="euiButton euiButton--primary euiButton--fill"
type="button"
>
<button
class="euiButton euiButton--primary euiButton--fill"
type="button"
<span
class="euiButtonContent euiButton__content"
>
<span
class="euiButtonContent euiButton__content"
class="euiButton__text"
>
<span
class="euiButton__text"
>
Button
</span>
Button
</span>
</button>
</div>
</span>
</button>
</div>
</div>
`;
exports[`NoDataCard props href 1`] = `
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--centerAligned euiCard--isClickable"
>
<div
class="euiCard__content"
@ -79,31 +75,27 @@ exports[`NoDataCard props href 1`] = `
<div
class="euiCard__footer"
>
<div
class="eui-textCenter"
<button
class="euiButton euiButton--primary euiButton--fill"
type="button"
>
<button
class="euiButton euiButton--primary euiButton--fill"
type="button"
<span
class="euiButtonContent euiButton__content"
>
<span
class="euiButtonContent euiButton__content"
class="euiButton__text"
>
<span
class="euiButton__text"
>
Button
</span>
Button
</span>
</button>
</div>
</span>
</button>
</div>
</div>
`;
exports[`NoDataCard props recommended 1`] = `
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--leftAligned euiCard--hasBetaBadge"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--centerAligned euiCard--hasBetaBadge"
>
<div
class="euiCard__content"
@ -134,19 +126,12 @@ exports[`NoDataCard props recommended 1`] = `
Recommended
</span>
</span>
<div
class="euiCard__footer"
>
<div
class="eui-textCenter"
/>
</div>
</div>
`;
exports[`NoDataCard renders 1`] = `
<div
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--leftAligned"
class="euiPanel euiPanel--paddingLarge euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiCard euiCard--centerAligned"
>
<div
class="euiCard__content"
@ -166,12 +151,5 @@ exports[`NoDataCard renders 1`] = `
</p>
</div>
</div>
<div
class="euiCard__footer"
>
<div
class="eui-textCenter"
/>
</div>
</div>
`;

8
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/elastic_agent_card.tsx
View file

@ -44,7 +44,6 @@ export const ElasticAgentCard: FunctionComponent<ElasticAgentCardProps> = ({
<EuiCard
paddingSize="l"
image={image}
textAlign="left"
title={
<EuiTextColor color="default">
{i18n.translate('kibana-react.noDataPage.elasticAgentCard.noPermission.title', {
@ -93,12 +92,7 @@ export const ElasticAgentCard: FunctionComponent<ElasticAgentCardProps> = ({
defaultMessage: `Use Elastic Agent for a simple, unified way to collect data from your machines.`,
})}
betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined}
footer={
<div className="eui-textCenter">
{button}
{footer}
</div>
}
footer={footer}
layout={layout as 'vertical' | undefined}
{...cardRest}
/>

3
src/plugins/kibana_react/public/page_template/no_data_page/no_data_card/no_data_card.tsx
View file

@ -27,7 +27,6 @@ export const NoDataCard: FunctionComponent<NoDataPageActions> = ({
return (
<EuiCard
paddingSize="l"
textAlign="left"
// TODO: we should require both title and description to be passed in by consumers since defaults are not adequate.
// see comment: https://github.com/elastic/kibana/pull/111261/files#r708399140
title={title!}
@ -35,7 +34,7 @@ export const NoDataCard: FunctionComponent<NoDataPageActions> = ({
defaultMessage: `Proceed without collecting data`,
})}
betaBadgeLabel={recommended ? NO_DATA_RECOMMENDED : undefined}
footer={<div className="eui-textCenter">{footer}</div>}
footer={footer}
layout={layout as 'vertical' | undefined}
{...cardRest}
/>

2
src/plugins/kibana_react/public/page_template/no_data_page/no_data_page.scss
View file

@ -1,5 +1,5 @@
.kbnNoDataPageContents__item:only-child {
min-width: 400px;
min-width: ($euiSize * 22.5);
@include euiBreakpoint('xs', 's') {
min-width: auto;