Merge pull request #4428 from Shivam-AfA/navigation-fix

[Navigation pane] Fixed arrangement in drop-down menu
layer5io · Jun 26, 2023 · 28be1be · 28be1be
2 parents 98a6d47 + ebc7d2a
commit 28be1be
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 8 deletions.
diff --git a/src/sections/General/Navigation/index.js b/src/sections/General/Navigation/index.js
@@ -237,14 +237,12 @@ const Navigation = () => {
                       <Link to={menu.path} onClick={changeDropdownState} className="menu-item" activeClassName="nav-link-active">{menu.name}</Link>
                       <ul>
                         {menu.subItems !== undefined && menu.subItems.map((subItems, index) => {
-                          const externalLinks = ["Forum", "Catalog", "Playground"];
-
                           return (
                             <li
                               key={index}
                               className="mobile-nav-subitem"
                             >
-                              {externalLinks.includes(subItems.name) ?
+                              {subItems.externalLink ?
                                 <a href={subItems.path} target="_blank" onClick={ () => {
                                   changeDropdownState();
                                   closeDropDown();

diff --git a/src/sections/General/Navigation/utility/ScrollspyMenu.js b/src/sections/General/Navigation/utility/ScrollspyMenu.js
@@ -71,12 +71,10 @@ const ScrollspyMenu = ({ menuItems, ...props }) => {
                 <Link className="section" to={activeState.path} activeClassName="nav-link-active">{activeState.name}
                 </Link>
                 {activeState.subItems.map((subItem, i) => {
-                  const externalLinks = ["Forum", "Catalog", "Playground"];
-
                   return (
                     <li key={i}>
-                      {externalLinks.includes(subItem.name) ?
-                        <a href={subItem.path} target="_blank" className="sub-item" rel="noreferrer">
+                      {subItem.externalLink ?
+                        <a href={subItem.path} target="_blank" className={subItem.sepLine && "sub-item"} rel="noreferrer">
                           {subItem.name}
                         </a>
                         : <Link to={subItem.path} partiallyActive={false} className={subItem.sepLine && "sub-item"} activeClassName="nav-link-active">

diff --git a/src/sections/General/Navigation/utility/menu-items.js b/src/sections/General/Navigation/utility/menu-items.js
@@ -87,10 +87,12 @@ const Data = {
         {
           name: "Meshery",
           path: "/cloud-native-management/meshery",
+          sepLine: true
         },
         {
           name: "Catalog",
           path: "/catalog",
+          externalLink: true
         },
         {
           name: "Docker Extension",
@@ -103,6 +105,7 @@ const Data = {
         {
           name: "Playground",
           path: "/cloud-native-management/playground",
+          externalLink: true
         },
         {
           name: "Nighthawk",
@@ -162,7 +165,8 @@ const Data = {
         {
           name: "Forum",
           path: "https://discuss.layer5.io",
-          sepLine: true
+          sepLine: true,
+          externalLink: true
         },
         {
           name: "Workshops",