refactor: replace navbar component

components/Common/Button/index.jsx

@@ -1,5 +1,7 @@
 import PropTypes from 'prop-types';
 import Link from 'next/link';
+import { useRouter } from 'next/router';
+import { useCallback } from 'react';
 
 // Background Colors
 const ButtonColorsConfig = {
@@ -17,18 +19,36 @@ const Button = ({
   href,
   onClick,
   className,
+  delayLinkMs,
 }) => {
+  const router = useRouter();
+
   let classes =
     'flex justify-center items-center text-white font-poppins font-normal text-center rounded py-2 px-3 laptop:px-8 laptop:font-medium transition-all duration-300';
   classes += `${isAlignFull ? ' w-full' : ''}`;
   classes += ` ${ButtonColorsConfig[backgroundColor]}`;
   classes += ` ${ButtonColorsConfig[hoverBackgroundColor]}`;
   classes += ` ${className}`;
 
+  const handleClick = useCallback(
+    (e) => {
+      onClick && onClick(e);
+
+      if (delayLinkMs) {
+        e.preventDefault();
+        setTimeout(() => {
+          console.log('href', href);
+          router.push(href);
+        }, delayLinkMs);
+      }
+    },
+    [delayLinkMs, href, onClick, router],
+  );
+
   if (isLink) {
     return (
       <Link href={href}>
-        <a onClick={onClick} className={classes}>
+        <a onClick={handleClick} className={classes}>
           {text}
         </a>
       </Link>

components/Common/CtaBanner/index.jsx

@@ -51,6 +51,7 @@ const CtaBanner = ({ bgVersion, title, subTitle, buttonText, buttonUrl }) => {
           onClick={handleStartNowClick}
           href={buttonUrl || defaultButtonUrl}
           className="text-[15px] h-[40px] min-w-[100px] whitespace-nowrap !px-4 !text-white !no-underline !inline"
+          delayLinkMs={300}
         />
       </div>
     </div>

components/Header/MainBar/index.jsx

@@ -1,11 +1,9 @@
-import Logo from '../Logo';
 import Menu from '../Menu';
 
 const MainBar = () => {
   return (
     <div className="relative z-10 w-full bg-purple-dark border border-light-blue border-solid border-r-0 border-l-0 border-t-0 fixed laptop:static top-0 w-full">
       <div className="w-full max-w-container m-container p-container laptop:max-w-container-desktop laptop:m-container-desktop laptop:p-container-desktop relative z-10 flex justify-between items-center relative py-6 laptop:py-0 !max-w-[1904px]">
-        <Logo />
         <Menu />
       </div>
     </div>