diff --git a/package-lock.json b/package-lock.json index b03141c..aa30c39 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "react-typescript-chess-federation", - "version": "0.1.0", + "version": "1.6.3", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "react-typescript-chess-federation", - "version": "0.1.0", + "version": "1.6.3", "dependencies": { "@googlemaps/react-wrapper": "^1.1.35", "@testing-library/jest-dom": "^5.16.4", diff --git a/src/components/global/Nav.tsx b/src/components/global/Nav.tsx index 404b3ff..055586d 100644 --- a/src/components/global/Nav.tsx +++ b/src/components/global/Nav.tsx @@ -1,6 +1,6 @@ // Modules -import { Link } from "react-router-dom"; -import { useLocation } from "react-router-dom"; +import { useRef, useEffect } from 'react'; +import { useLocation, Link } from "react-router-dom"; // Icons import mainLogo from "../../icons/main_logo.svg"; @@ -16,6 +16,19 @@ const Nav = ({ setBurgerOpen, }: navProps) => { const location = useLocation(); + const ref = useRef(null); + const refTrigger = useRef(null); + + useEffect(() => { + if(ref.current && refTrigger.current){ + window.addEventListener('click', (e:any) => { + if(!e.target.contains(ref.current) && !e.target.contains(refTrigger.current)){ + setDropdown(false); + } + }) + } + }, [setDropdown, ref]) + return (