From 6c9e12bdfd9741ed52ece82dbd23cba56d50d76a Mon Sep 17 00:00:00 2001
From: Kacper Szarkiewicz <43585069+Sharqiewicz@users.noreply.github.com>
Date: Tue, 4 Jun 2024 13:58:46 +0200
Subject: [PATCH] reorder links in the Nav, fix margin of Collapse Nav Item

---
 src/components/Layout/Nav.tsx   |  4 ++--
 src/components/Layout/links.tsx | 37 +++++++++++++++++----------------
 2 files changed, 21 insertions(+), 20 deletions(-)

diff --git a/src/components/Layout/Nav.tsx b/src/components/Layout/Nav.tsx
index 91148d8b..d5049a0a 100644
--- a/src/components/Layout/Nav.tsx
+++ b/src/components/Layout/Nav.tsx
@@ -28,7 +28,7 @@ const CollapseMenu = ({
   const [isOpen, { toggle }] = useBoolean(isActive);
 
   return (
-    <section className={`collapse  ${disabled ? 'disabled' : 'collapse-arrow'} ${isOpen ? 'collapse-open' : ''}`}>
+    <section className={`collapse ${disabled ? 'disabled' : 'collapse-arrow'} ${isOpen ? 'collapse-open' : ''}`}>
       <button
         type="button"
         className={`nav-item collapse-btn collapse-title ${isActive ? 'active' : ''}`}
@@ -93,7 +93,7 @@ const Nav = memo(({ onClick }: NavProps) => {
       {links(state).map((item, i) => {
         if (item.hidden) return;
         return item.submenu ? (
-          <div onMouseEnter={handleMouseEnter}>
+          <div onMouseEnter={handleMouseEnter} className="my-2.5">
             <CollapseMenu
               key={i}
               link={item.link}
diff --git a/src/components/Layout/links.tsx b/src/components/Layout/links.tsx
index e7fc3a11..45cf0180 100644
--- a/src/components/Layout/links.tsx
+++ b/src/components/Layout/links.tsx
@@ -91,24 +91,6 @@ export const links: Links = ({ tenantName }) => [
       },
     ],
   },
-  {
-    link: './staking',
-    title: 'Staking',
-    props: {
-      className: ({ isActive } = {}) => (isActive ? 'active' : ''),
-    },
-    prefix: <StakingIcon />,
-  },
-  {
-    link: `https://${tenantName}.polkassembly.io/`,
-    title: 'Governance',
-    props: {
-      target: '_blank',
-      rel: 'nofollow noreferrer',
-    },
-    prefix: <GovernanceIcon />,
-    suffix: <ExternalIcon />,
-  },
   {
     link: '/nabla',
     title: 'Forex AMM',
@@ -134,6 +116,25 @@ export const links: Links = ({ tenantName }) => [
       },
     ],
   },
+  {
+    link: './staking',
+    title: 'Staking',
+    props: {
+      className: ({ isActive } = {}) => (isActive ? 'active' : ''),
+    },
+    prefix: <StakingIcon />,
+  },
+  {
+    link: `https://${tenantName}.polkassembly.io/`,
+    title: 'Governance',
+    props: {
+      target: '_blank',
+      rel: 'nofollow noreferrer',
+    },
+    prefix: <GovernanceIcon />,
+    suffix: <ExternalIcon />,
+  },
+
   {
     link: config.alchemyPay.encodeUrlWithRedirection(config.alchemyPay.prodUrl, window.location.href),
     title: 'Buy PEN',