Skip to content

Commit

Permalink
Merge branch 'main' of github.com:elastic/kibana into chore/renovate-…
Browse files Browse the repository at this point in the history 
…storybook

# Conflicts:
#	package.json
#	yarn.lock
  • Loading branch information
@patrykkopycinski
patrykkopycinski committed May 16, 2022
2 parents 4669ff4 + 059f09d commit 476f659
Show file tree
Hide file tree
Showing 10 changed files with 307 additions and 427 deletions.
12 changes: 5 additions & 7 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -555,7 +555,6 @@
"@types/cmd-shim": "^2.0.0",
"@types/color": "^3.0.3",
"@types/compression-webpack-plugin": "^2.0.2",
"@types/cypress-cucumber-preprocessor": "^1.14.1",
"@types/cytoscape": "^3.14.0",
"@types/d3": "^3.5.43",
"@types/d3-array": "^1.2.7",
Expand Down Expand Up @@ -812,15 +811,14 @@
"css-loader": "^3.4.2",
"cssnano": "^4.1.11",
"csstype": "^3.0.2",
"cypress": "^9.2.1",
"cypress": "^9.6.1",
"cypress-axe": "^0.14.0",
"cypress-cucumber-preprocessor": "^2.5.2",
"cypress-file-upload": "^5.0.8",
"cypress-multi-reporters": "^1.5.0",
"cypress-multi-reporters": "^1.6.0",
"cypress-pipe": "^2.0.0",
"cypress-react-selector": "^2.3.13",
"cypress-real-events": "^1.6.0",
"cypress-recurse": "^1.13.1",
"cypress-react-selector": "^2.3.17",
"cypress-real-events": "^1.7.0",
"cypress-recurse": "^1.20.0",
"debug": "^2.6.9",
"delete-empty": "^2.0.0",
"dependency-check": "^4.1.0",
Expand Down
1 change: 0 additions & 1 deletion x-pack/plugins/cloud_security_posture/common/constants.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ export const RULE_FAILED = `failed`;
export const INTERNAL_FEATURE_FLAGS = {
showBenchmarks: true,
showManageRulesMock: false,
showRisksMock: false,
showFindingsGroupBy: true,
} as const;

