Learning Header's user menu slots can't fully hide/replace it.

[tecoholic]

Description

The learning MFE's user menu is made up of 2 slots

• org.openedx.frontend.layout.header_learning_user_menu_toggle.v1
• org.openedx.frontend.layout.header_learning_user_menu.v1
  :
  They wrap the toggle button the menu's contents, but not the dropdown itself. So the dropdown cannot be fully hidden even when both the slots are set to hide.

Example config snippet:

  'org.openedx.frontend.layout.header_learning_user_menu_toggle.v1': {
    plugins: [
      {
        widgetId: 'default_contents',
        op: PLUGIN_OPERATIONS.Hide,
      },
    ],
  },
  'org.openedx.frontend.layout.header_learning_user_menu.v1': {
    plugins: [
      {
        widgetId: 'default_contents',
        op: PLUGIN_OPERATIONS.Hide,
      }
    ]
  },

Artifact with the config applied

Note the dropdown and empty menu on the right corner

Potential Workaround and second bug

The Learning MFE provides a slot that covers the full Header - org.openedx.frontend.layout.header_learning.v1, that has the param showUserDropdown. This in theory should offer an workaround with a configuration like

const hideUser = (widget) => {
  console.log("Hide User:", widget)
  widget.content = {
    ...widget.content,
    showUserDropdown: false,
  };
  return widget;
}

const config = {
  pluginSlots: {
    'org.openedx.frontend.layout.header_learning.v1': {
      keepDefault: true,
      plugins: [
      {
        op: PLUGIN_OPERATIONS.Modify,
        widgetId: 'default_contents',
        fn: hideUser,
      }
    ]
    },
  }
};

And then any potential replacement could be added to the LearningHeaderActionSlot.

However, the LearningHeaderActionSlot is wrapped in the same block as the User dropdown, making the workaround infeasible.

[arbrandes]

Interesting. Is this also reproducible in frontend-base land? If it is, I'd like us to fix it there first.

[tecoholic]

@arbrandes I haven't tested it with the new frontend-base. I will investigate it this week.