Skip to content

Commit

Permalink
Add a title to row renderer popover on alert table
Browse files Browse the repository at this point in the history
  • Loading branch information
@machadoum
machadoum committed Aug 12, 2021
1 parent aec9fba commit c252e78
Show file tree
Hide file tree
Showing 3 changed files with 49 additions and 18 deletions.
52 changes: 36 additions & 16 deletions ...ins/security_solution/public/timelines/components/row_renderers_browser/catalog/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,26 @@ const Link = ({ children, url }: { children: React.ReactNode; url: string }) =>
</EuiLink>
);

export const eventRendererNames: { [key in RowRendererId]: string } = {
[RowRendererId.alerts]: i18n.ALERTS_NAME,
[RowRendererId.auditd]: i18n.AUDITD_NAME,
[RowRendererId.auditd_file]: i18n.AUDITD_FILE_NAME,
[RowRendererId.library]: i18n.LIBRARY_NAME,
[RowRendererId.system_security_event]: i18n.AUTHENTICATION_NAME,
[RowRendererId.system_dns]: i18n.DNS_NAME,
[RowRendererId.netflow]: i18n.FLOW_NAME,
[RowRendererId.system]: i18n.SYSTEM_NAME,
[RowRendererId.system_endgame_process]: i18n.PROCESS,
[RowRendererId.registry]: i18n.REGISTRY_NAME,
[RowRendererId.system_fim]: i18n.FIM_NAME,
[RowRendererId.system_file]: i18n.FILE_NAME,
[RowRendererId.system_socket]: i18n.SOCKET_NAME,
[RowRendererId.suricata]: 'Suricata',
[RowRendererId.threat_match]: i18n.THREAT_MATCH_NAME,
[RowRendererId.zeek]: i18n.ZEEK_NAME,
[RowRendererId.plain]: '',
};

