Skip to content

Commit

Permalink
[Security Solution][Exceptions] - Update how nested entries are displ…
Browse files Browse the repository at this point in the history
…ayed in exceptions viewer (elastic#73745)

### Summary

Small PR updating how nested entries are displayed in exception viewer. Doesn't change anything functionally, just cosmetic.
  • Loading branch information
yctercero committed Jul 30, 2020
1 parent ffc2192 commit 6e7d77a
Show file tree
Hide file tree
Showing 3 changed files with 17 additions and 12 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -52,6 +52,14 @@ const MyActionButton = styled(EuiFlexItem)`
align-self: flex-end;
`;

const MyNestedValueContainer = styled.div`
margin-left: ${({ theme }) => theme.eui.euiSizeL};
`;

const MyNestedValue = styled.span`
margin-left: ${({ theme }) => theme.eui.euiSizeS};
`;

interface ExceptionEntriesComponentProps {
entries: FormattedEntry[];
disableDelete: boolean;
Expand All @@ -78,10 +86,10 @@ const ExceptionEntriesComponent = ({
render: (value: string | null, data: FormattedEntry) => {
if (value != null && data.isNested) {
return (
<>
<EuiIconTip type="grabHorizontal" size="m" />
{value}
</>
<MyNestedValueContainer>
<EuiIconTip type="nested" size="s" />
<MyNestedValue>{value}</MyNestedValue>
</MyNestedValueContainer>
);
} else {
return value ?? getEmptyValue();
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -106,13 +106,13 @@ describe('Exception viewer helpers', () => {
value: undefined,
},
{
fieldName: 'host.name.host.name',
fieldName: 'host.name',
isNested: true,
operator: 'is',
value: 'some host name',
},
{
fieldName: 'host.name.host.name',
fieldName: 'host.name',
isNested: true,
operator: 'is one of',
value: ['some host name'],
Expand All @@ -138,9 +138,9 @@ describe('Exception viewer helpers', () => {

test('it formats as expected when "isNested" is "true"', () => {
const payload = getEntryMatchMock();
const formattedEntry = formatEntry({ isNested: true, parent: 'parent', item: payload });
const formattedEntry = formatEntry({ isNested: true, item: payload });
const expected: FormattedEntry = {
fieldName: 'parent.host.name',
fieldName: 'host.name',
isNested: true,
operator: 'is',
value: 'some host name',
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -20,18 +20,16 @@ import * as i18n from '../translations';
*/
export const formatEntry = ({
isNested,
parent,
item,
}: {
isNested: boolean;
parent?: string;
item: BuilderEntry;
}): FormattedEntry => {
const operator = getExceptionOperatorSelect(item);
const value = getEntryValue(item);

return {
fieldName: isNested ? `${parent}.${item.field}` : item.field ?? '',
fieldName: item.field ?? '',
operator: operator.message,
value,
isNested,
Expand All @@ -57,7 +55,6 @@ export const getFormattedEntries = (entries: BuilderEntry[]): FormattedEntry[] =
(acc, nestedEntry) => {
const formattedEntry = formatEntry({
isNested: true,
parent: item.field,
item: nestedEntry,
});
return [...acc, { ...formattedEntry }];
Expand Down

0 comments on commit 6e7d77a

Please sign in to comment.