Description

See the parent ticket for the general description and motivation, openedx/public-engineering#231. Make sure to follow its recommendations for each step of the process.

Tasks

Beta Give feedback

test: Add Node 20 to the CI matrix (example PR)
[build|refactor]: Upgrade to Node 20 (example PR)
test: Remove Node 18 from the CI matrix (example PR)
Options

Group Config Page - location counts not displaying

In the legacy page, the content groups contain counts of how many locations they are used in:

In the MFE page, the number for the counts is missing

[Certificate page] Delete button tooltip appears on the background of the delete modal

Login as a staff to Studio
Go to Course -> Certificates page
Create a certificate
Click delete icon

the same behavior on the Textbook page

The delete button tooltip shouldn’t be shown on the background of the delete modal

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Rate-Limited

These updates are currently rate-limited. Click on a checkbox below to force their creation now.

Warning

Renovate failed to look up the following dependencies: Failed to look up npm package @edx/frontend-app-course-authoring.

Files affected: plugins/course-apps/calculator/package.json, plugins/course-apps/edxnotes/package.json, plugins/course-apps/learning_assistant/package.json, plugins/course-apps/live/package.json, plugins/course-apps/ora_settings/package.json, plugins/course-apps/proctoring/package.json, plugins/course-apps/progress/package.json, plugins/course-apps/teams/package.json, plugins/course-apps/wiki/package.json, plugins/course-apps/xpert_unit_summary/package.json

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Detected dependencies

github-actions

.github/workflows/add-depr-ticket-to-depr-board.yml

.github/workflows/add-remove-label-on-comment.yml

.github/workflows/commitlint.yml

.github/workflows/lockfileversion-check.yml

.github/workflows/self-assign-issue.yml

.github/workflows/update-browserslist-db.yml

.github/workflows/validate.yml

actions/checkout v3

actions/setup-node v3

codecov/codecov-action v4

npm

package.json

@dnd-kit/core ^6.1.0

@dnd-kit/modifiers ^7.0.0

@dnd-kit/sortable ^8.0.0

@dnd-kit/utilities ^3.2.2

@edx/brand ^1.2.2

@edx/frontend-component-ai-translations ^2.0.0

@edx/frontend-component-footer ^13.0.2

@edx/frontend-component-header ^5.1.0

@edx/frontend-enterprise-hotjar ^2.0.0

@edx/frontend-lib-content-components ^2.1.11

@edx/frontend-platform 7.0.1

@edx/openedx-atlas ^0.6.0

@fortawesome/fontawesome-svg-core 1.2.36

@fortawesome/free-brands-svg-icons 5.15.4

@fortawesome/free-regular-svg-icons 5.15.4

@fortawesome/free-solid-svg-icons 5.15.4

@fortawesome/react-fontawesome 0.2.0

@meilisearch/instant-meilisearch ^0.17.0

@openedx/frontend-plugin-framework ^1.1.0

@openedx/paragon ^22.2.1

@reduxjs/toolkit 1.9.7

@tanstack/react-query 4.36.1

classnames 2.2.6

core-js 3.8.1

email-validator 2.0.4

file-saver ^2.0.5

formik 2.2.6

jszip ^3.10.1

lodash 4.17.21

meilisearch ^0.38.0

moment 2.29.4

prop-types ^15.8.1

react 17.0.2

react-datepicker ^4.13.0

react-dom 17.0.2

react-error-boundary ^4.0.13

react-helmet ^6.1.0

react-redux 7.2.9

react-responsive 9.0.2

react-router 6.16.0

react-router-dom 6.16.0

react-select 5.8.0

react-textarea-autosize ^8.4.1

react-transition-group 4.4.5

redux 4.0.5

regenerator-runtime 0.13.7

universal-cookie ^4.0.4

uuid ^3.4.0

yup 0.31.1

@edx/browserslist-config 1.2.0

@edx/react-unit-test-utils 2.0.0

@edx/reactifex ^1.0.3

@edx/stylelint-config-edx 2.3.0

@edx/typescript-config ^1.0.1