Expand Down
50 changes: 7 additions & 43 deletions ...loud_security_posture/public/pages/compliance_dashboard/compliance_charts/risks_table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@
import React, { useMemo } from 'react';
import {
EuiBasicTable,
EuiBasicTableColumn,
EuiButtonEmpty,
EuiFlexGroup,
EuiFlexItem,
Expand All @@ -17,46 +18,6 @@ import {
import { ComplianceDashboardData, GroupedFindingsEvaluation } from '../../../../common/types';
import { CompactFormattedNumber } from '../../../components/compact_formatted_number';
import * as TEXT from '../translations';
import { INTERNAL_FEATURE_FLAGS } from '../../../../common/constants';

const mockData = [
{
name: 'pods',
totalFindings: 2,
totalPassed: 1,
totalFailed: 1,
},
{
name: 'etcd',
totalFindings: 5,
totalPassed: 0,
totalFailed: 5,
},
{
name: 'cluster',
totalFindings: 2,
totalPassed: 2,
totalFailed: 0,
},
{
name: 'system',
totalFindings: 10,
totalPassed: 6,
totalFailed: 4,
},
{
name: 'api',
totalFindings: 19100,
totalPassed: 2100,
totalFailed: 17000,
},
{
name: 'server',
totalFindings: 7,
totalPassed: 4,
totalFailed: 3,
},
];

export interface RisksTableProps {
data: ComplianceDashboardData['groupedFindingsEvaluation'];
Expand All @@ -81,13 +42,16 @@ export const RisksTable = ({
onCellClick,
onViewAllClick,
}: RisksTableProps) => {
const columns = useMemo(
const columns: Array<EuiBasicTableColumn<GroupedFindingsEvaluation>> = useMemo(
() => [
{
field: 'name',
truncateText: true,
name: TEXT.CIS_SECTION,
render: (name: GroupedFindingsEvaluation['name']) => (
<EuiLink onClick={() => onCellClick(name)}>{name}</EuiLink>
<EuiLink onClick={() => onCellClick(name)} className="eui-textTruncate">
{name}
</EuiLink>
),
},
{
Expand Down Expand Up @@ -119,7 +83,7 @@ export const RisksTable = ({
<EuiFlexItem>
<EuiBasicTable<GroupedFindingsEvaluation>
rowHeader="name"
items={INTERNAL_FEATURE_FLAGS.showRisksMock ? getTopRisks(mockData, maxItems) : items}
items={items}
columns={columns}
/>
</EuiFlexItem>
Expand Down
104 changes: 10 additions & 94 deletions .../plugins/cloud_security_posture/public/pages/findings/findings_flyout/findings_flyout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,88 +9,56 @@ import {
EuiCodeBlock,
EuiFlexItem,
EuiSpacer,
EuiDescriptionList,
EuiTextColor,
EuiFlyout,
EuiFlyoutHeader,
EuiTitle,
EuiFlyoutBody,
EuiTabs,
EuiTab,
EuiFlexGrid,
EuiCard,
EuiFlexGroup,
EuiIcon,
type PropsOf,
EuiMarkdownFormat,
} from '@elastic/eui';
import { assertNever } from '@kbn/std';
import moment from 'moment';
import type { CspFinding } from '../types';
import { CspEvaluationBadge } from '../../../components/csp_evaluation_badge';
import * as TEXT from '../translations';
import cisLogoIcon from '../../../assets/icons/cis_logo.svg';
import k8sLogoIcon from '../../../assets/icons/k8s_logo.svg';
import { ResourceTab } from './resource_tab';
import { JsonTab } from './json_tab';
import { OverviewTab } from './overview_tab';
import { RuleTab } from './rule_tab';

const tabs = [
{ title: TEXT.REMEDIATION, id: 'remediation' },
{ title: TEXT.OVERVIEW, id: 'overview' },
{ title: TEXT.RULE, id: 'rule' },
{ title: TEXT.RESOURCE, id: 'resource' },
{ title: TEXT.GENERAL, id: 'general' },
{ title: TEXT.JSON, id: 'json' },
] as const;

const CodeBlock: React.FC<PropsOf<typeof EuiCodeBlock>> = (props) => (
export const CodeBlock: React.FC<PropsOf<typeof EuiCodeBlock>> = (props) => (
<EuiCodeBlock isCopyable paddingSize="s" overflowHeight={300} {...props} />
);

const Markdown: React.FC<PropsOf<typeof EuiMarkdownFormat>> = (props) => (
export const Markdown: React.FC<PropsOf<typeof EuiMarkdownFormat>> = (props) => (
<EuiMarkdownFormat textSize="s" {...props} />
);

type FindingsTab = typeof tabs[number];

type EuiListItemsProps = NonNullable<PropsOf<typeof EuiDescriptionList>['listItems']>[number];

interface Card {
title: string;
listItems: Array<[EuiListItemsProps['title'], EuiListItemsProps['description']]>;
}

interface FindingFlyoutProps {
onClose(): void;
findings: CspFinding;
}

const Cards = ({ data }: { data: Card[] }) => (
<EuiFlexGrid direction="column" gutterSize={'l'}>
{data.map((card) => (
<EuiFlexItem key={card.title} style={{ display: 'block' }}>
<EuiCard textAlign="left" title={card.title} hasBorder>
<EuiDescriptionList
compressed={false}
type="column"
listItems={card.listItems.map((v) => ({ title: v[0], description: v[1] }))}
style={{ flexFlow: 'column' }}
descriptionProps={{
style: { width: '100%' },
}}
/>
</EuiCard>
</EuiFlexItem>
))}
</EuiFlexGrid>
);

const FindingsTab = ({ tab, findings }: { findings: CspFinding; tab: FindingsTab }) => {
switch (tab.id) {
case 'remediation':
return <Cards data={getRemediationCards(findings)} />;
case 'overview':
return <OverviewTab data={findings} />;
case 'rule':
return <RuleTab data={findings} />;
case 'resource':
return <ResourceTab data={findings} />;
case 'general':
return <Cards data={getGeneralCards(findings)} />;
case 'json':
return <JsonTab data={findings} />;
default:
Expand Down Expand Up @@ -131,55 +99,3 @@ export const FindingsRuleFlyout = ({ onClose, findings }: FindingFlyoutProps) =>
</EuiFlyout>
);
};

const getGeneralCards = ({ rule, ...rest }: CspFinding): Card[] => [
{
title: TEXT.RULE,
listItems: [
[TEXT.RULE_EVALUATED_AT, moment(rest['@timestamp']).format('MMMM D, YYYY @ HH:mm:ss.SSS')],
[
TEXT.FRAMEWORK_SOURCES,
<EuiFlexGroup gutterSize="s">
<EuiFlexItem grow={false}>
<EuiIcon type={cisLogoIcon} size="xxl" />
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiIcon type={k8sLogoIcon} size="xxl" />
</EuiFlexItem>
</EuiFlexGroup>,
],
[TEXT.CIS_SECTION, rule.section],
[TEXT.PROFILE_APPLICABILITY, <Markdown>{rule.profile_applicability}</Markdown>],
[TEXT.BENCHMARK, rule.benchmark.name],
[TEXT.NAME, rule.name],
[TEXT.DESCRIPTION, <Markdown>{rule.description}</Markdown>],
[TEXT.AUDIT, <Markdown>{rule.audit}</Markdown>],
[TEXT.REFERENCES, <Markdown>{rule.references}</Markdown>],
],
},
];

const getRemediationCards = ({ result, rule, ...rest }: CspFinding): Card[] => [
{
title: TEXT.RESULT_DETAILS,
listItems: [
result.expected
? [TEXT.EXPECTED, <CodeBlock>{JSON.stringify(result.expected, null, 2)}</CodeBlock>]
: ['', ''],
[TEXT.EVIDENCE, <CodeBlock>{JSON.stringify(result.evidence, null, 2)}</CodeBlock>],
[
TEXT.RULE_EVALUATED_AT,
<span>{moment(rest['@timestamp']).format('MMMM D, YYYY @ HH:mm:ss.SSS')}</span>,
],
],
},
{
title: TEXT.REMEDIATION,
listItems: [
['', <Markdown>{rule.remediation}</Markdown>],
[TEXT.IMPACT, <Markdown>{rule.impact}</Markdown>],
[TEXT.DEFAULT_VALUE, <Markdown>{rule.default_value}</Markdown>],
[TEXT.RATIONALE, <Markdown>{rule.rationale}</Markdown>],
],
},
];
Loading

0 comments on commit 476f659

Please sign in to comment.