[BD-14] Content Libraries and Editing Project Overview

Reach (Customer) 

All course authors across the platform will have the ability to create content libraries and editing.. 

Impact + Measure (Outcome) 

Improvement to educator NPS rating & platform map competitiveness assessment (currently authoring is listed as a top 10 gap area) 

T&L Gap Impact

Course authoring is a top 10 T&L platform gap area, and these changes will introduce a set of key requested features not available on any other top 10 competitive alternatives to Open edX’s authoring experience. 

(Styling / Other Improvements to M2) Educators can source specific components from libraries into their unit pages using a new Source Content Library block. (v1.1)

To DO

Add a UI to allow browsing, searching, and filtering library content to choose what components will be included as children (instead of the MVP version which required entering library block IDs ). This would be a great place to prototype a React-based XBlock editing experience!

PR Details

Open

Open

Figma Link - Step 1 in Course Unit Page, Steps 2,3,4 Library Reference Block Modal Step, Step 5 Render Library Reference Block in Unit Page

As a member of the Partner support team, I want to ensure that the guidance and support documentation for Libraries is accurate so that Partners will continue to use this feature successfully.

AC: 

1. Review Libraries support documentation authored by Partner SUpport. 

2. Ensure that the guidance in the document is accurate based on the current behavior/offering of content libraries v2

3. Provide feedback or revisions in the document. 

As an edX Partner, I want to learn about the improvements to Content Libraries, Problems, and Video editing so that I can take advantage of these changes.

AC: Document the updates to the Content Libraries, Problem, and Video authoring experience.

This adds pagination to the library list page and the library detail page, making it possible to work with the MFE where there are a large number of libraries and/or libraries with a large number of blocks.

To DO

This PR is open currently in the “Waiting FOr Author Status”.

Pretty much still a WIP, as it's still missing tests.

This Pull Request adds pagination to the library list page and the library detail page, making it possible to work with the MFE where there are a large number of libraries and/or libraries with a large number of blocks. Also, besides the pagination, a new page is created to be able to import all possible blocks from a course.

To DO

Add pagination support to legacy library API to fulfill requirements of [BD-14] [SE-2945] Add pagination to library list view by gabor-boros · Pull Request #14 · openedx-unsupported/frontend-app-library-authoring

To DO

Educators can search within a content library to filter their view and see specific blocks.

To DO

This is about polishing the already implemented experience, including fixing any bugs and a redesign so that the search box to the right can be opened and closed with the corresponding search button on the top right.

Figma Link - Library Listing (Search Enabled),

Figma Link - Library Listing (Search Enabled),

Educators can access help content when clicking on the help button.

To DO

Figma Link - (Help and Documentation Enabled)

(Styling / Other Improvements to L3 and L4) Educators can find a specific library, or view / filter down to specific library types, from the Library Listing page.

To DO

This is about styling updates, including the ability to open and close the search box.

Figma Link - Content Libraries (styling cleanup to search Sidebar)

(Improvement to A4) Educator block search is improved using metadata from library content blocks

To DO

Support full text search of blocks by leveraging the index_dictionary XBlock API (like LabXchange does). Indexing will be a heavy operation, but the source data is there and a mechanism for retrieving it exists.

Educators have confidence on what the scope of their publish action will do for a given component / library.

To DO

This is about the "x library items, unsaved changes, last updated on" captions to the left of the publish button on the library authoring page.

Figma Link - See Publish Sidebar on the right side of the Library Authoring Page (additional states + cases necessary for UX discovery)

(Styling / Other Improvements to M1) Educators can add new components to author in their content libraries.

To DO

This is pertaining to the redesign of the Add new library item box and buttons on the library authoring page, including new messaging when the library is empty.

Figma Links - Library Authoring Page (Empty View), Library Authoring View (Single Block)

Educators can view previously added components and optionally show (or hide) Studio previews for all of them.

To DO

The functionality already exists, but requires restyling according to the new designs.

Figma Links - Library Authoring Page (Collapsed Blocks)

Educators see buttons to delete, duplicate, edit, and move blocks in a Library.

To DO

This is about restyling the buttons as shown in the new designs.

Figma Links - Library Authoring Page (Collapsed Blocks)

Educators can reorder blocks in a Library page arbitrarily by clicking and dragging the drag button on a block’s button bar.

To DO

Blocks in a Library (a.k.a. a Blockstore Bundle) are already stored in arbitrary order, but new APIs might be necessary for this to be performant. Also, pagination needs to be taken into account: users will only be able to reorder within a particular page.

Figma Links - Library Authoring Page (Collapsed Blocks)

Educators are limited from authoring content libraries that are too large to be performant.