export interface RowRendererOption {
id: RowRendererId;
name: string;
Expand All @@ -51,14 +71,14 @@ export interface RowRendererOption {
export const renderers: RowRendererOption[] = [
{
id: RowRendererId.alerts,
name: i18n.ALERTS_NAME,
name: eventRendererNames[RowRendererId.alerts],
description: i18n.ALERTS_DESCRIPTION,
example: AlertsExample,
searchableDescription: i18n.ALERTS_DESCRIPTION,
},
{
id: RowRendererId.auditd,
name: i18n.AUDITD_NAME,
name: eventRendererNames[RowRendererId.auditd],
description: (
<span>
<Link url="https://www.elastic.co/guide/en/beats/auditbeat/current/auditbeat-module-auditd.html">
Expand All @@ -72,7 +92,7 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.auditd_file,
name: i18n.AUDITD_FILE_NAME,
name: eventRendererNames[RowRendererId.auditd_file],
description: (
<span>
<Link url="https://www.elastic.co/guide/en/beats/auditbeat/current/auditbeat-module-auditd.html">
Expand All @@ -86,14 +106,14 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.library,
name: i18n.LIBRARY_NAME,
name: eventRendererNames[RowRendererId.library],
description: i18n.LIBRARY_DESCRIPTION,
example: LibraryExample,
searchableDescription: i18n.LIBRARY_DESCRIPTION,
},
{
id: RowRendererId.system_security_event,
name: i18n.AUTHENTICATION_NAME,
name: eventRendererNames[RowRendererId.system_security_event],
description: (
<div>
<p>{i18n.AUTHENTICATION_DESCRIPTION_PART1}</p>
Expand All @@ -106,14 +126,14 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.system_dns,
name: i18n.DNS_NAME,
name: eventRendererNames[RowRendererId.system_dns],
description: i18n.DNS_DESCRIPTION_PART1,
example: SystemDnsExample,
searchableDescription: i18n.DNS_DESCRIPTION_PART1,
},
{
id: RowRendererId.netflow,
name: i18n.FLOW_NAME,
name: eventRendererNames[RowRendererId.netflow],
description: (
<div>
<p>{i18n.FLOW_DESCRIPTION_PART1}</p>
Expand All @@ -126,7 +146,7 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.system,
name: i18n.SYSTEM_NAME,
name: eventRendererNames[RowRendererId.system],
description: (
<div>
<p>
Expand All @@ -145,7 +165,7 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.system_endgame_process,
name: i18n.PROCESS,
name: eventRendererNames[RowRendererId.system_endgame_process],
description: (
<div>
<p>{i18n.PROCESS_DESCRIPTION_PART1}</p>
Expand All @@ -158,28 +178,28 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.registry,
name: i18n.REGISTRY_NAME,
name: eventRendererNames[RowRendererId.registry],
description: i18n.REGISTRY_DESCRIPTION,
example: RegistryExample,
searchableDescription: i18n.REGISTRY_DESCRIPTION,
},
{
id: RowRendererId.system_fim,
name: i18n.FIM_NAME,
name: eventRendererNames[RowRendererId.system_fim],
description: i18n.FIM_DESCRIPTION_PART1,
example: SystemFimExample,
searchableDescription: i18n.FIM_DESCRIPTION_PART1,
},
{
id: RowRendererId.system_file,
name: i18n.FILE_NAME,
name: eventRendererNames[RowRendererId.system_file],
description: i18n.FILE_DESCRIPTION_PART1,
example: SystemFileExample,
searchableDescription: i18n.FILE_DESCRIPTION_PART1,
},
{
id: RowRendererId.system_socket,
name: i18n.SOCKET_NAME,
name: eventRendererNames[RowRendererId.system_socket],
description: (
<div>
<p>{i18n.SOCKET_DESCRIPTION_PART1}</p>
Expand All @@ -192,7 +212,7 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.suricata,
name: 'Suricata',
name: eventRendererNames[RowRendererId.suricata],
description: (
<p>
{i18n.SURICATA_DESCRIPTION_PART1}{' '}
Expand All @@ -207,14 +227,14 @@ export const renderers: RowRendererOption[] = [
},
{
id: RowRendererId.threat_match,
name: i18n.THREAT_MATCH_NAME,
name: eventRendererNames[RowRendererId.threat_match],
description: i18n.THREAT_MATCH_DESCRIPTION,
example: ThreatMatchExample,
searchableDescription: `${i18n.THREAT_MATCH_NAME} ${i18n.THREAT_MATCH_DESCRIPTION}`,
},
{
id: RowRendererId.zeek,
name: i18n.ZEEK_NAME,
name: eventRendererNames[RowRendererId.zeek],
description: (
<p>
{i18n.ZEEK_DESCRIPTION_PART1}{' '}
Expand Down
9 changes: 7 additions & 2 deletions ...y_solution/public/timelines/components/timeline/body/renderers/reason_column_renderer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,20 @@
* 2.0.
*/

import { EuiButtonEmpty, EuiPopover } from '@elastic/eui';
import { EuiButtonEmpty, EuiPopover, EuiPopoverTitle } from '@elastic/eui';
import { isEqual } from 'lodash/fp';
import React, { useMemo, useState } from 'react';

import styled from 'styled-components';
import { BrowserFields, ColumnHeaderOptions, RowRenderer } from '../../../../../../common';
import { Ecs } from '../../../../../../common/ecs';
import { DefaultDraggable } from '../../../../../common/components/draggables';
import { eventRendererNames } from '../../../row_renderers_browser/catalog';
import { ColumnRenderer } from './column_renderer';
import { REASON_FIELD_NAME } from './constants';
import { getRowRenderer } from './get_row_renderer';
import { plainColumnRenderer } from './plain_column_renderer';
import * as i18n from './translations';

export const reasonColumnRenderer: ColumnRenderer = {
isInstance: isEqual(REASON_FIELD_NAME),
Expand Down Expand Up @@ -135,13 +137,16 @@ const ReasonCell: React.FC<{
value={`${value}`}
tooltipContent={value}
>
{rowRender ? (
{rowRenderer && rowRender ? (
<EuiPopover
isOpen={isOpen}
anchorPosition="rightCenter"
closePopover={() => setIsOpen(false)}
button={button}
>
<EuiPopoverTitle paddingSize="s">
{i18n.EVENT_RENDERER_POPOVER_TITLE(eventRendererNames[rowRenderer.id] ?? '')}
</EuiPopoverTitle>
{rowRender}
</EuiPopover>
) : (
Expand Down
6 changes: 6 additions & 0 deletions ...ins/security_solution/public/timelines/components/timeline/body/renderers/translations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,3 +51,9 @@ export const EMPTY_STATUS = i18n.translate(
defaultMessage: '-',
}
);

export const EVENT_RENDERER_POPOVER_TITLE = (eventRendererName: string) =>
i18n.translate('xpack.securitySolution.event.reason.eventRenderPopoverTitle', {
values: { eventRendererName },
defaultMessage: 'Event renderer: {eventRendererName} ',
});

0 comments on commit c252e78

Please sign in to comment.