[UI] Require confirmation when clicking Edit tab while Experiment is running

[john-thomas-dotcms]

Parent

https://github.com/dotCMS/core/issues/22455

[john-thomas-dotcms]

Problem

Right now, a user can change the original page while an Experiment is running. But this essentially changes the page, which means that if the change is significant, it can invalidate the results collected to that point.

Solution

When an Experiment is running, and a user clicks the Edit tab in the page editor, we need to pop up a modal that requires them to confirm before they edit the page.

Message in the confirmation popup:

An Experiment is currently running on this Page.  If you Edit the Page, you may invalidate any results already collected.

Are you sure you want to continue?

Buttons the user can select:

• Cancel
  • If selected, it changes the view to Preview
• Continue to Edit
  • If selected, it changes the view to Edit, and allows the user to make changes

Other Potential Solutions

The solution above was chosen because it's easy and safe to implement, and allows emergency edits, but requires the user to acknowledge that their edits my cause problems.

But there are several other ways we could solve this problem. While an Experiment is running, we could:

• Show a banner across the top of the page editor to make it clear to the user
  • Advantages: Easy and safe to implement, and allows emergency edits
  • Disadvantage: Doesn't require the user to acknowledge it - so they still might miss it
• Lock the page using the system user, to prevent other users from making changes
  • Advantage: The lock could still be overridden by an admin for emergency changes
  • Disadvantage: It wouldn't be clear (without additional work) why the user can't edit the page
• When a user clicks the Edit tab, gray out the page and prevent editing
  • Advantage: A message on the grayed out area would make it clear why it's uneditable (and how to make it editable)
  • Disadvantage: Doesn't allow emergency edits
• Prevent the user from clicking the Edit tab
  • Advantage: Simple and safe to implement
  • Disadvantage: Doesn't allow emergency edits

[hmoreras]

Modal prevention Scenarios when trying to edit a page

[oidacra]

IQA Passed: Confirm Dialog showed on a Page with a Running Experiment (On tab Edit).

[bryanboza]

Ok we have a problem here...

• This is working as expected in the regular master branch
• But if you enable the SEO improvements feature flag (DOT_FEATURE_FLAG_SEO_IMPROVEMENTS”: ‘true’), this is changing a little bit the UI and after enable this this fix is not working anymore.

We need to discuss this and find the way this fix work in both cases.

[hmoreras]

QA: Now the changes works with the SEO feature flag on DOT_FEATURE_FLAG_SEO_IMPROVEMENTS , PR: https://github.com/dotCMS/core/pull/25828

[freddyucv]

Pass Internal QA: Work as expeced with the SEO feature flag on DOT_FEATURE_FLAG_SEO_IMPROVEMENTS

[bryanboza]

We need some work here:

• We are showing this confirmation before go to edit page, but if you are editing the page and click on the edit tab, we are showing thins message again, wich does not make sense since you already are editing the page and you already accept this.

• If you are in the editing tab and click in the same tab again, you need to escape this exception

https://github.com/dotCMS/core/assets/2641437/e71bc540-3ad2-4144-a258-54fd39098bbb

[oidacra]

IQA Passed:

• In the Edit Page on Variant, clicking the Tab Edit, does not show the Dialog.

[bryanboza]

Fixed, tested on master // Docker // FF