diff --git a/client/src/components/Navbar.jsx b/client/src/components/Navbar.jsx index 97cf8ab..945df38 100644 --- a/client/src/components/Navbar.jsx +++ b/client/src/components/Navbar.jsx @@ -1,125 +1,264 @@ -import React, { useState } from 'react'; -import { Link } from 'react-router-dom'; -import { Avatar } from '@mantine/core'; -import { FaBars } from 'react-icons/fa'; -import { RxCross1 } from 'react-icons/rx'; -import { MdOutlineBusinessCenter, MdOutlineDashboard } from 'react-icons/md'; -import { Menu } from '@mantine/core'; -import { FaUserCircle, FaSave } from 'react-icons/fa'; -import { MdDoneAll } from 'react-icons/md'; -import { RiLogoutBoxFill } from 'react-icons/ri'; -import { toast } from 'react-toastify'; -import { useSelector, useDispatch } from 'react-redux'; -import { logOrNot } from '../actions/UserActions'; -import { useNavigate } from 'react-router-dom'; -import { logoutClearState } from '../slices/UserSlice'; -import { motion } from "framer-motion"; -import useIsMobile from '../hooks/useIsMobile'; +import { useState } from "react"; +import { Link, useLocation } from "react-router-dom"; +import { Avatar } from "@mantine/core"; +import { FaBars } from "react-icons/fa"; +import { RxCross1 } from "react-icons/rx"; +import { MdOutlineBusinessCenter, MdOutlineDashboard } from "react-icons/md"; +import { Menu } from "@mantine/core"; +import { FaUserCircle, FaSave } from "react-icons/fa"; +import { MdDoneAll } from "react-icons/md"; +import { RiLogoutBoxFill } from "react-icons/ri"; +import { toast } from "react-toastify"; +import { useSelector, useDispatch } from "react-redux"; +import { logOrNot } from "../actions/UserActions"; +import { useNavigate } from "react-router-dom"; +import { logoutClearState } from "../slices/UserSlice"; +import useIsMobile from "../hooks/useIsMobile"; export const Navbar = () => { - const { isLogin, me } = useSelector(state => state.user); - const [toggle, setToggle] = useState(false); - const dispatch = useDispatch(); - const navigate = useNavigate(); + const { isLogin, me } = useSelector((state) => state.user); + const [toggle, setToggle] = useState(false); + const dispatch = useDispatch(); + const navigate = useNavigate(); + const location = useLocation(); - - const isMobile = useIsMobile() - - const LogOut = () => { - localStorage.removeItem('userToken'); - localStorage.removeItem('role'); - dispatch(logOrNot()); - navigate('/'); - toast.success("Logout Successful !"); - dispatch(logoutClearState()); + const goHomeTop = () => { + if (location.pathname === "/") { + window.scrollTo({ top: 0, behavior: "smooth" }); + } else { + navigate("/"); } + }; - return ( - <> -
- {!isMobile && } + {isLogin ? ( + + + + -
- - JOBLANE + + + }> + My Profile + + + {me.role === "admin" && ( + + }> + Dashboard + -
-
- {isLogin ? ( - - - - - - - }>My Profile - {me.role === "admin" && }>Dashboard} - }>Applied Jobs - }>Saved Jobs - - }>Logout - - - ) : ( - - Login - Register - - )} -
+ )} + + }> + Applied Jobs + + + + }> + Saved Jobs + + + + } + > + Logout + + +
+ ) : ( + + + Login + + + Register + + + )} + + )} -
- {toggle ? ( - setToggle(!toggle)} /> - ) : ( - setToggle(!toggle)} /> - )} -
-
- +
+ + JOBLANE + +
+
+ {isLogin ? ( + + + + -
+ + + }> + My Profile + + + {me.role === "admin" && ( + + }> + Dashboard + + + )} + + }> + Applied Jobs + + + + }> + Saved Jobs + + + + } + > + Logout + + + + ) : ( + + + Login + + + Register + + + )} +
-
-
    - setToggle(!toggle)} to="/" className='cool-link'>Home - setToggle(!toggle)} to="/jobs" className='cool-link'>Jobs - setToggle(!toggle)} to='/contact' className='cool-link'>Contact - setToggle(!toggle)} to='/about' className='cool-link'>About -
