Update workflow for library-sourced content (Authoring MFE - Unit Page)

[bradenmacdonald]

1. When a component in a course is sourced from a v2 library and a newer version is available in the library, display the "Update Available" button. This is already implemented on the legacy Unit page; this task is porting it to the new MFE unit page.

2. When the button is clicked, display a modal with the <CompareChangesWidget>:

3. The modal should be large to facilitate previewing the components.
4. The previews should be interactive (this is already implemented)
5. The "Accept Changes" and "Ignore Changes" buttons should both work, as they already work in the legacy UI.
6. Use a Paragon modal for this. It will look different from the legacy UI screenshot seen above.

[bradenmacdonald]

@jmakowski1123 FYI

[jmakowski1123]

cc @GlugovGrGlib for visibility. These are small additions being made to the new unit page MFE.

[navinkarkera]

@bradenmacdonald Now that the course unit is an iframe that displays the legacy UI, is this issue relevant?

[bradenmacdonald]

@navinkarkera Yes, we should be intercepting the events from the iframe and displaying this modal from the Authoring MFE, not from the legacy page. See how they're doing it for the "Move XBlock" modal: #1422

[navinkarkera]

@jmakowski1123 @lizc577 @sdaitzman @marcotuts This is ready for AC testing on the sandbox

[sdaitzman]

Looks good to me!

Similarly to some other areas, the number of concentric boxes is a bit high here, but I don't think it's a blocker for this.

[navinkarkera]

@sdaitzman This issue is about displaying the preview changes modal from the new course unit page. You can test it here.

The sandbox is set to take you legacy course unit page by default, but we flip this temporarily if required.

[sdaitzman]

Thanks @navinkarkera! Tested a few rounds of updates and the ignore changes feature.

Just out of curiosity, what determines whether the legacy/updated course unit page will be shown?

[bradenmacdonald]

@sdaitzman It's a setting that the administrator controls. There is currently no way for users to toggle the setting nor choose for themselves (though that's something I've been pushing for).

[jmakowski1123]

This is working for me on the new unit MFE page. One behavior nit: After I click either accept or reject, the page auto-jumps to the bottom of the unit page. I think it should jump back to the location of the component that was being synced, wherever it is within the unit outline.

[navinkarkera]

@jmakowski1123 Yes, it is a limitation of how the whole unit iframe is reloaded on accepting or rejecting changes. We can look into a way to reload the specific block which should eliminate the need to scroll anywhere.

Created #1579 to track it.