@openedx/frontend-build 13.1.0

@testing-library/jest-dom 5.17.0

@testing-library/react 12.1.5

@testing-library/react-hooks ^8.0.1

@testing-library/user-event ^13.2.1

axios ^0.28.0

axios-mock-adapter 1.22.0

eslint-import-resolver-webpack ^0.13.8

fetch-mock-jest ^1.5.1

glob 7.2.3

husky 7.0.4

jest-canvas-mock ^2.5.2

jest-expect-message ^1.1.3

react-test-renderer 17.0.2

reactifex 1.1.1

ts-loader ^9.5.0

decode-uri-component >=0.2.2

plugins/course-apps/calculator/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

plugins/course-apps/edxnotes/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

plugins/course-apps/learning_assistant/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

yup *

plugins/course-apps/live/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-lib-content-components *

@edx/frontend-platform *

@openedx/paragon *

@reduxjs/toolkit *

lodash *

prop-types *

react *

react-redux *

react-router-dom *

yup *

plugins/course-apps/ora_settings/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

yup *

plugins/course-apps/proctoring/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

classnames *

email-validator *

react *

prop-types *

moment *

plugins/course-apps/progress/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

yup *

plugins/course-apps/teams/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

formik *

prop-types *

react *

uuid *

yup *

plugins/course-apps/wiki/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

prop-types *

react *

yup *

plugins/course-apps/xpert_unit_summary/package.json

@edx/frontend-app-course-authoring *

@edx/frontend-platform *

@openedx/paragon *

formik *

prop-types *

yup *

react *

react-redux *

react-router-dom *

nvm

.nvmrc

node 18

Check this box to trigger a request for Renovate to run again on this repository

Pages & Resources Bad link in MFE

Description

Once we go to Studio - > Course (Native course outline) -> Content Dropwon -> Pages and Resources
It'll open up an MFE page for pages and resources.

But once we are within MFE and try to open the 'Pages & Resources' page it leads to a bad link

Steps to Reproduce the Problem

Go to Studio
Go to course
From content drop down, go to Pages & Resources Or any other MFE enabled page in course authoring for that matter
And after that page opens go to content dropdown again and check Pages & Resources

It takes to bad link like this
http://apps.local.edly.io/course-authoring/course/COURSE-ID/apps.local.edly.io/course/COURSE-ID/pages-and-resources

Instead of actual URL which is like this

http://apps.local.edly.io/course-authoring/course/COURSE-ID/pages-and-resources

##Possible Fixes
Maybe these lines are the main issue ?

frontend-app-course-authoring/src/header/utils.js

Line 16 in 3c661e1

href: getPagePath(courseId, 'true', 'tabs'),

frontend-app-course-authoring/src/utils.js

Line 101 in 3c661e1

return `${getConfig().BASE_URL}/course/${courseId}/pages-and-resources`;

As the URL is getting generated from here it could be the issue.

Also checked another thing by setting up the MFE_HOST in tutor config.yml as the BASE_URL is being set from that with the protocol, but that leads to lots of bad links in various places like http://http://apps.local.edly.io...

Specifications

Version: quince.1
Platform: tutor 17.0.1

Course import not working

Importing a tar file does not work, it gets stuck on the first step and just spins.

course.cjycyzl5.tar.gz

^Sample tar file attempting to upload

The actual status does not match the "Enabled" label on the "Open Response Settings" card on the "Pages and Resources" page

The actual status does not match the Enabled label on the Open Response Settings card on the Pages and Resources page:

This state is taken from the CourseAppStatus model.
However, this option in the Course Application State model always remains enabled, regardless of the state of the Flexible Peer Grading switch.

Expectation: If you turn off Flex Peer Grading, the Enabled message disappears.

The correct behavior can be seen in the example of the Progress card on the "Pages and Resources" page.

[Course unit page] Errors related to the iframe of the xblock editing modal window aren't handled

Go to the Course unit page in Studio
Add, for example, Poll xblock
Click "Edit" button
Change maximum substitutions to 0 and click "Save"