-
+
+ {toggle ? ( + setToggle(!toggle)} + /> + ) : ( + setToggle(!toggle)} + /> + )}
- - ); -} +
+
+ +
+ +
+ +
+ + + ); +}; diff --git a/client/src/main.jsx b/client/src/main.jsx index b5bb940..3471ee3 100644 --- a/client/src/main.jsx +++ b/client/src/main.jsx @@ -1,16 +1,16 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App.jsx' -import './index.css' -import { store } from './store.js' -import { Provider } from 'react-redux' -import { BrowserRouter as Router } from 'react-router-dom' +import ReactDOM from "react-dom/client"; +import App from "./App.jsx"; +import "./index.css"; +import { store } from "./store.js"; +import { Provider } from "react-redux"; +import { BrowserRouter as Router } from "react-router-dom"; +import ScrollToTopWhenRouteChanges from "./components/ScrollToTopOnRouteChange.jsx"; - -ReactDOM.createRoot(document.getElementById('root')).render( +ReactDOM.createRoot(document.getElementById("root")).render( + -) +); diff --git a/client/src/pages/Contact.jsx b/client/src/pages/Contact.jsx index 117b2fb..01eb2a4 100644 --- a/client/src/pages/Contact.jsx +++ b/client/src/pages/Contact.jsx @@ -1,4 +1,3 @@ -import React, { useState } from "react"; import { MetaData } from "../components/MetaData"; import { BsFacebook } from "react-icons/bs"; import { @@ -6,15 +5,33 @@ import { AiOutlineTwitter, AiTwotoneMail, } from "react-icons/ai"; -import { BiMinus, BiPlus } from "react-icons/bi"; -import Card from "../components/Card"; // New Card component -import Accordion from "../components/Accordion";// New Accordion component +import { Link } from "react-router-dom"; +import Card from "../components/Card"; // New Card component +import Accordion from "../components/Accordion"; // New Accordion component export const Contact = () => { - const [que1, setQue1] = useState(false); - const [que2, setQue2] = useState(false); - const [que3, setQue3] = useState(false); - + const socialMediaLinks = [ + { + name: "Facebook", + link: "https://www.facebook.com/", + icon: , + }, + { + name: "Instagram", + link: "https://www.instagram.com/", + icon: , + }, + { + name: "Twitter", + link: "https://twitter.com/", + icon: , + }, + { + name: "Email", + link: "mailto:info@joblane.com", + icon: , + }, + ]; return ( <> @@ -26,16 +43,16 @@ export const Contact = () => {

- We're excited to hear from you! If you have any questions, + We're excited to hear from you! If you have any questions, inquiries, or feedback, feel free to reach out to us using the contact information provided below. Your satisfaction and - engagement with our platform are our top priorities, and we're - here to assist you in any way we can. + engagement with our platform are our top priorities, and + we're here to assist you in any way we can.

-

Contact Information

+

Contact Information

{ ]} /> -

Social Media:

-
    -
    - - - - -
    -
-
- +

Social Media:

+
    +
    + {socialMediaLinks.map((item, index) => ( + + {item.icon} + + ))} +
    +
+

