Skip to content

Commit

Permalink
[Backport 2.x][Custom log types] Show log types table, Log type creat…
Browse files Browse the repository at this point in the history
…ion workflow (#677)

* [Custom log types] Show log types table, Log type creation workflow (#674)

* log types table; details page with basic editing

Signed-off-by: Amardeepsingh Siglani <[email protected]>

* updated snapshots

Signed-off-by: Amardeepsingh Siglani <[email protected]>

* addressed PR comments

Signed-off-by: Amardeepsingh Siglani <[email protected]>

* updated cypress workflow

Signed-off-by: Amardeepsingh Siglani <[email protected]>

* updated detector cypress test

Signed-off-by: Amardeepsingh Siglani <[email protected]>

---------

Signed-off-by: Amardeepsingh Siglani <[email protected]>

* using 2.9 OSD for cypress testing

Signed-off-by: Amardeepsingh Siglani <[email protected]>

---------

Signed-off-by: Amardeepsingh Siglani <[email protected]>
  • Loading branch information
amsiglan authored Jul 31, 2023
1 parent d3688a4 commit c4df3d2
Show file tree
Hide file tree
Showing 35 changed files with 958 additions and 84 deletions.
2 changes: 1 addition & 1 deletion .github/workflows/cypress-workflow.yml
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ on:
branches:
- "*"
env:
OPENSEARCH_DASHBOARDS_VERSION: '2.x'
OPENSEARCH_DASHBOARDS_VERSION: '2.9'
SECURITY_ANALYTICS_BRANCH: '2.x'
jobs:
tests:
Expand Down
35 changes: 4 additions & 31 deletions cypress/integration/1_detectors.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -48,9 +48,10 @@ const validateFieldMappingsTable = (message = '') => {
cy.wait(10000).then(() => {
cy.get('.reviewFieldMappings').should('be.visible');
const properties = interception.response.body.response.properties;
const unmapped_field_aliases = interception.response.body.response.unmapped_field_aliases.map(
(field) => [field]
);
const unmapped_field_aliases = interception.response.body.response.unmapped_field_aliases
.map((field) => [field])
.sort()
.slice(0, 10);

Cypress.log({
message: `Validate table data - ${message}`,
Expand Down Expand Up @@ -162,18 +163,6 @@ const createDetector = (detectorName, dataSource, expectFailure) => {
cy.validateDetailsItem('Last updated time', '-');
cy.validateDetailsItem('Detector dashboard', 'Not available for this log type');

if (!expectFailure) {
let fields = [];
for (let field in dns_mapping_fields) {
fields.push([field, dns_mapping_fields[field]]);
}
cy.getElementByText('.euiTitle', 'Field mapping')
.parentsUntil('.euiPanel')
.siblings()
.eq(2)
.validateTable(fields);
}

validateAlertPanel('test_trigger');

cy.intercept('POST', '/mappings').as('createMappingsRequest');
Expand Down Expand Up @@ -206,22 +195,6 @@ const createDetector = (detectorName, dataSource, expectFailure) => {
cy.wait(5000); // waiting for the page to be reloaded after pushing detector id into route
cy.getElementByText('button.euiTab', 'Alert triggers').should('be.visible').click();
validateAlertPanel('test_trigger');

cy.intercept('GET', '/mappings?indexName').as('getMappingFields');
cy.getElementByText('button.euiTab', 'Field mappings').should('be.visible').click();
if (!expectFailure) {
let fields = [];
for (let field in dns_mapping_fields) {
fields.push([field, dns_mapping_fields[field]]);
}
cy.wait('@getMappingFields');
cy.wait(2000);
cy.getElementByText('.euiTitle', 'Field mapping')
.parentsUntil('.euiPanel')
.siblings()
.eq(2)
.validateTable(fields);
}
});
});
});
Expand Down
7 changes: 4 additions & 3 deletions public/components/ContentPanel/ContentPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import {
EuiPanel,
EuiTitle,
EuiText,
EuiSpacer,
} from '@elastic/eui';

interface ContentPanelProps {
Expand All @@ -19,9 +20,9 @@ interface ContentPanelProps {
subTitleText?: string | JSX.Element;
bodyStyles?: object;
panelStyles?: object;
horizontalRuleClassName?: string;
actions?: React.ReactNode | React.ReactNode[];
children: React.ReactNode | React.ReactNode[];
hideHeaderBorder?: boolean;
className?: string;
}

Expand All @@ -43,9 +44,9 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({
subTitleText = '',
bodyStyles = {},
panelStyles = {},
horizontalRuleClassName = '',
actions,
children,
hideHeaderBorder = false,
className = '',
}) => (
<EuiPanel
Expand Down Expand Up @@ -80,7 +81,7 @@ const ContentPanel: React.SFC<ContentPanelProps> = ({
) : null}
</EuiFlexGroup>

<EuiHorizontalRule margin="xs" className={horizontalRuleClassName} />
{hideHeaderBorder ? <EuiSpacer /> : <EuiHorizontalRule margin="xs" />}

<div style={{ padding: '0px 10px', ...bodyStyles }}>{children}</div>
</EuiPanel>
Expand Down
2 changes: 2 additions & 0 deletions public/models/interfaces.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import {
RuleService,
NotificationsService,
IndexPatternsService,
LogTypeService,
} from '../services';
import CorrelationService from '../services/CorrelationService';

Expand All @@ -29,6 +30,7 @@ export interface BrowserServices {
notificationsService: NotificationsService;
savedObjectsService: ISavedObjectsService;
indexPatternsService: IndexPatternsService;
logTypeService: LogTypeService;
}

export interface RuleOptions {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1109,7 +1109,6 @@ exports[`<Alerts /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -330,7 +330,6 @@ exports[`<DetectorRulesView /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -665,7 +665,6 @@ exports[`<UpdateDetectorBasicDetails /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down Expand Up @@ -1165,7 +1164,6 @@ exports[`<UpdateDetectorBasicDetails /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -324,7 +324,6 @@ exports[`<AlertTriggersView /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1484,7 +1484,6 @@ exports[`<DetectorDetails /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down Expand Up @@ -2885,7 +2884,6 @@ exports[`<DetectorDetails /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -527,7 +527,6 @@ exports[`<DetectorDetailsView /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down Expand Up @@ -1709,7 +1708,6 @@ exports[`<DetectorDetailsView /> spec renders the component 1`] = `
</div>
</EuiFlexGroup>
<EuiHorizontalRule
className=""
margin="xs"
>
<hr
Expand Down
115 changes: 115 additions & 0 deletions public/pages/LogTypes/components/LogTypeDetailsTab.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,115 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

import {
EuiButton,
EuiDescriptionList,
EuiFormRow,
EuiFieldText,
EuiSpacer,
EuiTextArea,
EuiBottomBar,
EuiFlexGroup,
EuiFlexItem,
EuiButtonEmpty,
} from '@elastic/eui';
import { ContentPanel } from '../../../components/ContentPanel';
import React from 'react';
import { LogTypeItem } from '../../../../types';
import { DataStore } from '../../../store/DataStore';

export interface LogTypeDetailsTabProps {
initialLogTypeDetails: LogTypeItem;
logTypeDetails: LogTypeItem;
isEditMode: boolean;
setIsEditMode: (isEdit: boolean) => void;
setLogTypeDetails: (logType: LogTypeItem) => void;
}

export const LogTypeDetailsTab: React.FC<LogTypeDetailsTabProps> = ({
initialLogTypeDetails,
logTypeDetails,
isEditMode,
setIsEditMode,
setLogTypeDetails,
}) => {
const onUpdateLogType = async () => {
const success = await DataStore.logTypes.updateLogType(logTypeDetails);
if (success) {
setIsEditMode(false);
}
};

return (
<ContentPanel
title="Details"
actions={!isEditMode && [<EuiButton onClick={() => setIsEditMode(true)}>Edit</EuiButton>]}
>
<EuiDescriptionList
type="column"
listItems={[
{
title: 'Log type',
description: (
<>
<EuiFormRow label="Name">
<EuiFieldText
value={logTypeDetails?.name}
onChange={(e) =>
setLogTypeDetails({
...logTypeDetails!,
name: e.target.value,
})
}
placeholder="Enter name for log type"
disabled={!isEditMode || !!logTypeDetails.detectionRules}
/>
</EuiFormRow>
<EuiSpacer />
<EuiFormRow label="Description">
<EuiTextArea
value={logTypeDetails?.description}
onChange={(e) =>
setLogTypeDetails({
...logTypeDetails!,
description: e.target.value,
})
}
placeholder="Description of the log type"
disabled={!isEditMode}
/>
</EuiFormRow>
{isEditMode ? (
<EuiBottomBar>
<EuiFlexGroup gutterSize="s" justifyContent="flexEnd">
<EuiFlexItem grow={false}>
<EuiButtonEmpty
color="ghost"
size="s"
iconType="cross"
onClick={() => {
setLogTypeDetails(initialLogTypeDetails);
setIsEditMode(false);
}}
>
Cancel
</EuiButtonEmpty>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiButton color="primary" fill size="s" onClick={onUpdateLogType}>
Update
</EuiButton>
</EuiFlexItem>
</EuiFlexGroup>
</EuiBottomBar>
) : null}
</>
),
},
]}
/>
</ContentPanel>
);
};
10 changes: 10 additions & 0 deletions public/pages/LogTypes/components/LogTypeDetectionRules.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
/*
* Copyright OpenSearch Contributors
* SPDX-License-Identifier: Apache-2.0
*/

export interface LogTypeDetectionRulesProps {
logTypeId: string;
}

export const LogTypeDetectionRules = () => {};
Loading

0 comments on commit c4df3d2

Please sign in to comment.