added home nav

app/components/HomeOne.js

@@ -1,12 +1,10 @@
 import React from 'react';
-import useToggle from '../Hooks/useToggle';
 // import BackToTop from '../BackToTop';
-import Drawer from '../Mobile/Drawer';
+import HomeNav from './navigation/HomeNav'
 import BlogHomeOne from './BlogHomeOne';
 // import FeaturesHomeOne from './FeaturesHomeOne';
 import FooterHomeOne from './FooterHomeOne';
 import HeroHomeOne from './HeroHomeOne';
-// import HomeOneHeader from './HomeOneHeader';
 import ServicesHomeOne from './ServicesHomeOne';
 import TrafficHomeOne from './TrafficHomeOne';
 import TrafficHomeTwo from './TrafficHomeTwo';
@@ -19,12 +17,9 @@ import NextAfterHero from './NextAfterHero';
 
 
 function HomeOne() {
-    // needed  const [drawer, drawerAction] = useToggle(false);
-
     return (
         <>
-          {/* <Drawer drawer={drawer} action={drawerAction.toggle} /> */}
-           <div className='text-center'>THIS IS HOME </div>
+           <HomeNav />
            <HeroHomeOne />
            <AfterHero />
            <NextAfterHero />

app/components/HomeOneHeader.js

@@ -1,12 +1,11 @@
+"use client"
 import React, { useEffect } from 'react';
-import logo from '../../assets/images/wrenchboard-logo-text.png';
-import StickyMenu from '../../lib/StickyMenu';
-import Navigation from '../Navigation';
-import getConfig from './../../Config/config'
-import { Link } from 'react-router-dom';
+import logo from '../assets/images/wrenchboard-logo-text.png';
+import StickyMenu from '../lib/StickyMenu';
+import Navigation from './navigation/Navigation';
+import Image from 'next/image';
 
 function HomeOneHeader({ action, showLogoOnly = false }) {
-  var site = getConfig()[0];
   useEffect(() => {
     StickyMenu();
   }, []);
@@ -17,9 +16,9 @@ function HomeOneHeader({ action, showLogoOnly = false }) {
           <div className="row align-items-center">
             <div className="col-lg-2 col-md-4 col-sm-5 col-6 order-1 order-sm-1">
               <div className="appie-logo-box">
-                <Link to="/">
-                  <img src={logo} alt="WrenchBoard" loading='eager' width="175px" height="38px" />
-                </Link>
+                <a href="/">
+                  <Image src={logo} alt="WrenchBoard" loading='eager' width="175" height="38" />
+                </a>
               </div>
             </div>
 

app/components/navigation/HomeNav.js

@@ -0,0 +1,15 @@
+"use client"
+import React from 'react'
+import useToggle from '../../Hooks/useToggle'
+import HomeOneHeader from '../HomeOneHeader'
+import Drawer from '../../Mobile/Drawer'
+
+export default function HomeNav() {
+    const [drawer, drawerAction] = useToggle(false);
+  return (
+    <>
+        <Drawer drawer={drawer} action={drawerAction.toggle} />
+        <HomeOneHeader action={drawerAction.toggle} />
+    </>
+  )
+}

app/components/navigation/Navigation.js

@@ -0,0 +1,34 @@
+import React from 'react';
+
+function Navigation() {
+    return (
+        <>
+            <ul>
+                <li>
+                    <a href="/">Home</a>
+                </li>
+                <li>
+                    <a href="/about-us">About</a>
+                </li>
+                {/* <li>
+                    <a href="#">
+                        Resources <i className="fal fa-angle-down" />
+                    </a>
+                    <ul className="sub-menu">
+                        <li>
+                            <Link to="/about-us">About</Link>
+                        </li>
+                        <li>
+                            <Link to="/blog">Blog</Link>
+                        </li>
+                        <li>
+                            <Link to="/faq">FAQs</Link>
+                        </li>
+                    </ul>
+                </li> */}
+            </ul>
+        </>
+    );
+}
+
+export default Navigation;