[SecuritySolution] [Bug] save timeline unexpected prompt issue. (#143262) (#143432)

## Issue Summary

One edge case was detected as part of bug #119593 where if user followed below workflow :

1. User modifies the timeline
2. Navigates to a page where timeline is disabled ( eg. manage )
3.  User is presented with `AppLeave` dialog to save the timeline
4. User confirms the navigation without saving
5. Navigation is successfull and user is now on `Manage` page where timeline is disabled
6. Now user leaves the security solution app.
7. **_Unexpected_** : User is presented again with `AppLeave` dialog event though timeline is not present on the `Manage` page.

Below is the video demonstrating that.

https://user-images.githubusercontent.com/61860752/195523104-6577c924-71e5-414b-aacc-5fefe3ca7b41.mp4

## Solution Summary
Timeline save confirmation dialog will only be presented if below conditions are met:
1. Timeline is enabled on the page where user is navigating `from`.
2. User has unsaved changes in timeline.
3. User is navigated `to` a page where timeline is disabled.

Corresponding tests have been added.

https://user-images.githubusercontent.com/7485038/195600383-fdebae52-af07-478d-9d07-9f5acf4d24fe.mov
(cherry picked from commit 5b269e3a47)

Co-authored-by: Jatin Kathuria <jatin.kathuria@elastic.co>
This commit is contained in:
Kibana Machine 2022-10-17 05:30:48 -06:00 committed by GitHub
parent 0a8405d490
commit 4685f580f8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 26 additions and 2 deletions

View file

@ -31,7 +31,7 @@ import {
populateTimeline,
waitForTimelineChanges,
} from '../../tasks/timeline';
import { HOSTS_URL } from '../../urls/navigation';
import { HOSTS_URL, MANAGE_URL } from '../../urls/navigation';
describe('Save Timeline Prompts', () => {
before(() => {
@ -129,7 +129,7 @@ describe('Save Timeline Prompts', () => {
cy.url().should('not.contain', HOSTS_URL);
});
it('When user navigates to the page where timeline is present, Time save modal shold not exists.', () => {
it('When user navigates to the page where timeline is present, Time save modal should not exists.', () => {
populateTimeline();
waitForTimelineChanges();
closeTimelineUsingToggle();
@ -145,4 +145,22 @@ describe('Save Timeline Prompts', () => {
cy.get(ALERTS_PAGE).click();
cy.get(TIMELINE_SAVE_MODAL).should('not.exist');
});
it('Changed and unsaved timeline should NOT prompt when user navigates from the page where timeline is disabled', () => {
populateTimeline();
waitForTimelineChanges();
closeTimelineUsingToggle();
openKibanaNavigation();
cy.get(MANAGE_PAGE).click();
cy.get(APP_LEAVE_CONFIRM_MODAL).should('be.visible');
cy.get(MODAL_CONFIRMATION_BTN).click();
// now we have come from MANAGE_PAGE where timeline is disabled
// to outside app where timeline is not present.
// There should be NO confirmation model in that case.
openKibanaNavigation();
navigateFromKibanaCollapsibleTo(OBSERVABILITY_ALERTS_PAGE);
// should not be manage page i.e. successfull navigation
cy.get(TIMELINE_SAVE_MODAL).should('not.exist');
cy.url().should('not.contain', MANAGE_URL);
});
});

View file

@ -117,5 +117,11 @@ export const useTimelineSavePrompt = (
return actions.default();
}
});
return () => {
// removing app leave handler for timeline when
// components containing timeline unmounts
onAppLeave((actions) => actions.default());
};
});
};