Schedule and details promotion banner

Update the banner to have a different background color, possibly info-100, and fix placement if close icon.

[Course unit page] First xblock in the Unit is moved down if user opens edit modal for it

Go to course
Create a new Unit
Add xblock from the advanced list
Click edit for the first xblock in the unit

Studio.known.issues.mp4

studio_view from xBlock/xBlock Asides not being displayed anywhere

Context:

Open edX has support for custom xBlock and xBlock asides where anyone could develop their custom xBlocks in a specific format e.g. defining functions such as student_view, studio_view that would return a fragment(packaged with HTML, CSS. JS resources) which would then be rendered in Studio and LMS.
The Learning MFE does support this and renders the student_view if it exists but the authoring MFE doesn't.
For reference on custom xBlocks please take a look at https://edx.readthedocs.io/projects/xblock-tutorial/en/latest/edx_platform/edx_studio.html.

Legacy Studio (Problem Editor)

In the legacy studio, when you create a custom xblock you could specify its studio_view which then renders in the edit section of that problem under Plugins Tab.

For example, Take a look at the below screenshot (The view rendered here is from xBlock Aside for the Multiple Choice problem):

New Course Authoring MFE (Problem Editor)

In the new MFE, It doesn't render this view anywhere. Although, It does fetch the studio_view via /xblock/<problem_key>/studio_view?_=<id>. You can notice this in the network tab when opening a problem in the new course authoring MFE. We also noticed that the custom studio_view is returned in the response of this API but it isn't rendered anywhere.

Here is a code reference from the lib-components where the API is defined to fetch studio view.

It's possible that this new Course Authoring MFE does support studio_view but there is no documentation on how to enable it?
If it doesn't? Are there any plans to add support for this?

[Course unit page] Problems with Content Experiment functional on the Course unit page

If contentstore.new_studio_mfe.use_new_unit_page flag is enabled, the user faces the following problems when working with experiment groups:

500 error if a user tries to add Content Experiment xblock in frontend-app-course-authoring MFE:
Content Experiment xblock is rendered incorrectly if xblock has been added in Legacy:

Content Experiment xblock rendering in frontend-app-course-authoring MFE

Content Experiment xblock rendering in Legacy

User cannot edit Content Experiment xblock
User can delete Content Experiment xblock
User can proceed to the Content Experiment, page only from the Group Configurations page

500 error on the Learning MFE page

It occurs when staff adds a content experiment xblock to a unit and publishes the changes. When the user tries to get to the Learning MFE page he gets an error.

The error occurs only when a group has not been added to the block.

Logs:

edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/openedx/core/djangoapps/courseware_api/views.py", line 615, in get
edx.devstack.lms  |     return Response(sequence.get_metadata(view=view, context=context))
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/seq_block.py", line 375, in get_metadata
edx.devstack.lms  |     meta = self._get_render_metadata(context, children, prereq_met, prereq_meta_info, banner_text, view)
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/seq_block.py", line 553, in _get_render_metadata
edx.devstack.lms  |     blocks = self._render_student_view_for_blocks(context, children, fragment, view) if prereq_met else []
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/seq_block.py", line 763, in _render_student_view_for_blocks
edx.devstack.lms  |     item_type = get_icon(block)
edx.devstack.lms  |   File "/edx/app/edxapp/venvs/edxapp/lib/python3.8/site-packages/edx_django_utils/plugins/pluggable_override.py", line 77, in wrapper
edx.devstack.lms  |     return prev_fn(*args, **kwargs)
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/openedx/core/lib/xblock_utils/__init__.py", line 522, in get_icon
edx.devstack.lms  |     return block.get_icon_class()
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/vertical_block.py", line 254, in get_icon_class
edx.devstack.lms  |     child_classes = {child.get_icon_class() for child in self.get_children()}
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/vertical_block.py", line 254, in <setcomp>
edx.devstack.lms  |     child_classes = {child.get_icon_class() for child in self.get_children()}
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/split_test_block.py", line 398, in get_icon_class
edx.devstack.lms  |     return self.child.get_icon_class() if self.child else 'other'
edx.devstack.lms  |   File "/edx/app/edxapp/venvs/edxapp/lib/python3.8/site-packages/django/utils/functional.py", line 57, in __get__
edx.devstack.lms  |     res = instance.__dict__[self.name] = self.func(instance)
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/split_test_block.py", line 176, in child
edx.devstack.lms  |     if self.child_block is not None:
edx.devstack.lms  |   File "/edx/app/edxapp/venvs/edxapp/lib/python3.8/site-packages/django/utils/functional.py", line 57, in __get__
edx.devstack.lms  |     res = instance.__dict__[self.name] = self.func(instance)
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/split_test_block.py", line 166, in child_block
edx.devstack.lms  |     child_blocks = self.get_child_blocks()
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/split_test_block.py", line 216, in get_child_blocks
edx.devstack.lms  |     group_id = self.get_group_id()
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/split_test_block.py", line 245, in get_group_id
edx.devstack.lms  |     return partitions_service.get_user_group_id_for_partition(user, self.user_partition_id)
edx.devstack.lms  |   File "/edx/app/edxapp/edx-platform/xmodule/partitions/partitions_service.py", line 146, in get_user_group_id_for_partition
edx.devstack.lms  |     raise ValueError(
edx.devstack.lms  | ValueError: Configuration problem!  No user_partition with id -1 in course course-v1:2u+1+1

Upgrade Node JS from 16 to 18

Abstract
Node 16's support will end on September 11, 2023. So we have to upgrade node JS to v18 before that.

Extras
Project should use .nvmrc to have a consistent node version
We have to update Readme accordingly.

Upgrade Node JS from 16 to 18

String in Transifex uses edX instead of {platformName}?

The following string found in Transifex uses edX "as is" and that could be an issue with service provider who use a different platform name than edX.

To fully configure {providerName} will also require sharing usernames and emails for learners and course team. Please contact your edX project coordinator to enable PII sharing for this course.

Key: authoring.discussions.stuffOnlyConfigGuide

I am suspecting edX should be replaced by {platformName} if the variable is available at runtime, but {platformName} doesn't seem to be in any part of the code of the current repo.

Tagging @Carlos-Muniz as he suggested when I originally reported the report in the #translations-working-group channel in Slack.

@edx/teaching-and-learning

Convert Accessibility page into a plug-in

Current the Accessibility page set up to only be used by edX. The messages have edX hard coded into them as well has the default email address and apis. Converting this to a plug-in will help it become more useable for entire community.

Video player - contains edx reference

edX reference that should be removed. Instead, it should say "To be sure all learners can access the video, it is recommended to provide additional videos...."

[BUG] Video uploads broken link

MFE: https://github.com/openedx/frontend-app-course-authoring

Dropdown link Content > Video Uploads in Pages&Uploads leads to 404.

This is cross issue from openedx/wg-build-test-release#275
Discuss post was created: https://discuss.openedx.org/t/the-issue-with-video-uploads-button-in-course-authoring-mfe/10221

Enforce "main section" layout rules for all course-authoring MFE pages

There are discrepancies across the pages regarding their main layout. All of the pages use <Layout> from Paragon if the page requires an aside. However, not all of the margins are identical and if a change is made in one it will not apply to all of the layouts.

Proposal:

Create a generic <PageContainer> that uses <Layout> from Paragon and is used across all pages. This will make is easier to make changes across all pages and reduce the amount of replicated code.

[Course unit page] An error appears while rendering SCORM in Studio

The problem is related to the new Сourse unit page. After uploading the SKORM file, an alert appears with an error.

Add SCORM xblock to the Course unit page
Upload the SCORM file

frontend-app-course-authoring MFE (Course unit page):

Learning MFE:

[Course unit page] The PDF isn't displayed on the Course unit page

The PDF isn't displayed on the Course unit page

Open the Course unit page in Studio.
Add the PDF xblock.
Upload the file.

frontend-app-course-authoring MFE (Course unit page):

Legacy studio:

[Course unit page] The info popup does not update the name when a user copies an item and changes the item name

Got to the Course unit page
Create a xblock
Click “Copy to clipboard“
Change the name of the copied block

the name of the element isn't updated

Some problems with drag and drop functionality

In the current implementation of the Course outline page, we have the previously added drag-and-drop functionality for sections, sub-sections, and course units. Technically, this functionality is based on two @edx/frontend-lib-content-components repository components: SortableItem and DraggableList.

Screen.Recording.2024-02-22.at.12.25.41.mov

In the video attached below you can notice problems with the visual display of the dragged component, specifically:

Floating position of the "Drag to reorder" tooltip. The tooltip is displayed during hover (or focus on draggable button)
Available to drag an element beyond the boundaries of the page container (under or above neighboring elements)
Visual distortion of the dragged element
There is no high level of z-index (the dragged element may be hidden under other elements on the page)

The drag-and-drop functionality is now being used for the new Сourse unit page (under development). It makes sense to carry out optimizations and corrections in @edx/frontend-lib-content-components to improve performance and user experience for the Course outline and Course unit pages of the current repository frontend-app-course-authoring

[Course unit page] Related tags aren’t saved after copy/paste xblock

On the Сourse unit page, if any xblock has tags, the tags are not saved after copy/paste xblock.

Login as a staff to Studio
Go to Course -> Course outline -> Course unit page
Click three dots menu for the component with tag count and select "Copy to clipboard"
Create a new unit and paste the copied component

Studio.known.issues.mp4

Tags not displaying in tag drawer even when a taxonomy is enabled

I have imported a new taxonomy, checked that all the tags are displaying correctly in the taxonomy view, and enabled it for all organizations. However, when I go to a course, I only see the taxonomy name in the tag drawer, but not any of the associated tags.

Video player - License Type not sticking

Expected behavior:

When I upload a video and add a license type and click save, I expect to see the license information displayed in the lower righthand part of the screen of the video block.

Problematic behavior:

When I upload a video and add a license type and click save, I do not see the license information displayed on the video block, and when I click "edit" on the video block again and come back to the license type field, it is empty. It reverts back to it's original state and does not save the selected license type.

[Certificate page] An error occurs when the user clicks "Cancel" for an editable signature in the legacy page view

Preconditions

A certificate has been created in MFE
waffle flag contentstore.new_studio_mfe.use_new_certificates_page is disabled

Log in to Studio as a staff
Go to the Studio certificate page
Click edit for one of the added signatures

user can cancel signatory editing

Update links on footer of Studio Home

The following links need to be updated/changed

edX documentation ---> Should be changed to Open edX documentation and should link to docs.openedx.org

Enroll in edX101 ---> Should be changed to [Open edX demo course?]

Enroll in StudioX ---> Should be changed to [???]

Open edX nightly sandbox ---> [Not sure where this should lead but it currently just links to the LMS]

SelectableBox component not selectable

Description

2U's update of course-authoring to the [email protected] version of paragon caused a bug where selectableboxes were not clickable or selectable. This occurred on their stage server and is very hard to reproduce locally, but looks to be tied to the paragon component since it only happens in the newer version and affects every place the component is used.

See openedx/paragon#3015 for more details. This issue is meant to track actions to be taken for this repository.

Steps

#871
#880
#886
#887
Once the issue is fixed upstream, go back to using Paragon directly, as opposed to the version in frontend-lib-content-components

Create flag to disable Discussions configuration

In order to include course-authoring in the next release and still have the Pages & Resources feature, we need a way to disable the frontend-app-discussions configuration.

Switch to Ansible-free Docker image

In order to advance implementation of both OEP-45: Configuring and Operating Open edX and openedx/public-engineering#51, we would like to switch devstack from using primarily Docker images built with Ansible code from the configuration repository to images built from Dockerfiles in each service's repository. We hope this will also help simplify Tutor by providing better base images to derive from, with fewer workarounds and duplicated code blocks required in Tutor.

A/C

Ensure that the repo's Dockerfile can create a base image which is appropriate for small production installations
Ensure that the repo's Dockerfile also defines an additional image derived from the base which adds dependencies and configuration changes needed for development environments
Check with the Tutor developers during code review to see if any further changes to the Dockerfile would help simplify Tutor
Automate uploads of both images when code changes are merged
Switch devstack to use the new Ansible-free development image, and do some basic testing to ensure it works before merging

Studio Homepage: Course rerun action not working from new 3-dot menu

The new Studio homepage includes a 3-dot menu with two actions: To re-run the course and to view the course live on the LMS.

When I click re-run a course, I should see the modal with course re-run metadata fields.

This action doesn't work. When clicked, it return the error screens below

Course Staff permissions reversion

Users who have been granted staff permissions in the django admin randomly have their permissions reverted. It seems to happen when they reload Studio homepage.

[Course unit page] 500 error appears if a user copies a unit or xblock with emoji

On the Course unit page, if the user copies an xblock that contains an emoji (for example, feedback xblock). The user receives a 500 error.

Feedback xblock:

Logs:

django.db.utils.OperationalError: (1366, 'Incorrect string value: \'\\xF0\\x9F\\x98\\x80">...\' for column \'olx\' at row 1')

specifies that there is support only for 3-byte encoding in the MySQL database. Smiles are encoded with 4 bytes and this error happens.

Related issue

unable to upload videos in local dev environment

This issue is fully reproducible on master (815ddbe as of writing)

In my .env.development file I set

ENABLE_NEW_VIDEO_UPLOAD_PAGE = true
ENABLE_VIDEO_UPLOAD_PAGE_LINK_IN_CONTENT_DROPDOWN = true

At first I was getting 404 errors when trying to upload videos, so I went digging through edx-platform code and found

https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/toggles.py#L433-L437
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/toggles.py#L217-L231
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/xmodule/course_block.py#L1506-L1514
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/video_storage_handlers.py#L570-L589
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/video_storage_handlers.py#L181-L231
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/video_storage_handlers.py#L216-L220
and
https://github.com/openedx/edx-platform/blob/6edc0c2dd9084a6892fd3a504ae71f2900d5ad4b/cms/djangoapps/contentstore/toggles.py#L500-L516

After which I set the following waffle flags

contentstore.mock_video_uploads
contentstore.enable_studio_content_api
contentstore.new_studio_mfe.use_new_video_uploads_page	
contentstore.new_studio_mfe.use_new_files_uploads_page

As well as the following Video Pipeline settings

Course video uploads enabled by defaults
Video uploads enabled by defaults

I then started getting 403 errors when trying to upload videos

{
    "httpErrorType": "api-response-error",
    "httpErrorStatus": 403,
    "httpErrorResponseData": "<Response is HTML>",
    "httpErrorRequestUrl": "http://localhost:18010/videos/course-v1:edX+DemoX+Demo_Course",
    "httpErrorRequestMethod": "post"
}

I then looked through https://openedx.atlassian.net/wiki/spaces/AC/pages/645726427/Video+Pipeline+Testing+Sandbox (thanks for pointing me to this @KristinAoki!)

I tried adding {"course_video_upload_token": "shared_course_token"} to the "Video Upload Credentials" textbox in Studio -> Advanced Settings as recommended there.

I could not find Oauth2 > Clients in django admin.

After that, I am still getting 403 errors.

Digging into the response a bit shows CSRF issues

<div id="summary">
  <h1>Forbidden <span>(403)</span></h1>
  <p>CSRF verification failed. Request aborted.</p>


</div>

<div id="info">
  <h2>Help</h2>
    
    <p>Reason given for failure:</p>
    <pre>
    Origin checking failed - http://localhost:2001 does not match any trusted origins.
    </pre>
    

  <p>In general, this can occur when there is a genuine Cross Site Request Forgery, or when
  <a
  href="https://docs.djangoproject.com/en/4.2/ref/csrf/">Django’s
  CSRF mechanism</a> has not been used correctly.  For POST forms, you need to
  ensure:</p>

  <ul>
    <li>Your browser is accepting cookies.</li>

    <li>The view function passes a <code>request</code> to the template’s <a
    href="https://docs.djangoproject.com/en/dev/topics/templates/#django.template.backends.base.Template.render"><code>render</code></a>
    method.</li>

    <li>In the template, there is a <code>{% csrf_token
    %}</code> template tag inside each POST form that
    targets an internal URL.</li>

    <li>If you are not using <code>CsrfViewMiddleware</code>, then you must use
    <code>csrf_protect</code> on any views that use the <code>csrf_token</code>
    template tag, as well as those that accept the POST data.</li>

    <li>The form has a valid CSRF token. After logging in in another browser
    tab or hitting the back button after a login, you may need to reload the
    page with the form, because the token is rotated after a login.</li>
  </ul>

  <p>You’re seeing the help section of this page because you have <code>DEBUG =
  True</code> in your Django settings file. Change that to <code>False</code>,
  and only the initial error message will be displayed.  </p>

  <p>You can customize this page using the CSRF_FAILURE_VIEW setting.</p>
</div>

@arbrandes has also been trying to get this working, but he has been using tutor instead

Bug: Actions on 3-dot menu are in the wrong order

In the new Unit MFE, on components, the 3-dot menu is currently displaying as:

The order should be instead:

-Manage tags
-Copy to clipboard
-Duplicate
-Move
-Manage access
-Delete

This ensures consistency between the 3-dot menu on the course outline page and on the unit page.

Key error when accessing text editor

This issue is reproducible in master (60c1a034)

I have this waffle flag active:

new_core_editors.use_new_text_editor

I'm getting the following error when entering the text editor:

course authoring doesn't work with frontend-lib-content-components

When we clone frontend-lib-content-components
And update our module.config.js pointing to the frontend-lib-content-components cloned we will get an error which will be this

Step to reproduce it

go to your frontend-app-course-authoring

  cd ~/workspace/frontend-app-course-authoring
  git checkout master
  git pull origin master

Clone frontend-lib-content-components inside frontend-app-course-authoring folder

  git clone https://github.com/openedx/frontend-lib-content-components.git
  cd frontend-lib-content-components && nvm use && npm install

Configure/create your module.config.js file to this

module.exports = {
  localModules: [
    {
      moduleName: "@edx/frontend-lib-content-components/dist",
      dir: "./frontend-lib-content-components",
      dist: "src",
    },
    {
      moduleName: "@edx/frontend-lib-content-components",
      dir: "./frontend-lib-content-components",
      dist: "src",
    },
  ],
};

Inside your frontend-app-course-authoring

  nvm use && npm install
  npm start

Datepicker and UTC

Issue Replication

Head to o http://localhost:2001/course/COURSE_ID/settings/details
Open the Network tab on Developer Settings.
Submit a new course start time.
Although it says UTC above the field, the time input when set is considered to be local time (in my case UTC+1), and what gets sent to the backend is the time input value converted to UTC. So when I chose 15:00, 14:00 gets sent to the backend.

Upgrade React JS to v17

This repo is currently using React JS v16. We need to upgrade it to React 17 before moving to latest React version(v18).
React 17 doesn’t add any new developer-facing features, so its upgrade might not cause any breaking changes. Our end goal is to upgrade React to v18 but v18 no longer support enzyme, so we are upgrading to React 17 and then we’ll migrate from enzyme.

Epic Link

React 17 upgrade

Limited staff issues

Limited staff (403 error outline page)
Course staff with full permission
Unit page if a Limited staff opens the unit by direct link
Limited staff can perform any action with a certificate
Limited staff aren't allowed to do any actions on the textbook pages
403 error is returned when a limited staff opens the Group Configurations page
For the legacy side, the Studio host is denied for the Limited staff (403 error)

[Course unit page] Edit modal reopens for Google Calendar and Google document xblocks after the user clicks "save"

Go to course
Create a new Unit
Add xblocks "Google Calendar" and "Google Document" from the advanced list
Click edit for the "Google Calendar" xblock in the unit, make some changes, and click "Save"
Click edit for the "Google Document" xblock in the unit, make some changes, and click "Save"

Edit modal isn’t reopening after the user clicks "save"

Studio.known.issues.mp4

The Unit Link on Course Outline page is broken

Description:

When opening unit page from Course-Outline, the 404 error is shown because of the incorrect URL.

Revision:

Master

STR:

Set ENABLE_UNIT_PAGE env variable to True
Open any course in studio and try to open a Unit.

ER:

Unit Page is opened with placeholder

AR:

The 404 error is shown

Probable solution:

Remove condition in this function, so the unit URL is always determined via backend - https://github.com/openedx/frontend-app-course-authoring/blob/master/src/course-outline/hooks.jsx#L84.
An alternative would be to expose and use django waffle flag on the front-end, and update link pattern to the same declared in the react router, so we could still efficiently push user's route on frontend, without additional request to backend.

[Course unit/outline] Updating the sidebar structure issue

The sidebar is updated by publishing changes to the unit. Let's consider the case of changing access to the unit for the enrollment tracks or content groups. If a staff member assigns a track from the unit page, the changes trigger the publish, and therefore the sidebar structure changes after clicking the publish button. But if a staff configures accesses for a unit from the outline page, no trigger is received, so the sidebar remains the same as the last published version.

Unit page:

Change the access setting for a “Published and live“ unit

The draft state is triggered by saving the access changes

Outline page:

Changing the access for the “Welcome to the Open edX® platform“ unit

After saving the unit remains “Live“

[Course unit page] Edit modal is freezing if user opens it during xblock content rendering

All content is rendering in Edit modal i if a user opens it during xblock content rendering

Studio.known.issues.mp4

Course outline page: Weird alignment happening on the highlights feature

When I add highlights to a section in the course outline, the field for the fifth highlight and the save/cancel buttons spill off the modal

Update document.title to use Helmet

Using the Helmet component is makes updating the document title more readable and easier to control. Also need to add intl for the page name.

Example: https://github.com/openedx/frontend-app-course-authoring/blob/master/src/export-page/CourseExportPage.jsx#L53

[Course unit page] 500 error appears while duplicating video xblock on the Course unit page

Open the unit with the added Video xblock
Add the Vimeo video
Duplicate the xblock

500 error occurs. The same behavior on the Legacy unit page

New editors don't support runtime configuration

Currently, the page that hosts the new editors fetches configuration directly via process.env. This circumvents the runtime configuration mechanism, so that when using the latter exclusively, the editor can fail in the browser with a console error.

This does not affect deployments where the configuration is baked into the .env file.

PRs

#412 (master)
#415 (olive)

Can't hide progress graph from Studio

Description

When entering Pages & Resources > Progress and disabling the progress graph, it keeps appearing at the top of the progress page:

I've tested this on the Palm Demo instance. Is it a bug? Or we're referring to a different course progress graph? Or even, am I missing another configuration?

New MFE: Course Authoring

Product scope and features included

What's included?
What features does this new MFE deprecate?

Community Release Information

Product-ready details:

Is this feature enabled by default? Is it currently enabled?
Is this feature internationalized?
Is this feature theme-able?
What's the production status as of the date of the code cut-off?
Primary contact: T&L; Jeremy Ristau

Documentation details:

Link to Product blog:
Link to "How to enable":
Link to any other relevant technical documentation:

Related work

openedx/axim-engineering#523

openedx / frontend-app-course-authoring Goto Github PK

frontend-app-course-authoring's People

Contributors

Stargazers

Watchers

Forkers

frontend-app-course-authoring's Issues

Description

Tasks

Rate-Limited

Open

Detected dependencies

Description

Steps to Reproduce the Problem

Specifications

500 error on the Learning MFE page

Proposal:

Description

Steps

Step to reproduce it

Issue Replication

Epic Link

Description:

Revision:

STR:

ER:

AR:

Probable solution:

Unit page:

Outline page:

PRs

Description

Product scope and features included

Community Release Information

Related work

Recommend Projects

Recommend Topics

Recommend Org