feat: xblock asides view for rendering in an iframe in MFE

[Anas12091101]

Description

This PR allows retrieval of all asides associated with a given xblock usage key and renders them into an HTTP response template page. This capability becomes particularly relevant for utilization within an iframe in the course authoring Micro-Frontend (MFE), which presently lacks support for asides configuration.

For this a django view asides_handler is created which

• Retrieves the relevant xblock using the usage key provided in the URL.
• Gathers all the asides having a studio view configured for that specific xblock.
• Wraps the asides using the wrap_asides method and passes them as a context to the
  asides.html template.

The wrap_asides method generates an HTML wrapper for each aside, which can be rendered within an HTML template containing information necessary for loading the aside. Subsequently, BackboneJS loads the asides into the wrapper. The xblock itself is rendered in a similar manner.

Note: The approach used in this PR is inspired by the rendering of xblocks in the learning MFE.

Useful information to include:

• The change in this PR will impact the course author using course-authoring MFE.
• Screenshots:

Supporting information

Related Issue openedx/frontend-app-authoring#545
MFE PR openedx-unsupported/frontend-lib-content-components#452

Testing instructions

Please provide detailed step-by-step instructions for testing this change.

• Login to edx-platform.
• In Studio, go to the edX Demo Course. Create a new unit which is a multiple choice problem.
• Configure the rapid response aside for this problem
• Go to the URL http://localhost:18010/asides/{xblock-usage-key-for-the-problem} and you will see the rapid response aside upon loading completion.

[openedx-webhooks]

Thanks for the pull request, @Anas12091101!

What's next?

Please work through the following steps to get your changes ready for engineering review:

🔘 Get product approval

If you haven't already, check this list to see if your contribution needs to go through the product review process.

• If it does, you'll need to submit a product proposal for your contribution, and have it reviewed by the Product Working Group.
  • This process (including the steps you'll need to take) is documented here.
• If it doesn't, simply proceed with the next step.

🔘 Provide context

To help your reviewers and other members of the community understand the purpose and larger context of your changes, feel free to add as much of the following information to the PR description as you can:

• Dependencies

  This PR must be merged before / after / at the same time as ...

• Blockers

  This PR is waiting for OEP-1234 to be accepted.

• Timeline information

  This PR must be merged by XX date because ...

• Partner information

  This is for a course on edx.org.

• Supporting documentation
• Relevant Open edX discussion forum threads

🔘 Get a green build

If one or more checks are failing, continue working on your changes until this is no longer the case and your build turns green.

🔘 Let us know that your PR is ready for review:

Who will review my changes?

This repository is currently maintained by @openedx/wg-maintenance-edx-platform. Tag them in a comment and let them know that your changes are ready for review.

Where can I find more information?

If you'd like to get more details on all aspects of the review process for open source pull requests (OSPRs), check out the following resources:

• Overview of Review Process for Community Contributions
• Pull Request Status Guide
• Making changes to your pull request

When can I expect my changes to be merged?

Our goal is to get community contributions seen and reviewed as efficiently as possible.

However, the amount of time that it takes to review and merge a PR can vary significantly based on factors such as:

• The size and impact of the changes that it introduces
• The need for product review
• Maintenance status of the parent repository

💡 As a result it may take up to several weeks or months to complete a review and merge your PR.

[mphilbrick211]

Hi @Anas12091101! Thanks for this contribution! Please let me know if you have any questions regarding submitting a CLA form.

[pdpinch]

@mphilbrick211 Anas should be covered by the MIT Entity agreement. I don't know if you have access, but I've added him to the list at https://docs.google.com/spreadsheets/d/1HEaYDtoBtN-vvloA5UC-4oAHTVGzWbJWYVzYrEwFT4Y/edit#gid=755274227&range=28:28

[mariajgrimaldi]

Hi there @Anas12091101, can we list in the cover letter the PR against the master branch? Thanks!

[Anas12091101]

Hi @mariajgrimaldi, I had not created a master PR previously. I have now rebased this PR to be merged into master. Will create a separate PR for quince branch

[mphilbrick211]

Hi @Anas12091101! Just following up on this, and flagging that there's a failing check.

[Anas12091101]

Hi @mphilbrick211 , all the checks are now successful.

[pdpinch]

Configure the rapid response aside for this problem

@Anas12091101, do you know if this can this PR be tested with the Thumbs xBlock, which is included in the xBlock SDK?

[Anas12091101]

@pdpinch, this PR can be tested on any XBlock Aside that has a studio_view. However, the Thumbs XBlock Aside doesn't have a studio_view_aside function, so this PR cannot be tested on it.

[mphilbrick211]

Hi @Anas12091101 @pdpinch - is this still in progress?

[pdpinch]

Yes, it's still in progress. I'm still trying to find (or create) appropriate documentation for this feature so that it won't be so obscure.

[pdpinch]

Is there a way this could be handled with a plugin slot?

[Anas12091101]

From my understanding, plugin slots can be used to customize MFE components. I believe we can modify our authoring MFE PR (which was closed and needs to be reopened) to add an iframe plugin slot that loads the aside from http://localhost:18010/asides/{xblock-usage-key-for-the-problem} after the merge of this PR

[mphilbrick211]

From my understanding, plugin slots can be used to customize MFE components. I believe we can modify our authoring MFE PR (which was closed and needs to be reopened) to add an iframe plugin slot that loads the aside from http://localhost:18010/asides/{xblock-usage-key-for-the-problem} after the merge of this PR

@Anas12091101 @pdpinch is this still in progress?

[pdpinch]

We still very much need it, but I think we need some guidance and consensus on the approach.