-
Notifications
You must be signed in to change notification settings - Fork 8.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
9 changed files
with
396 additions
and
12 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
178 changes: 178 additions & 0 deletions
178
...detection_engine/rule_management/components/rule_details/per_field_rule_diff_tab.test.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,178 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
|
|
||
| import { | ||
| KqlQueryType, | ||
| ThreeWayDiffOutcome, | ||
| ThreeWayMergeOutcome, | ||
| } from '../../../../../common/api/detection_engine'; | ||
| import type { PartialRuleDiff } from '../../../../../common/api/detection_engine'; | ||
| import { TestProviders } from '../../../../common/mock'; | ||
| import { render } from '@testing-library/react'; | ||
| import React from 'react'; | ||
| import { PerFieldRuleDiffTab } from './per_field_rule_diff_tab'; | ||
|
|
||
| const ruleFieldsDiffBaseFieldsMock = { | ||
| diff_outcome: ThreeWayDiffOutcome.StockValueCanUpdate, | ||
| has_conflict: false, | ||
| has_update: true, | ||
| merge_outcome: ThreeWayMergeOutcome.Target, | ||
| }; | ||
|
|
||
| const ruleFieldsDiffMock: PartialRuleDiff = { | ||
| fields: { | ||
| version: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: 1, | ||
| current_version: 1, | ||
| merged_version: 2, | ||
| target_version: 2, | ||
| }, | ||
| }, | ||
| has_conflict: false, | ||
| }; | ||
|
|
||
| const renderPerFieldRuleDiffTab = (ruleDiff: PartialRuleDiff) => { | ||
| return render( | ||
| <TestProviders> | ||
| <PerFieldRuleDiffTab ruleDiff={ruleDiff} /> | ||
| </TestProviders> | ||
| ); | ||
| }; | ||
|
|
||
| describe('PerFieldRuleDiffTab', () => { | ||
| test('Field groupings should be rendered together in the same accordion panel', () => { | ||
| const mockData: PartialRuleDiff = { | ||
| ...ruleFieldsDiffMock, | ||
| fields: { | ||
| kql_query: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: { | ||
| filters: [], | ||
| language: 'lucene', | ||
| query: 'old query', | ||
| type: KqlQueryType.inline_query, | ||
| }, | ||
| current_version: { | ||
| filters: [], | ||
| language: 'lucene', | ||
| query: 'old query', | ||
| type: KqlQueryType.inline_query, | ||
| }, | ||
| merged_version: { | ||
| filters: [], | ||
| language: 'kuery', | ||
| query: 'new query', | ||
| type: KqlQueryType.inline_query, | ||
| }, | ||
| target_version: { | ||
| filters: [], | ||
| language: 'kuery', | ||
| query: 'new query', | ||
| type: KqlQueryType.inline_query, | ||
| }, | ||
| }, | ||
| }, | ||
| }; | ||
| const wrapper = renderPerFieldRuleDiffTab(mockData); | ||
|
|
||
| const matchedSubtitleElements = wrapper.queryAllByTestId('ruleUpgradePerFieldDiffSubtitle'); | ||
| const subtitles = matchedSubtitleElements.map((element) => { | ||
| return element.textContent; | ||
| }); | ||
|
|
||
| // `filters` and `type` have not changed between versions so shouldn't be displayed | ||
| expect(subtitles).toEqual(['Query', 'Language']); | ||
| }); | ||
|
|
||
| describe('Undefined values are displayed with empty diffs', () => { | ||
| test('when a new field is added', () => { | ||
| const mockData: PartialRuleDiff = { | ||
| ...ruleFieldsDiffMock, | ||
| fields: { | ||
| timestamp_field: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: undefined, | ||
| current_version: undefined, | ||
| merged_version: 'new timestamp field', | ||
| target_version: 'new timestamp field', | ||
| }, | ||
| }, | ||
| }; | ||
| const wrapper = renderPerFieldRuleDiffTab(mockData); | ||
| const diffContent = wrapper.getByTestId('ruleUpgradePerFieldDiffContent').textContent; | ||
|
|
||
| // Only the new timestamp field should be displayed | ||
| expect(diffContent).toEqual('+new timestamp field'); | ||
| }); | ||
|
|
||
| test('when an old field is removed', () => { | ||
| const mockData: PartialRuleDiff = { | ||
| ...ruleFieldsDiffMock, | ||
| fields: { | ||
| timestamp_field: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: 'old timestamp field', | ||
| current_version: 'old timestamp field', | ||
| merged_version: undefined, | ||
| target_version: undefined, | ||
| }, | ||
| }, | ||
| }; | ||
| const wrapper = renderPerFieldRuleDiffTab(mockData); | ||
| const diffContent = wrapper.getByTestId('ruleUpgradePerFieldDiffContent').textContent; | ||
|
|
||
| // Only the old timestamp_field should be displayed | ||
| expect(diffContent).toEqual('-old timestamp field'); | ||
| }); | ||
| }); | ||
|
|
||
| test('Field diff components have the same grouping and order as in rule details overview', () => { | ||
| const mockData: PartialRuleDiff = { | ||
| ...ruleFieldsDiffMock, | ||
| fields: { | ||
| setup: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: 'old setup', | ||
| current_version: 'old setup', | ||
| merged_version: 'new setup', | ||
| target_version: 'new setup', | ||
| }, | ||
| timestamp_field: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: undefined, | ||
| current_version: undefined, | ||
| merged_version: 'new timestamp', | ||
| target_version: 'new timestamp', | ||
| }, | ||
| name: { | ||
| ...ruleFieldsDiffBaseFieldsMock, | ||
| base_version: 'old name', | ||
| current_version: 'old name', | ||
| merged_version: 'new name', | ||
| target_version: 'new name', | ||
| }, | ||
| }, | ||
| }; | ||
| const wrapper = renderPerFieldRuleDiffTab(mockData); | ||
|
|
||
| const matchedSectionElements = wrapper.queryAllByTestId('ruleUpgradePerFieldDiffSectionHeader'); | ||
| const sectionLabels = matchedSectionElements.map((element) => { | ||
| return element.textContent; | ||
| }); | ||
|
|
||
| // Schedule doesn't have any fields in the diff and shouldn't be displayed | ||
| expect(sectionLabels).toEqual(['About', 'Definition', 'Setup guide']); | ||
|
|
||
| const matchedFieldElements = wrapper.queryAllByTestId('ruleUpgradePerFieldDiffLabel'); | ||
| const fieldLabels = matchedFieldElements.map((element) => { | ||
| return element.textContent; | ||
| }); | ||
|
|
||
| expect(fieldLabels).toEqual(['Name', 'Timestamp Field', 'Setup']); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
97 changes: 97 additions & 0 deletions
97
...nt_ui/components/rules_table/upgrade_prebuilt_rules_table/upgrade_prebuilt_rules_tour.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| /* | ||
| * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one | ||
| * or more contributor license agreements. Licensed under the Elastic License | ||
| * 2.0; you may not use this file except in compliance with the Elastic License | ||
| * 2.0. | ||
| */ | ||
|
|
||
| import type { | ||
| EuiStatelessTourStep, | ||
| EuiTourActions, | ||
| EuiTourState, | ||
| EuiTourStepProps, | ||
| } from '@elastic/eui'; | ||
| import { EuiText, EuiTourStep, useEuiTour } from '@elastic/eui'; | ||
| import { noop } from 'lodash'; | ||
| import type { FC } from 'react'; | ||
| import React, { useEffect, useMemo } from 'react'; | ||
| import { NEW_FEATURES_TOUR_STORAGE_KEYS } from '../../../../../../common/constants'; | ||
| import { useKibana } from '../../../../../common/lib/kibana'; | ||
| import { useIsElementMounted } from '../rules_table/guided_onboarding/use_is_element_mounted'; | ||
| import * as i18n from './translations'; | ||
|
|
||
| export interface RulesFeatureTourContextType { | ||
| steps: EuiTourStepProps[]; | ||
| actions: EuiTourActions; | ||
| } | ||
|
|
||
| export const PER_FIELD_UPGRADE_TOUR_ANCHOR = 'perFieldUpgradeTour'; | ||
| export const PREBUILT_RULE_UPDATE_FLYOUT_ANCHOR = 'updatePrebuiltRulePreview'; | ||
|
|
||
| const TOUR_STORAGE_KEY = NEW_FEATURES_TOUR_STORAGE_KEYS.RULE_MANAGEMENT_PAGE; | ||
| const TOUR_POPOVER_WIDTH = 400; | ||
|
|
||
| const tourConfig: EuiTourState = { | ||
| currentTourStep: 1, | ||
| isTourActive: true, | ||
| tourPopoverWidth: TOUR_POPOVER_WIDTH, | ||
| tourSubtitle: '', | ||
| }; | ||
|
|
||
| const stepsConfig: EuiStatelessTourStep[] = [ | ||
| { | ||
| step: 1, | ||
| title: i18n.UPDATE_TOUR_TITLE, | ||
| content: <EuiText>{i18n.UPDATE_TOUR_DESCRIPTION}</EuiText>, | ||
| stepsTotal: 1, | ||
| children: <></>, | ||
| onFinish: noop, | ||
| maxWidth: TOUR_POPOVER_WIDTH, | ||
| }, | ||
| ]; | ||
|
|
||
| export const PrebuiltRulesUpgradeTour: FC = () => { | ||
| const { storage } = useKibana().services; | ||
|
|
||
| const restoredState = useMemo<EuiTourState>( | ||
| () => ({ | ||
| ...tourConfig, | ||
| ...storage.get(TOUR_STORAGE_KEY), | ||
| }), | ||
| [storage] | ||
| ); | ||
|
|
||
| const [tourSteps, , tourState] = useEuiTour(stepsConfig, restoredState); | ||
|
|
||
| useEffect(() => { | ||
| const { isTourActive, currentTourStep } = tourState; | ||
| storage.set(TOUR_STORAGE_KEY, { isTourActive, currentTourStep }); | ||
| }, [tourState, storage]); | ||
|
|
||
| const isTourAnchorMounted = useIsElementMounted(PER_FIELD_UPGRADE_TOUR_ANCHOR); | ||
| const isFlyoutOpen = useIsElementMounted(PREBUILT_RULE_UPDATE_FLYOUT_ANCHOR); | ||
| const shouldShowRuleUpgradeTour = isTourAnchorMounted && !isFlyoutOpen; | ||
|
|
||
| const enhancedSteps = useMemo( | ||
| () => | ||
| tourSteps.map((item) => ({ | ||
| ...item, | ||
| content: item.content, | ||
| })), | ||
| [tourSteps] | ||
| ); | ||
|
|
||
| return shouldShowRuleUpgradeTour ? ( | ||
| <EuiTourStep | ||
| {...enhancedSteps[0]} | ||
| /** | ||
| * children={undefined} is needed to narrow down EuiTourStepProps. Without | ||
| * it we get a TS error: Types of property 'anchor' are incompatible. | ||
| */ | ||
| // eslint-disable-next-line react/no-children-prop | ||
| children={undefined} | ||
| anchor={`#${PER_FIELD_UPGRADE_TOUR_ANCHOR}`} | ||
| anchorPosition="downCenter" | ||
| /> | ||
| ) : null; | ||
| }; |
Oops, something went wrong.