Fix: useEffect 오류 수정

readyvery · Nov 30, 2023 · 611489a · 611489a
1 parent be6bf74
commit 611489a
Show file tree

Hide file tree

Showing 4 changed files with 7 additions and 48 deletions.
diff --git a/src/App.js b/src/App.js
@@ -3,20 +3,17 @@ import axios from "axios";
 import React, { Suspense } from "react";
 import { useCookies } from "react-cookie";
 import { Route, Routes, useNavigate } from "react-router-dom";
-import { RecoilRoot, useSetRecoilState } from "recoil";
+import { RecoilRoot } from "recoil";
 import InventoryPage from "../src/pages/Inventory/Inventory";
 import Mypage from "../src/pages/Mypage/Mypage";
 import SalesPage from "../src/pages/Sales/Sales";
 import "./App.css";
-import { isAuthenticatedState, loginState } from "./Atom/status";
 import Auth from "./hoc/auth.jsx";
 import useInterval from "./hooks/useInterval.jsx";
 import HomePage from "./pages/Home/Home";
 import MainPage from "./pages/Main/MainPage.jsx";
 
 function App() {
-  const setIsLoggedIn = useSetRecoilState(loginState);
-  const setIsAuthenticated = useSetRecoilState(isAuthenticatedState);
   const [cookies, , removeCookies] = useCookies();
   const navigate = useNavigate();
   const apiUrl = process.env.REACT_APP_API_ROOT;

diff --git a/src/components/views/Header/Header2.jsx b/src/components/views/Header/Header2.jsx
@@ -1,7 +1,7 @@
 import axios from "axios";
 import React, { useEffect, useState } from "react";
 import { useRecoilState } from "recoil";
-import soundState from "../../../Atom/status";
+import { soundState } from "../../../Atom/status";
 import StoreOff from "../../../assets/icons/Header/CloseLight.svg"; //영업종료
 import LOGO from "../../../assets/icons/Header/LOGO.svg"; //로고
 import StoreOn from "../../../assets/icons/Header/OpenLight.svg"; //영업중
@@ -24,6 +24,7 @@ const Header = () => {
         setStore(res.data.status);
       })
       .catch((err) => console.log(err))
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   const [Sound, setSound] = useRecoilState(soundState);

diff --git a/src/components/views/NavBar/NavBar.jsx b/src/components/views/NavBar/NavBar.jsx
@@ -1,8 +1,6 @@
 import "bootstrap/dist/css/bootstrap.min.css";
 import React from "react";
 import { Link } from "react-router-dom";
-import { useRecoilCallback, useRecoilState } from "recoil";
-import { storeState } from "../../../Atom/status";
 import Home from "../../../assets/icons/Navbar/Home.svg"; //홈
 import Inven from "../../../assets/icons/Navbar/Inven.svg"; //재고관리
 import Mypage from "../../../assets/icons/Navbar/Mypage.svg"; //마이페이지
@@ -12,23 +10,6 @@ import StoreBtn from "./StoreBtn";
 
 const NavBar = () => {
   const currentPath = window.location.pathname; // 현재 경로 가져오기
-  // const apiUrl = process.env.REACT_APP_API_ROOT;
-  const [Store] = useRecoilState(storeState); // 영업여부
-  const setStoreState = useRecoilCallback(({ set }) => async () => {
-    console.log(Store, storeState);
-    set(storeState, !Store);
-  });
-  const onClickHandler = (e) => {
-    setStoreState();
-    // axios
-    //   .post(`${apiUrl}+/api/v1/store/sales`)
-    //   .then((Store) => {
-    //     console.log(Store);
-    //   })
-    //   .catch((error) => {
-    //     console.error(error);
-    //   });
-  };
 
   return (
     <div className="navbar">
@@ -90,29 +71,6 @@ const NavBar = () => {
         </Link>
       </div>
 
-      {/* <Link style={{'textDecoration': 'none'}}>
-        {Store ? (
-          <div className="icon-group">
-            <img
-              className="icon"
-              onClick={onClickHandler}
-              src={StoreOn}
-              alt="Open"
-            />
-            <span className="menu-font">영업중</span>
-          </div>
-        ) : (
-          <div className="icon-off">
-            <img
-              className="icon"
-              onClick={onClickHandler}
-              src={StoreOn}
-              alt="Close"
-            />
-            <span className="menu-font">영업종료</span>
-          </div>
-        )}
-      </Link> */}
       <StoreBtn />
     </div>
   );

diff --git a/src/pages/Mypage/MainMypage.jsx b/src/pages/Mypage/MainMypage.jsx
@@ -48,7 +48,10 @@ const MainMypage = React.memo(() => {
       .catch((err) => console.log(err));
   };
 
-  const memoizedFetchData = useMemo(() => fetchData, []); // empty dependency array means the function doesn't depend on any external variable
+  const memoizedFetchData = useMemo(() => {
+    fetchData();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []); // empty dependency array means the function doesn't depend on any external variable
 
   useEffect(() => {
     memoizedFetchData().then((data) => {