fix: remove logo URL

docs/using_custom_header.rst

@@ -6,9 +6,9 @@ Custom Header Component
 Overview
 --------
 
-The ``Header`` component is used to display a header with a provided ``logo``, ``mainMenuItems``,
+The ``Header`` component is used to display a header with a provided ``mainMenuItems``,
 ``secondaryMenuItems``, and ``userMenuItems`` props. If props are provided, the component will use them; otherwise,
-If any of the props ``(logo, mainMenuItems, secondaryMenuItems, userMenuItems)`` are not provided, default
+If any of the props ``(mainMenuItems, secondaryMenuItems, userMenuItems)`` are not provided, default
 items are displayed. This component provides flexibility in customization, making it suitable for a wide
 range of applications.
 
@@ -17,21 +17,6 @@ Props Details
 
 The `Header` component accepts the following **optional** props for customization:
 
-``logo``
-*******
-
-The logo prop is an object containing `src`, `alt`, and `href` properties. If not passed, LOGO_URL from config will be used.
-It is displayed on the left of the header in the desktop screen and in the center of the header on the mobile screen.
-
-Example:
-::
-
-   {
-       src: 'path/to/logo.png',
-       alt: 'Logo Alt Text',
-       href: '/home'
-   }
-
 ``mainMenuItems``
 *****************
 

src/Header.jsx

@@ -33,19 +33,18 @@ subscribe(APP_CONFIG_INITIALIZED, () => {
 
 /**
  * Header component for the application.
- * Displays a header with the provided logo, main menu, secondary menu, and user menu when the user is authenticated.
- * If any of the props (logo, mainMenuItems, secondaryMenuItems, userMenuItems) are not provided, default
+ * Displays a header with the provided main menu, secondary menu, and user menu when the user is authenticated.
+ * If any of the props (mainMenuItems, secondaryMenuItems, userMenuItems) are not provided, default
  * items are displayed.
  * For more details on how to use this component, please refer to this document:
  * https://github.com/openedx/frontend-component-header/blob/master/docs/using_custom_header.rst
  *
- * @param logo
  * @param mainMenuItems
  * @param secondaryMenuItems
  * @param userMenuItems
  */
 const Header = ({
-  intl, logo, mainMenuItems, secondaryMenuItems, userMenuItems,
+  intl, mainMenuItems, secondaryMenuItems, userMenuItems,
 }) => {
   const { authenticatedUser, config } = useContext(AppContext);
 
@@ -106,9 +105,9 @@ const Header = ({
   ];
 
   const props = {
-    logo: logo?.src || config.LOGO_URL,
-    logoAltText: logo?.alt || config.SITE_NAME,
-    logoDestination: logo?.href || `${config.LMS_BASE_URL}/dashboard`,
+    logo: config.LOGO_URL,
+    logoAltText: config.SITE_NAME,
+    logoDestination: `${config.LMS_BASE_URL}/dashboard`,
     loggedIn: authenticatedUser !== null,
     username: authenticatedUser !== null ? authenticatedUser.username : null,
     avatar: authenticatedUser !== null ? authenticatedUser.avatar : null,
@@ -131,19 +130,13 @@ const Header = ({
 };
 
 Header.defaultProps = {
-  logo: null,
   mainMenuItems: null,
   secondaryMenuItems: null,
   userMenuItems: null,
 };
 
 Header.propTypes = {
   intl: intlShape.isRequired,
-  logo: PropTypes.shape({
-    src: PropTypes.string,
-    alt: PropTypes.string,
-    href: PropTypes.string,
-  }),
   mainMenuItems: PropTypes.oneOfType([
     PropTypes.node,
     PropTypes.array,

src/index.scss

@@ -88,6 +88,15 @@ $white: #fff;
       height: 100%;
     }
   }
+  .secondary-menu-container {
+    .nav-link:hover,
+    .nav-link:focus,
+    .nav-link.active,
+    .expanded .nav-link {
+      background: $component-active-bg;
+      color: $component-active-color;
+    }
+  }
   .main-nav {
     .nav-link {
       padding: 1.125rem 1rem;