Files
webshop/shop/components/inactivity-tracker.tsx
DanielS 62e3c7804a
All checks were successful
Staging Build / build (push) Successful in 2m16s
feat: fix logout button, inactivity tracker, and concurrent session termination
2026-06-24 00:15:59 +02:00

99 lines
3.2 KiB
TypeScript

"use client";
import { useEffect } from "react";
import { createBrowserClient } from "@supabase/ssr";
import { useRouter } from "next/navigation";
import { signOut } from "@/lib/actions/auth";
export function InactivityTracker() {
const router = useRouter();
// Supabase URL & Anon Key auslesen (für Browser-Client)
const supabaseUrl = process.env.SUPABASE_URL || process.env.NEXT_PUBLIC_SUPABASE_URL;
const supabaseAnonKey = process.env.SUPABASE_ANON_KEY || process.env.NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY || process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY;
// Supabase URL Auflösung inline
let resolvedUrl = supabaseUrl;
if (resolvedUrl && typeof window !== "undefined") {
try {
const parsed = new URL(resolvedUrl);
if (parsed.hostname === "supabase-kong" || parsed.hostname === "kong") {
parsed.hostname = window.location.hostname;
resolvedUrl = parsed.toString().replace(/\/$/, "");
}
} catch {
resolvedUrl = resolvedUrl
.replace("//supabase-kong", `//${window.location.hostname}`)
.replace("//kong", `//${window.location.hostname}`);
}
}
// Browser Client inline erstellen
const supabase = createBrowserClient(
resolvedUrl!,
supabaseAnonKey!,
{
cookieOptions: {
name: "webshop-auth-token",
},
}
);
useEffect(() => {
const INACTIVITY_LIMIT = 5 * 60 * 1000; // 5 Minuten in ms
const updateActivity = () => {
localStorage.setItem("last_activity", Date.now().toString());
};
// Events zum Tracken der Benutzerinteraktion
const events = ["mousemove", "keydown", "mousedown", "touchstart", "scroll", "click"];
events.forEach((event) => window.addEventListener(event, updateActivity));
// Aktivitätszeitstempel beim Mounten initialisieren
updateActivity();
// Regelmäßige Überprüfung der Inaktivität
const interval = setInterval(async () => {
const { data: { session } } = await supabase.auth.getSession();
if (!session) return; // Nicht eingeloggt, keine Prüfung nötig
// Prüfen, ob die Session auf dem Server noch gültig ist (z.B. wegen Login auf anderem Browser)
const { data: { user }, error } = await supabase.auth.getUser();
if (error || !user) {
try {
await signOut();
} catch (e) {
console.error("Fehler beim Inactivity-Server-Signout:", e);
}
await supabase.auth.signOut();
localStorage.removeItem("last_activity");
router.push("/");
router.refresh();
return;
}
const lastActivity = Number(localStorage.getItem("last_activity") || Date.now());
if (Date.now() - lastActivity > INACTIVITY_LIMIT) {
// Bei Überschreitung abmelden
try {
await signOut();
} catch (e) {
console.error("Fehler beim Inactivity-Server-Signout:", e);
}
await supabase.auth.signOut();
localStorage.removeItem("last_activity");
router.push("/");
router.refresh();
}
}, 5000); // Prüfung alle 5 Sekunden
return () => {
events.forEach((event) => window.removeEventListener(event, updateActivity));
clearInterval(interval);
};
}, [supabase, router]);
return null;
}