outside click bug removed

src/App.tsx

@@ -1,4 +1,5 @@
 // Modules
+import { useRef } from "react";
 import { Routes, Route } from "react-router-dom";
 import { useState } from "react";
 
@@ -26,6 +27,7 @@ import PlayerProfile from "./pages/PlayerProfile";
 const App = () => {
   // Types
   type drop = [boolean, React.Dispatch<React.SetStateAction<boolean>>];
+  const refTrig_1 = useRef<any>(null);
 
   // State
   const [dropdownBurger, setDropdownBurger] = useState(false);
@@ -39,6 +41,7 @@ const App = () => {
         setDropdown={setDropdown}
         burgerOpen={burgerOpen}
         setBurgerOpen={setBurgerOpen}
+        refTrig_1={refTrig_1}
       />
       <Burger
         burgerOpen={burgerOpen}
@@ -67,6 +70,7 @@ const App = () => {
         setDropdown={setDropdown}
         dropdownBurger={dropdownBurger}
         setDropdownBurger={setDropdownBurger}
+        refTrig_1={refTrig_1}
       />
     </div>
   );

src/components/global/Footer.tsx

@@ -16,6 +16,7 @@ const Footer = ({
   setDropdown,
   setDropdownBurger,
   setBurgerOpen,
+  refTrig_1,
 }: footerProps) => {
   const date = new Date();
   const breakpoint: Record<number, boolean> = {
@@ -29,6 +30,7 @@ const Footer = ({
           <div className="footer-top-inner">
             <ul>
               <li
+                ref={refTrig_1}
                 onClick={() => {
                   if (breakpoint["1300"]) {
                     window.scrollTo(0, 0);
@@ -43,16 +45,16 @@ const Footer = ({
                 <span>О нас</span>
               </li>
               <li>
-                <Link to={"/news"}>События</Link>
+                <Link to={"/news"}>Новости и cобытия</Link>
               </li>
               <li>
-                <Link to={"/news"}>Новости</Link>
+                <Link to={"/tournaments"}>Турниры</Link>
               </li>
               <li>
                 <Link to={"/rating"}>Рейтинг</Link>
               </li>
               <li>
-                <Link to={"/"}>Партнеры</Link>
+                <Link to={"/contact"}>Контакты</Link>
               </li>
             </ul>
           </div>

src/components/global/Nav.tsx

@@ -14,17 +14,19 @@ const Nav = ({
   setDropdown,
   burgerOpen,
   setBurgerOpen,
+  refTrig_1,
 }: navProps) => {
   const location = useLocation();
   const ref = useRef<any>(null);
   const refTrigger = useRef<any>(null);
 
   useEffect(() => {
-    if (ref.current && refTrigger.current) {
+    if (ref.current && refTrigger.current && refTrig_1.current) {
       window.addEventListener("click", (e: any) => {
         if (
           !e.target.contains(ref.current) &&
-          !e.target.contains(refTrigger.current)
+          !e.target.contains(refTrigger.current) &&
+          !e.target.contains(refTrig_1.current)
         ) {
           setDropdown(false);
         }

src/styles/_footer.scss

@@ -26,6 +26,13 @@
 
 .footer-top-inner {
   padding: 4rem 0;
+
+  li {
+    cursor: pointer;
+    * {
+      pointer-events: none;
+    }
+  }
 }
 
 .footer-bottom-inner {

src/types/burger.ts

@@ -10,7 +10,10 @@ export interface dropdownBurger {
   dropdownBurger: boolean;
   setDropdownBurger: React.Dispatch<boolean | ((initial: boolean) => boolean)>;
 }
+export interface refDropdown {
+  refTrig_1: React.MutableRefObject<any>;
+}
 
-export type navProps = burger & dropdown;
+export type navProps = burger & dropdown & refDropdown;
 export type burgerProps = burger & dropdownBurger;
-export type footerProps = dropdownBurger & dropdown & burger;
+export type footerProps = dropdownBurger & dropdown & burger & refDropdown;