To DO

This is about implementing user interaction when the limit is reached.  There are no mockups, yet.

Figma Link - No page level message shown in Figma. To review with UX, but a page level alert may be used here.

Educators can duplicate a library component to edit / modify, as is the case in our course editing experience today.

To DO

This is about implementation of the "copy" button visible beside each block's trash icon on the library authoring page.

Figma Link - See duplicate action on component header in Library Authoring view

(Styling / Other Improvements to L1) Educators can view a listing of all the libraries they are content authors / viewers for within a given instance.

To DO

This is about styling and layout modifications to the list of libraries, including spacing, button positioning and icons.  This is not about the search of help dialogs to the right.

Figma Link - Library Listing (Search Enabled), (Help and Documentation Enabled)

(Styling / Other Improvements to L2) Educators can create new v2 Libraries, including the ability to specify license and library type up front. (v1)

(This is about conformance of the Create New Library box to the Figma mockup.)

To DO

(Adolfo) I'm assuming this pertains to the new closable help and search boxes, along with styling improvements and a block count on each library.

Figma Link - Create New Library (Note, UX review necessary for CC license configuration, may not use the dropdown as shown in Figma)

Figma Link - Create New Library

(Styling / Other Improvements to L3)

• Educators can author problem libraries, which only allows problems, drag drop, and ORA to be added? (TBD on specificity here) (v1)

To DO

Since the 2. Authoring Page - Cleaned-up above will handled redesign of the buttons and the underlying library type functionality is already implemented, this is solely about adding Drag and Drop and ORA to the problem type.

Figma Link - Library Authoring Page (Empty View), Library Authoring View (Single Block), with video + Problem library types showing fewer blocks than full list

(Improvement to A3) Educators can sort library components by date added.

To DO

Sorting library components by date added will be tricky.  Libraries are, in blockstore terminology, "Content Bundles", and Blockstore design does not foresee storing such a date field for each block.  Bundle versions have associated dates, but this applies to the whole bundle, not individual blocks.  LabXchange solves this by introducing a metadata layer on a standard relational database table, where each block gets a row.  It is suggested that the same approach be taken for Content Libraries.  Because this will be the first such metadata "overlay" for libraries, care will need to be taken to design the architecture sanely.  Hence, the larger estimate.

Figma Link - Not Applicable, will appear in current order, may be able to remove this row?

Educators can sort content libraries by date modified on the listing page

To DO

Unlike 12. New Authoring Page: Sorting by Date Added on 1.3 above, modification date for a given library is stored by Blockstore via "snapshot" creation dates. Use that information to create an index and to make the Library Listing Page sortable by date modified, in addition to name.

Figma Link - No Figma Link currently, This Help Sidebar for Library authoring view is similar to main Library Listing page, with options dependent on which sort options are possible. (similar to row 12 in v1.3 milestone)

Educators can use the Randomized Content Block using v2 Content Libraries

Update the "Randomized Content XModule" so that it can support Blockstore-based content libraries in addition to modulestore-based ones.

Figma Link - None exist, would echo stepper pattern shown in Steps 2-4 from milestone v1.6

Educators can author problems in a library context.

To DO

Clicking on the edit button opens a “full-screen modal”, rendered by the Library Authoring MFE itself but, for future reusability, imported as a component from a common repository.

This is because the current editor for CAPA problems has a lot of implicit undeclared dependencies on the existing Studio JavaScript/UI, and it doesn’t function at all in a React-based MFE. (Note that third party XBlocks and drag-and-drop-v2 work well.)

Figma Link - Content Libraries (This area of figma will show many states / cases of this editor, you can also view in prototype mode using the play button in the top right of the screen. Note that this modal will move to a full screen stepper pattern to allow the editors to live in the course + library authoring MFEs.

TNL-7592

Educators can choose to fallback to OLX editing / authoring across any problem / component (or only some? details TBD)

To DO

Add support for directly editing the OLX of any component in the library (convenient for CAPA problems but useful for any type which has limited editing support or for authors who prefer using OLX; also currently the only way to use content "linked" from another blockstore library). Use a modern editor with syntax highlighting that can show XML errors in real time.

Figma Link Content Libraries - See “Switch to Markdown Editor” in top right of editor experience.

Educators can click on the edit button to edit blocks in-page.

Some blocks, like HTML, CAPA and Video, will get dedicated React-native editors. For all others that won’t, render the author view inline, just like Studio currently does. This will finally replace the ramshackle-ported edit page.

The next epic will focus on writing the video xblock editor for the content libraries MFEs. This ticket aims to address some questions around the implementation for these changes

To DO