refactor: add useLocation hook to Navbar component
This commit is contained in:
@@ -5,12 +5,13 @@ import MobileMenu from "./MobileMenu";
|
|||||||
import NavbarLink from "./NavbarLink";
|
import NavbarLink from "./NavbarLink";
|
||||||
import router from "../../../../routes/routes";
|
import router from "../../../../routes/routes";
|
||||||
import Button from "../../../button";
|
import Button from "../../../button";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useLocation, useNavigate } from "react-router-dom";
|
||||||
import { Route } from "../../../../types/props";
|
import { Route } from "../../../../types/props";
|
||||||
import { IsAuthenticated } from "../../../../utils/auth";
|
import { IsAuthenticated } from "../../../../utils/auth";
|
||||||
|
|
||||||
const Navbar = ({ extra }: { extra?: string }) => {
|
const Navbar = ({ extra }: { extra?: string }) => {
|
||||||
const [isOpen, setIsOpen] = useState<boolean>(false);
|
const [isOpen, setIsOpen] = useState<boolean>(false);
|
||||||
|
const location = useLocation();
|
||||||
const auth = IsAuthenticated();
|
const auth = IsAuthenticated();
|
||||||
const [routes] = useState<Route[]>(router);
|
const [routes] = useState<Route[]>(router);
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
@@ -29,7 +30,9 @@ const Navbar = ({extra}:{extra?:string}) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="relative">
|
<div className="relative">
|
||||||
<nav className={`glass text-white p-4 flex justify-between items-center ${extra}`}>
|
<nav
|
||||||
|
className={`glass text-white p-4 flex justify-between items-center ${extra}`}
|
||||||
|
>
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<h1 className="text-xl font-bold">پرشین پینگ</h1>
|
<h1 className="text-xl font-bold">پرشین پینگ</h1>
|
||||||
</div>
|
</div>
|
||||||
@@ -43,7 +46,9 @@ const Navbar = ({extra}:{extra?:string}) => {
|
|||||||
);
|
);
|
||||||
})}
|
})}
|
||||||
</div>
|
</div>
|
||||||
{auth ? (
|
{location?.pathname === "/profile" ? (
|
||||||
|
<Button onClick={() => navigate("/")}>فروشگاه</Button>
|
||||||
|
) : auth ? (
|
||||||
<Button onClick={() => navigate("/profile")}>صفحه کاربری</Button>
|
<Button onClick={() => navigate("/profile")}>صفحه کاربری</Button>
|
||||||
) : (
|
) : (
|
||||||
<Button onClick={() => navigate("/login")}>ورود یا ثبت نام</Button>
|
<Button onClick={() => navigate("/login")}>ورود یا ثبت نام</Button>
|
||||||
|
|||||||
Reference in New Issue
Block a user