From 2dede18fe300d14a3cef595031a214b6738910e0 Mon Sep 17 00:00:00 2001
From: Syed Sajjad  Hussain Shah <ssajjad@2u.com>
Date: Tue, 19 Mar 2024 15:10:35 +0500
Subject: [PATCH] fix: remove logo URL

---
 docs/using_custom_header.rst | 19 ++-----------------
 src/Header.jsx               | 19 ++++++-------------
 src/index.scss               |  9 +++++++++
 3 files changed, 17 insertions(+), 30 deletions(-)

diff --git a/docs/using_custom_header.rst b/docs/using_custom_header.rst
index 091a15f1f6..504b328e42 100644
--- a/docs/using_custom_header.rst
+++ b/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``
 *****************
 
diff --git a/src/Header.jsx b/src/Header.jsx
index 694f27b69f..9fd3b47e4a 100644
--- a/src/Header.jsx
+++ b/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,7 +130,6 @@ const Header = ({
 };
 
 Header.defaultProps = {
-  logo: null,
   mainMenuItems: null,
   secondaryMenuItems: null,
   userMenuItems: null,
@@ -139,11 +137,6 @@ Header.defaultProps = {
 
 Header.propTypes = {
   intl: intlShape.isRequired,
-  logo: PropTypes.shape({
-    src: PropTypes.string,
-    alt: PropTypes.string,
-    href: PropTypes.string,
-  }),
   mainMenuItems: PropTypes.oneOfType([
     PropTypes.node,
     PropTypes.array,
diff --git a/src/index.scss b/src/index.scss
index 1d31c9babd..94114bd44d 100644
--- a/src/index.scss
+++ b/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;