diff --git a/client/src/pages/Home.jsx b/client/src/pages/Home.jsx index 4e524fc..569d117 100644 --- a/client/src/pages/Home.jsx +++ b/client/src/pages/Home.jsx @@ -1,250 +1,258 @@ -import React, { useEffect, useState } from 'react' -import { Link } from 'react-router-dom' -import { MetaData } from '../components/MetaData' -import { useSelector, useDispatch } from 'react-redux'; -import { JobCard } from '../components/JobCard'; -import { getAllJobs } from '../actions/JobActions'; -import Testimonials from '../components/Testimonials/Testimonials.jsx'; - +import { useEffect } from "react"; +import { Link } from "react-router-dom"; +import { MetaData } from "../components/MetaData"; +import { useSelector, useDispatch } from "react-redux"; +import { getAllJobs } from "../actions/JobActions"; +import Testimonials from "../components/Testimonials/Testimonials.jsx"; export const Home = () => { - - const [num, setNum] = useState(2); - const dispatch = useDispatch() - const { loading, allJobs } = useSelector(state => state.job) - const [jobs, setJobs] = useState([]) - - - const data = [ - { - link: "/images/JobData/1.jpg" - }, - { - link: "/images/JobData/2.jpg" - }, - { - link: "/images/JobData/3.jpg" - }, - { - link: "/images/JobData/4.jpg" - }, - { - link: "/images/JobData/5.jpg" - }, - { - link: "/images/JobData/6.jpg" - }, - { - link: "/images/JobData/7.jpg" - }, - { - link: "/images/JobData/8.jpg" - }, - { - link: "/images/JobData/9.jpg" - }, - { - link: "/images/JobData/10.jpg" - }, - { - link: "/images/JobData/11.jpg" - }, - { - link: "/images/JobData/12.jpg" - }, - { - link: "/images/JobData/13.jpg" - }, - { - link: "/images/JobData/14.jpg" - }, - { - link: "/images/JobData/15.jpg" - }, - { - link: "/images/JobData/16.jpg" - }, - { - link: "/images/JobData/17.jpg" - }, - { - link: "/images/JobData/18.jpg" - }, - { - link: "/images/JobData/19.jpg" - }, - { - link: "/images/JobData/20.jpg" - } - ] - - - useEffect(() => { - dispatch(getAllJobs()) - - }, []) - - - - const convertDateFormat = (inputDate) => { - const parts = inputDate.split('-'); - if (parts.length !== 3) { - return "Invalid date format"; - } - - const day = parts[2]; - const month = parts[1]; - const year = parts[0]; - - return `${day}-${month}-${year}`; + const dispatch = useDispatch(); + const { loading, allJobs } = useSelector((state) => state.job); + + const data = [ + { + link: "/images/JobData/1.jpg", + }, + { + link: "/images/JobData/2.jpg", + }, + { + link: "/images/JobData/3.jpg", + }, + { + link: "/images/JobData/4.jpg", + }, + { + link: "/images/JobData/5.jpg", + }, + { + link: "/images/JobData/6.jpg", + }, + { + link: "/images/JobData/7.jpg", + }, + { + link: "/images/JobData/8.jpg", + }, + { + link: "/images/JobData/9.jpg", + }, + { + link: "/images/JobData/10.jpg", + }, + { + link: "/images/JobData/11.jpg", + }, + { + link: "/images/JobData/12.jpg", + }, + { + link: "/images/JobData/13.jpg", + }, + { + link: "/images/JobData/14.jpg", + }, + { + link: "/images/JobData/15.jpg", + }, + { + link: "/images/JobData/16.jpg", + }, + { + link: "/images/JobData/17.jpg", + }, + { + link: "/images/JobData/18.jpg", + }, + { + link: "/images/JobData/19.jpg", + }, + { + link: "/images/JobData/20.jpg", + }, + ]; + + useEffect(() => { + dispatch(getAllJobs()); + }); + + const convertDateFormat = (inputDate) => { + const parts = inputDate.split("-"); + if (parts.length !== 3) { + return "Invalid date format"; } - return ( - - - <> - -

-
- -
-
JOBLANE
-
- Browse Jobs -
-
-
-

Your gateway to job opportunities.

- -
- - -
-
-

Featured Jobs

-
-
- { - loading ? -
- - - -
: -
-
- - {allJobs && allJobs.length >= 4 ? ( - <> - -
-
- {allJobs[3].title} -
-
-

{allJobs[3].title}

-

{allJobs[3].companyName}

-

{allJobs[3].description.slice(0, 30) + "..."}

-
-
-
- {convertDateFormat(allJobs[3].createdAt.slice(0,10))} - - {allJobs[3].employmentType} - - - {allJobs[3].location} - -
- - - -
-
- {allJobs[5].title} -
-
-

{allJobs[5].title}

-

{allJobs[5].companyName}

-

{allJobs[5].description.slice(0, 30) + "..."}

-
-
-
- {convertDateFormat(allJobs[3].createdAt.slice(0,10))} - - {allJobs[5].employmentType} - - - {allJobs[5].location} - -
- - - -
-
- {allJobs[2].title} -
-
-

{allJobs[2].title}

-

{allJobs[2].companyName}

-

{allJobs[2].description.slice(0, 30) + "..."}

-
-
-
- {convertDateFormat(allJobs[2].createdAt.slice(0,10))} - - {allJobs[2].employmentType} - - - {allJobs[2].location} - -
- - - - - ) : null} - - -
- -
- } -
- -
- - -
-
- Companies on our site -
-
- { - data.map((e, i) => ( -
- -
- )) - } -
-
- - - - -
-

Discover the Power of Possibility with JobLane: Where Your Professional Journey Takes Flight, Guided by a Network of Diverse Opportunities!

-
- - + const day = parts[2]; + const month = parts[1]; + const year = parts[0]; + + return `${day}-${month}-${year}`; + }; + + return ( + <> + +
+
+
+
JOBLANE
+
+ + Browse Jobs + +
+
+
+

+ Your gateway to job + opportunities. +

+
+ +
+
+

Featured Jobs

+
+
+ {loading ? ( +
+
- + ) : ( +
+
+ {allJobs && allJobs.length >= 4 ? ( + <> + +
+
+ {allJobs[3].title} +
+
+

{allJobs[3].title}

+

+ {allJobs[3].companyName} +

+

+ {allJobs[3].description.slice(0, 30) + "..."} +

+
+
+
+ + {convertDateFormat( + allJobs[3].createdAt.slice(0, 10) + )} + + {allJobs[3].employmentType} + {allJobs[3].location} +
+ + +
+
+ {allJobs[5].title} +
+
+

{allJobs[5].title}

+

+ {allJobs[5].companyName} +

+

+ {allJobs[5].description.slice(0, 30) + "..."} +

+
+
+
+ + {convertDateFormat( + allJobs[3].createdAt.slice(0, 10) + )} + + {allJobs[5].employmentType} + {allJobs[5].location} +
+ + +
+
+ {allJobs[2].title} +
+
+

{allJobs[2].title}

+

+ {allJobs[2].companyName} +

+

+ {allJobs[2].description.slice(0, 30) + "..."} +

+
+
+
+ + {convertDateFormat( + allJobs[2].createdAt.slice(0, 10) + )} + + {allJobs[2].employmentType} + {allJobs[2].location} +
+ + + ) : null} +
+
+ )}
- - - - ) -} +
+ +
+
Companies on our site
+
+ {data.map((e, i) => ( +
+ +
+ ))} +
+
+ + + +
+

+ Discover the Power of Possibility with JobLane: Where Your + Professional Journey Takes Flight, Guided by a Network of Diverse + Opportunities! +

+
+
+
+ + ); +}; diff --git a/server/config/config.sample.env b/server/config/config.sample.env deleted file mode 100644 index 2d50b7e..0000000 --- a/server/config/config.sample.env +++ /dev/null @@ -1,10 +0,0 @@ -# Change port if already in use -PORT = 3000 - -# Your MongoDB url here -DB = - -# Enter your cloudinary details here -CLOUDINARY_NAME = -CLOUDINARY_API_KEY = -CLOUDINARY_API_SECRET = \ No newline at end of file