working on clerk notification

src/pages/CafePage.js

@@ -37,7 +37,7 @@ function CafePage({
   const [loading, setLoading] = useState(true);
   const [screenMessage, setScreenMessage] = useState("");
 
-  const [isSpotifyNeedLogin, setNeedSpotifyLogin] = useState(false);
+  const [isSpotifyNeedLogin, setNeedSpotifyLogin] = useState(true);
   const [isModalOpen, setIsModalOpen] = useState(false);
 
   useEffect(() => {
@@ -67,6 +67,17 @@ function CafePage({
     setLoading(false);
   }, [shopItems]);
 
+  useEffect(() => {
+    async function fetchData() {
+      socket.on("joined-room", (response) => {
+        const { isSpotifyNeedLogin } = response;
+        setNeedSpotifyLogin(isSpotifyNeedLogin);
+      });
+    }
+
+    if (socket) fetchData();
+  }, [socket]);
+
   if (loading)
     return (
       <div className="Loader">