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

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>