feat: enhance estimated wait time display and handle token expiration in event page

app/api/socketio/route.js

@@ -45,7 +45,7 @@ function broadcastUpdate(eventId, io) {
     io.to(sid).emit("queue_update", {
       activeCount: ev.sockets.size,
       position: pos === -1 ? null : pos + 1,
-      estimatedWait: pos === -1 ? null : pos * TOKEN_TTL_SECONDS,
+      estimatedWait: pos === -1 ? null : (ev.active.size + pos) * TOKEN_TTL_SECONDS,
     })
   }
 }
@@ -84,6 +84,34 @@ async function evaluateQueue(eventId, io) {
     io.to(next).emit("granted", { token, expiresAt: expiresAt.toISOString() })
   }
 
+  // Check for expired tokens in database and notify clients
+  if (connection) {
+    try {
+      const [expiredSessions] = await connection.execute(
+        'SELECT socket_id FROM active_sessions WHERE event_id = ? AND expires_at < NOW()',
+        [eventId]
+      )
+      
+      for (const session of expiredSessions) {
+        const sid = session.socket_id
+        if (ev.active.has(sid)) {
+          ev.active.delete(sid)
+          io.to(sid).emit("token_expired")
+        }
+      }
+      
+      // Clean up expired sessions from database
+      if (expiredSessions.length > 0) {
+        await connection.execute(
+          'DELETE FROM active_sessions WHERE event_id = ? AND expires_at < NOW()',
+          [eventId]
+        )
+      }
+    } catch (error) {
+      console.error('DB error checking expired tokens:', error)
+    }
+  }
+
   // If too many active (rare), revoke oldest
   if (ev.active.size > CONCURRENT_ACTIVE) {
     const toRevoke = Array.from(ev.active).slice(CONCURRENT_ACTIVE)
@@ -135,6 +163,13 @@ export async function GET(req) {
 
     global.io = io
 
+    // Periodikus token ellenőrzés minden 5 másodpercben
+    setInterval(async () => {
+      for (const eventId of Object.keys(events)) {
+        await evaluateQueue(eventId, io)
+      }
+    }, 5000)
+
     io.on("connection", (socket) => {
       console.log("Csatlakozott:", socket.id)
 
@@ -226,7 +261,7 @@ export async function GET(req) {
         io.to(socket.id).emit("queue_update", {
           activeCount: ev.sockets.size,
           position: pos === -1 ? null : pos + 1,
-          estimatedWait: pos === -1 ? null : pos * TOKEN_TTL_SECONDS,
+          estimatedWait: pos === -1 ? null : (ev.active.size + pos) * TOKEN_TTL_SECONDS,
         })
       })
 

app/event/[id]/page.tsx

@@ -8,6 +8,13 @@ export default function EventPage() {
   const router = useRouter();
   const eventId = params.id as string;
 
+  // Helper function to format seconds to HH:MM format
+  const formatTime = (seconds: number): string => {
+    const hours = Math.floor(seconds / 3600);
+    const minutes = Math.floor((seconds % 3600) / 60);
+    return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`;
+  };
+
   const [connected, setConnected] = useState(false);
   const [position, setPosition] = useState<number | null>(null);
   const [estimatedWait, setEstimatedWait] = useState<number | null>(null);
@@ -94,6 +101,14 @@ export default function EventPage() {
           setTokenExpiry(null);
           localStorage.removeItem("event_token");
         });
+
+        socket.on("token_expired", () => {
+          setHasAccess(false);
+          setTokenExpiry(null);
+          localStorage.removeItem("event_token");
+          // Redirect to homepage
+          window.location.href = "/";
+        });
       })
       .catch(error => {
         console.error("Socket initialization error:", error);
@@ -105,7 +120,7 @@ export default function EventPage() {
     };
   }, [eventId, loading]);
 
-  // Token expiry timer
+  // Token expiry timer - ellenőrzés minden másodpercben
   useEffect(() => {
     if (!tokenExpiry) return;
     const id = setInterval(() => {
@@ -114,6 +129,11 @@ export default function EventPage() {
         setHasAccess(false);
         setTokenExpiry(null);
         localStorage.removeItem("event_token");
+        // Disconnect socket and redirect to homepage
+        if (socketRef.current) {
+          socketRef.current.disconnect();
+        }
+        window.location.href = "/";
       }
     }, 1000);
     return () => clearInterval(id);
@@ -212,7 +232,7 @@ export default function EventPage() {
                     <p className="text-xl text-white/80">Helyed a várakozási sorban</p>
                     {estimatedWait && (
                       <p className="text-white/60 mt-2">
-                        Becsült várakozási idő: <span className="font-mono">{Math.ceil(estimatedWait)}s</span>
+                        Becsült várakozási idő: <span className="font-mono">{formatTime(Math.ceil(estimatedWait))}</span>
                       </p>
                     )}
                   </>
@@ -242,7 +262,7 @@ export default function EventPage() {
                 </div>
                 <div className="bg-white/5 rounded-2xl p-4 text-center">
                   <div className="text-2xl font-bold text-white">
-                    {estimatedWait ? `${Math.ceil(estimatedWait)}s` : '—'}
+                    {estimatedWait ? formatTime(Math.ceil(estimatedWait)) : '—'}
                   </div>
                   <div className="text-sm text-white/60">Várható idő</div>
                 </div>