Skip to content

Commit

Permalink
Add release notes for Sumac Header frontend plugin slots
Browse files Browse the repository at this point in the history
  • Loading branch information
sarina committed Dec 6, 2024
1 parent 5f8b0d2 commit 199fc39
Show file tree
Hide file tree
Showing 3 changed files with 58 additions and 6 deletions.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
64 changes: 58 additions & 6 deletions source/community/release_notes/sumac/customizing_header.rst
Original file line number Diff line number Diff line change
@@ -1,8 +1,60 @@
Customizing Site Header and Learner Dashboard
#############################################
Customizing Site Header Using Frontend "Slots"
##############################################

Coming soon in Sumac: leverage *frontend plugin slots* to quickly and easily
modify visual elements on the site header and on the Learner Dashboard. Be sure
to watch this page for more detail!
Utilizing *frontend plugin slots*, site operators now have the ability to
customize various portions of the site header.

The Open edX Sumac release comes out in December 2024.
A “frontend plugin slot” refers to an area of a web page - comprising one or
more visual elements - that can be “swapped out” with other visual elements. For
example, one new plugin slot allows you to remove the "Help" button in the header.

Overhead and hassle is minimized using the plugin slot system. Site operators
can leverage a plugin slot using a configuration file; the codebase does not
need to be copied (“forked”) nor are extensive changes needed. A snippet of code
is all that is needed to use a plugin slot. A site operator places that code
within a configuration file. Site operators should refer to the src/plugin-slots
directory within each MFE's codebase to view documentation for that MFE's plugin
slot(s).

In these release notes, we'll cover three example use cases for the header. Full
documentation is available `within the frontend-component-header codebase
<https://github.com/openedx/frontend-component-header/tree/master/src/plugin-slots>`_.

.. contents::
:local:
:depth: 1

Simple example: Removing help button
************************************

In the default learner dashboard, the default content contains a "Help" button
to the left of the logged in user's username:

.. image:: /_images/release_notes/sumac/sumac-header-easy-before.png

With frontend plugin slots, you can now hide the "Help" button:

.. image:: /_images/release_notes/sumac/sumac-header-easy-after.png

For site operators, here is a sample of the `env.config.jsx` file used to hide
the the content:

.. toggle::

.. code-block:: javascript
import { PLUGIN_OPERATIONS } from '@openedx/frontend-plugin-framework';
const config = {
pluginSlots: {
learning_help_slot: {
plugins: [
{
op: PLUGIN_OPERATIONS.Hide,
},
]
},
},
}
export default config;

0 comments on commit 199fc39

Please sign in to comment.